From 5b69b6b2f17f0e47e241e9ce561e9a0346fb27b4 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Thu, 4 Nov 2021 20:52:23 +0800
Subject: [PATCH] =?UTF-8?q?Drawer=E7=9A=84=E6=96=87=E7=AB=A0=E5=88=86?=
 =?UTF-8?q?=E7=B1=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Drawer.js  | 12 +++++++++---
 components/TopNav.js  |  4 ++--
 layouts/BaseLayout.js |  2 +-
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/components/Drawer.js b/components/Drawer.js
index fa809a99..7d0964f2 100644
--- a/components/Drawer.js
+++ b/components/Drawer.js
@@ -1,5 +1,3 @@
-import Link from 'next/link'
-import BLOG from '@/blog.config'
 import SearchInput from '@/components/SearchInput'
 import MenuButtonGroup from '@/components/MenuButtonGroup'
 import React, { useImperativeHandle, useState } from 'react'
@@ -7,13 +5,14 @@ import InfoCard from '@/components/InfoCard'
 import TagList from '@/components/TagList'
 import Logo from '@/components/Logo'
 import LatestPosts from '@/components/LatestPosts'
+import PostsCategories from '@/components/PostsCategories'
 
 /**
  * 抽屉面板，可以从侧面拉出
  * @returns {JSX.Element}
  * @constructor
  */
-const Drawer = ({ post, currentTag, cRef, tags, posts }) => {
+const Drawer = ({ post, currentTag, cRef, tags, posts, categories, currentCategory }) => {
   // 暴露给父组件 通过cRef.current.handleMenuClick 调用
   useImperativeHandle(cRef, () => {
     return {
@@ -62,6 +61,13 @@ const Drawer = ({ post, currentTag, cRef, tags, posts }) => {
             </div>
           )}
 
+          {/* 分类  */}
+          {categories && (
+            <div className='mt-2'>
+              <PostsCategories currentCategory={currentCategory} categories={categories}/>
+            </div>
+          )}
+
           {/* 标签云  */}
           {tags && (
             <div className='mt-2'>
diff --git a/components/TopNav.js b/components/TopNav.js
index ccf036fa..a1673e5a 100644
--- a/components/TopNav.js
+++ b/components/TopNav.js
@@ -5,13 +5,13 @@ import Drawer from '@/components/Drawer'
 import DrawerRight from '@/components/DrawerRight'
 import Logo from '@/components/Logo'
 
-const TopNav = ({ tags, currentTag, post, posts, currentSearch }) => {
+const TopNav = ({ tags, currentTag, post, posts, currentSearch, categories, currentCategory }) => {
   const drawer = useRef()
   const drawerRight = useRef()
 
   return (<>
     {/* 侧面抽屉 */}
-    <Drawer post={post} currentTag={currentTag} cRef={drawer} tags={tags} posts={posts}/>
+    <Drawer post={post} currentTag={currentTag} cRef={drawer} tags={tags} posts={posts} categories={categories} currentCategory={currentCategory}/>
     <DrawerRight post={post} cRef={drawerRight}/>
 
     {/* 导航栏 */}
diff --git a/layouts/BaseLayout.js b/layouts/BaseLayout.js
index 522abf6a..64ae8f6d 100644
--- a/layouts/BaseLayout.js
+++ b/layouts/BaseLayout.js
@@ -37,7 +37,7 @@ const BaseLayout = ({ children, layout, fullWidth, tags, meta, post, totalPosts,
     <div id='wrapper' className={[BLOG.font, theme].join(' ')}>
       <CommonHead meta={meta} />
 
-      <TopNav tags={tags} post={post} posts={totalPosts} currentSearch={currentSearch} />
+      <TopNav tags={tags} post={post} posts={totalPosts} currentSearch={currentSearch} categories={categories} currentCategory={currentCategory}/>
       {/* Middle Wrapper */}
       <main className='flex dark:bg-black'>
         <SideBar tags={tags} post={post} posts={totalPosts} categories={categories} currentCategory={currentCategory} />