From c6d652c5f6bc6d2b115f97ad3e5492541fa12366 Mon Sep 17 00:00:00 2001
From: tangly1024 <mail@tangly1024.com>
Date: Sun, 26 Mar 2023 16:23:06 +0800
Subject: [PATCH] simple-theme article-around

---
 themes/medium/components/ArticleAround.js |  2 +-
 themes/simple/LayoutSlug.js               |  4 ++-
 themes/simple/components/ArticleAround.js | 32 +++++++++++++++++++++++
 3 files changed, 36 insertions(+), 2 deletions(-)
 create mode 100644 themes/simple/components/ArticleAround.js

diff --git a/themes/medium/components/ArticleAround.js b/themes/medium/components/ArticleAround.js
index 45477653..95b6f83f 100644
--- a/themes/medium/components/ArticleAround.js
+++ b/themes/medium/components/ArticleAround.js
@@ -28,5 +28,5 @@ export default function ArticleAround ({ prev, next }) {
 
       </Link>
     </section>
-  );
+  )
 }
diff --git a/themes/simple/LayoutSlug.js b/themes/simple/LayoutSlug.js
index 6b46a1a2..6cf7c82b 100644
--- a/themes/simple/LayoutSlug.js
+++ b/themes/simple/LayoutSlug.js
@@ -3,9 +3,10 @@ import { ArticleLock } from './components/ArticleLock'
 import NotionPage from '@/components/NotionPage'
 import { ArticleInfo } from './components/ArticleInfo'
 import Comment from '@/components/Comment'
+import ArticleAround from './components/ArticleAround'
 
 export const LayoutSlug = props => {
-  const { post, lock, validPassword } = props
+  const { post, lock, validPassword, prev, next } = props
 
   if (!post) {
     return <LayoutBase {...props} />
@@ -21,6 +22,7 @@ export const LayoutSlug = props => {
                     {post && <>
                         <ArticleInfo post={post} />
                         <NotionPage post={post} />
+                        {post.type === 'Post' && <ArticleAround prev={prev} next={next} />}
                         <Comment frontMatter={post}/>
                     </>}
                 </div>}
diff --git a/themes/simple/components/ArticleAround.js b/themes/simple/components/ArticleAround.js
new file mode 100644
index 00000000..b4cee232
--- /dev/null
+++ b/themes/simple/components/ArticleAround.js
@@ -0,0 +1,32 @@
+import Link from 'next/link'
+
+/**
+ * 上一篇，下一篇文章
+ * @param {prev,next} param0
+ * @returns
+ */
+export default function ArticleAround({ prev, next }) {
+  if (!prev || !next) {
+    return <></>
+  }
+  return (
+        <section className='text-gray-800 dark:text-gray-400 h-12 flex items-center justify-between space-x-5 my-4'>
+            {prev && <Link
+                href={`/${prev.slug}`}
+                passHref
+                className='text-sm cursor-pointer justify-start items-center flex hover:underline duration-300'>
+
+                <i className='mr-1 fas fa-angle-double-left' />{prev.title}
+
+            </Link>}
+            {next && <Link
+                href={`/${next.slug}`}
+                passHref
+                className='text-sm cursor-pointer justify-end items-center flex hover:underline duration-300'>
+                {next.title}
+                <i className='ml-1 my-1 fas fa-angle-double-right' />
+
+            </Link>}
+        </section>
+  )
+}