From 40db3aae2bfcdb70dd4389a3224ac8333659dfc2 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Thu, 4 Nov 2021 14:06:32 +0800
Subject: [PATCH] =?UTF-8?q?feature:=20=E4=BF=AE=E5=A4=8D=E9=94=99=E8=AF=AF?=
 =?UTF-8?q?=E5=8D=95=E8=AF=8D=EF=BC=8C=E4=BF=AE=E5=A4=8Dslug=E9=A1=B5?=
 =?UTF-8?q?=E9=94=99=E8=AF=AF=E7=9A=84allPosts?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Drawer.js                          | 4 ++--
 components/{LastedPosts.js => LatestPosts.js} | 8 ++++----
 components/SearchInput.js                     | 4 +++-
 components/SideBar.js                         | 4 ++--
 pages/article/[slug].js                       | 6 +++---
 5 files changed, 14 insertions(+), 12 deletions(-)
 rename components/{LastedPosts.js => LatestPosts.js} (88%)

diff --git a/components/Drawer.js b/components/Drawer.js
index 1375e7d2..3ac656be 100644
--- a/components/Drawer.js
+++ b/components/Drawer.js
@@ -6,7 +6,7 @@ import React, { useImperativeHandle, useState } from 'react'
 import InfoCard from '@/components/InfoCard'
 import TagList from '@/components/TagList'
 import Logo from '@/components/Logo'
-import LastedPosts from '@/components/LastedPosts'
+import LatestPosts from '@/components/LatestPosts'
 
 /**
  * 抽屉面板，可以从侧面拉出
@@ -58,7 +58,7 @@ const Drawer = ({ post, currentTag, cRef, tags, posts }) => {
           {/* 最新文章 */}
           {posts && (
             <div className='mt-2 sticky top-0'>
-              <LastedPosts posts={posts}/>
+              <LatestPosts posts={posts}/>
             </div>
           )}
 
diff --git a/components/LastedPosts.js b/components/LatestPosts.js
similarity index 88%
rename from components/LastedPosts.js
rename to components/LatestPosts.js
index 88e1d4c6..603e6bbd 100644
--- a/components/LastedPosts.js
+++ b/components/LatestPosts.js
@@ -8,7 +8,7 @@ import { useRouter } from 'next/router'
  * @param posts
  * @constructor
  */
-const LastedPosts = ({ posts }) => {
+const LatestPosts = ({ posts }) => {
   // 按时间排序
   if (posts) {
     posts = posts.sort((a, b) => {
@@ -28,11 +28,11 @@ const LastedPosts = ({ posts }) => {
       {posts.map(post => {
         return (
           <Link key={post.id} title={post.title} href={`${BLOG.path}/article/${post.slug}`} >
-            <div className={(router.asPath === `${BLOG.path}/article/${post.slug}` ? 'bg-gray-200 dark:bg-black' : '') + ' text-xs leading-5 py-1.5 px-5 cursor-pointer hover:underline flex'}>
+            <div className={(router.asPath === `${BLOG.path}/article/${post.slug}` ? 'bg-gray-200 dark:bg-black' : '') + ' text-xs leading-5 py-1.5 px-5 flex'}>
               <div className='mr-2 text-gray-500'>
                 {formatDateFmt(post.lastEditedTime, 'yyyy/MM/dd')}
               </div>
-              <div className='text-sm flex w-50 overflow-x-hidden whitespace-nowrap dark:text-gray-300'>
+              <div className='text-sm flex w-50 overflow-x-hidden whitespace-nowrap dark:text-gray-300 cursor-pointer hover:underline'>
                 {post.title}
               </div>
             </div>
@@ -42,4 +42,4 @@ const LastedPosts = ({ posts }) => {
     </div>
   </>
 }
-export default LastedPosts
+export default LatestPosts
diff --git a/components/SearchInput.js b/components/SearchInput.js
index 0a64363c..df0799a3 100644
--- a/components/SearchInput.js
+++ b/components/SearchInput.js
@@ -17,8 +17,10 @@ const SearchInput = ({ currentTag, currentSearch }) => {
     }
   }
   const handleKeyUp = (e) => {
-    if (e.keyCode === 13) {
+    if (e.keyCode === 13) { // 回车
       handleSearch(searchInputRef.current.value)
+    } else if (e.keyCode === 27) { // ESC
+      cleanSearch()
     }
   }
   const cleanSearch = () => {
diff --git a/components/SideBar.js b/components/SideBar.js
index 781e8d1a..ab6632ee 100644
--- a/components/SideBar.js
+++ b/components/SideBar.js
@@ -2,7 +2,7 @@ import React from 'react'
 import MenuButtonGroup from '@/components/MenuButtonGroup'
 import InfoCard from '@/components/InfoCard'
 import TagList from '@/components/TagList'
-import LastedPosts from '@/components/LastedPosts'
+import LatestPosts from '@/components/LatestPosts'
 
 const SideBar = ({ tags, currentTag, post, posts }) => {
   // 按时间排序
@@ -29,7 +29,7 @@ const SideBar = ({ tags, currentTag, post, posts }) => {
         {/* 最新文章 */}
         {posts && (
           <div className='mt-2'>
-            <LastedPosts posts={posts}/>
+            <LatestPosts posts={posts}/>
           </div>
         )}
 
diff --git a/pages/article/[slug].js b/pages/article/[slug].js
index 84604100..71eb2e3e 100644
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -27,7 +27,7 @@ import 'prismjs/components/prism-typescript'
 const mapPageUrl = id => {
   return 'https://www.notion.so/' + id.replace(/-/g, '')
 }
-const BlogPost = ({ post, blockMap, tags, prev, next, posts }) => {
+const ArticleDetail = ({ post, blockMap, tags, prev, next, posts }) => {
   if (!post) {
     return <Custom404/>
   }
@@ -39,7 +39,7 @@ const BlogPost = ({ post, blockMap, tags, prev, next, posts }) => {
   const targetRef = useRef(null)
   const url = BLOG.link + useRouter().asPath
 
-  return <BaseLayout meta={meta} tags={tags} totalPosts={post} posts={posts}>
+  return <BaseLayout meta={meta} tags={tags} post={post} totalPosts={posts} >
     {/* 阅读进度条 */}
     <Progress targetRef={targetRef} />
 
@@ -209,4 +209,4 @@ export async function getStaticProps ({ params: { slug } }) {
   }
 }
 
-export default BlogPost
+export default ArticleDetail