From bac6a044a07f949bc6b5f2a75a46b2364eaf3bc3 Mon Sep 17 00:00:00 2001
From: PrinOrange <prinorange@outlook.com>
Date: Sat, 6 Jan 2024 14:36:03 +0800
Subject: [PATCH] merge the tags index page's content into the posts index page

---
 components/utils/NavBar.tsx |  8 ++----
 pages/posts/[[...slug]].tsx | 20 ++++++++++++-
 pages/tags/index.tsx        | 56 -------------------------------------
 3 files changed, 21 insertions(+), 63 deletions(-)
 delete mode 100644 pages/tags/index.tsx

diff --git a/components/utils/NavBar.tsx b/components/utils/NavBar.tsx
index a245527..907ca8c 100644
--- a/components/utils/NavBar.tsx
+++ b/components/utils/NavBar.tsx
@@ -12,10 +12,6 @@ const MenuItems = [
     title: "HOME",
     href: "/",
   },
-  {
-    title: "TAGS",
-    href: "/tags",
-  },
   {
     title: "POSTS",
     href: "/posts",
@@ -50,7 +46,7 @@ export const NavBar = () => {
             <Link
               href={menuItem.href}
               key={nanoid()}
-              className="border-b-sky-600 font-bold hover:text-sky-600 dark:hover:border-b-sky-500 dark:hover:text-sky-500 mx-1 my-auto px-2"
+              className="border-b-sky-600 font-bold hover:text-sky-600 dark:hover:border-b-sky-500 dark:hover:text-sky-500 mx-2 my-auto px-2"
               onClick={() => setIsSideNavOpen(false)}
             >
               {menuItem.title}
@@ -59,7 +55,7 @@ export const NavBar = () => {
           <Link
             href={"/search"}
             key={nanoid()}
-            className="cursor-pointer mx-1 rounded-full p-1 text-3xl text-black hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
+            className="cursor-pointer mx-2 rounded-full p-1 text-3xl text-black hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
           >
             <MdSearch />
           </Link>
diff --git a/pages/posts/[[...slug]].tsx b/pages/posts/[[...slug]].tsx
index c3064ae..6e49c45 100644
--- a/pages/posts/[[...slug]].tsx
+++ b/pages/posts/[[...slug]].tsx
@@ -5,12 +5,14 @@ import { Footer } from "@/components/utils/Footer";
 import { NavBar } from "@/components/utils/NavBar";
 import { PostList } from "@/components/utils/PostList";
 import { SEO } from "@/components/utils/SEO";
+import { TagBadge } from "@/components/utils/TagBadge";
 import { PostCountPerPagination } from "@/consts/consts";
 import { Config } from "@/data/config";
 import { sortedPosts } from "@/lib/post-process";
 import { paginateArray } from "@/lib/utils";
-import { fontFangZhengXiaoBiaoSongCN } from "@/styles/font";
+import { fontFangZhengXiaoBiaoSongCN, fontSourceSerifScreenCN } from "@/styles/font";
 import { TPostListItem } from "@/types/post-list";
+import { nanoid } from "nanoid";
 import { GetStaticPaths, GetStaticProps } from "next";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
@@ -21,6 +23,7 @@ type PostsPageProps = {
   pageAmount: number;
   pageNumber: number;
   postList: TPostListItem[];
+  tagList: { name: string; count: number }[];
 };
 
 export default function PostsPage(props: PostsPageProps) {
@@ -57,6 +60,12 @@ export default function PostsPage(props: PostsPageProps) {
           {"ALL POSTS"}
         </h2>
         <hr />
+        <div className={`my-5 flex flex-wrap justify-center px-2 ${fontSourceSerifScreenCN.className}`}>
+          {props.tagList.map((item) => (
+            <TagBadge key={`tag-badge-${nanoid()}`} name={item.name} size="md" count={item.count} />
+          ))}
+        </div>
+        <hr />
         <PostList data={props.postList} />
         <div className="my-5 flex justify-between text-base font-bold">
           {props.pageNumber !== 1 && (
@@ -110,11 +119,20 @@ export const getStaticProps: GetStaticProps<PostsPageProps> = async (context) =>
 
   const pageAmount = Math.ceil(sortedPosts.allPostList.length / PostCountPerPagination);
 
+  const tagList: {
+    name: string;
+    count: number;
+  }[] = Object.keys(sortedPosts.tagSubPostSet).map((tagName) => ({
+    name: tagName,
+    count: sortedPosts.tagSubPostSet[tagName].length,
+  }));
+
   return {
     props: {
       pageAmount: pageAmount,
       pageNumber: pageNumber,
       postList: postList,
+      tagList: tagList,
     },
   };
 };
diff --git a/pages/tags/index.tsx b/pages/tags/index.tsx
deleted file mode 100644
index 48e0bbd..0000000
--- a/pages/tags/index.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import { ContentContainer, Page } from "@/components/layouts/layouts";
-import { Footer } from "@/components/utils/Footer";
-import { NavBar } from "@/components/utils/NavBar";
-import { SEO } from "@/components/utils/SEO";
-import { TagBadge } from "@/components/utils/TagBadge";
-import { Config } from "@/data/config";
-import { sortedPosts } from "@/lib/post-process";
-import { fontFangZhengXiaoBiaoSongCN, fontSourceSerifScreenCN } from "@/styles/font";
-import { nanoid } from "nanoid";
-import { GetStaticProps } from "next";
-import { AiOutlineTags } from "react-icons/ai";
-
-type TagsIndexPageProps = {
-  tagList: { name: string; count: number }[];
-};
-
-export default function TagsIndexPage(props: TagsIndexPageProps) {
-  return (
-    <Page>
-      <SEO
-        title={`${Config.SiteTitle} - All tags`}
-        description={"Here is the list page for all tags which sorts all posts to every catagories."}
-        coverURL={Config.PageCovers.websiteCoverURL}
-      />
-      <ContentContainer>
-        <NavBar />
-        <h2 className={`my-5 flex justify-center text-2xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}>
-          <AiOutlineTags className="mx-2 my-auto" />
-          {"ALL TAGS"}
-        </h2>
-        <div className={`my-5 flex flex-wrap justify-center px-2 ${fontSourceSerifScreenCN.className}`}>
-          {props.tagList.map((item) => (
-            <TagBadge key={`tag-badge-${nanoid()}`} name={item.name} size="md" count={item.count} />
-          ))}
-        </div>
-      </ContentContainer>
-      <Footer />
-    </Page>
-  );
-}
-
-export const getStaticProps: GetStaticProps<TagsIndexPageProps> = async (context) => {
-  const tagList: {
-    name: string;
-    count: number;
-  }[] = Object.keys(sortedPosts.tagSubPostSet).map((tagName) => ({
-    name: tagName,
-    count: sortedPosts.tagSubPostSet[tagName].length,
-  }));
-
-  return {
-    props: {
-      tagList: tagList,
-    },
-  };
-};