From bbde07acc196daa5b4bcdfa2df4267e1c942596b Mon Sep 17 00:00:00 2001
From: MoonbamiOfficial <141120384+MoonbamiOfficial@users.noreply.github.com>
Date: Mon, 12 Feb 2024 19:11:40 +0800
Subject: [PATCH] fix: useFetch hook cannot handle two api calls

---
 app/api/{abouts => about}/[id]/route.ts |  4 ++--
 app/api/{abouts => about}/route.ts      |  4 ++--
 app/page.tsx                            | 17 +++++++++++++----
 3 files changed, 17 insertions(+), 8 deletions(-)
 rename app/api/{abouts => about}/[id]/route.ts (89%)
 rename app/api/{abouts => about}/route.ts (89%)

diff --git a/app/api/abouts/[id]/route.ts b/app/api/about/[id]/route.ts
similarity index 89%
rename from app/api/abouts/[id]/route.ts
rename to app/api/about/[id]/route.ts
index 2ed4bb9..d945218 100644
--- a/app/api/abouts/[id]/route.ts
+++ b/app/api/about/[id]/route.ts
@@ -36,6 +36,6 @@ export async function PUT(request: Request, { params }: Params) {
 export async function GET(request: Request, { params }: Params  ) {
   const { id } = params;
   await connectMongoDB();
-  const abouts = await About.findOne({ _id: id });
-  return NextResponse.json({ abouts }, { status: 200 });
+  const about = await About.findOne({ _id: id });
+  return NextResponse.json({ about }, { status: 200 });
 };
\ No newline at end of file
diff --git a/app/api/abouts/route.ts b/app/api/about/route.ts
similarity index 89%
rename from app/api/abouts/route.ts
rename to app/api/about/route.ts
index ec95cf3..3e00efe 100644
--- a/app/api/abouts/route.ts
+++ b/app/api/about/route.ts
@@ -33,6 +33,6 @@ export async function POST(request: Request, response: Response) {
 
 export async function GET() {
   await connectMongoDB();
-  const abouts = await About.find();
-  return NextResponse.json({ abouts })
+  const about = await About.find();
+  return NextResponse.json({ about })
 };
\ No newline at end of file
diff --git a/app/page.tsx b/app/page.tsx
index 3422355..ba8922a 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -27,9 +27,18 @@ import About from '@components/about/About';
 import { TopicType } from '@customs/topic';
 import { AboutType } from '@customs/about';
 
+const handleTopics = async () => {
+  const data = await useFetch("/api/topics");
+  return data;
+}
+const handleAboutMe = async () => {
+  const data = await useFetch("/api/about");
+  return data;
+}
+
 const Home = async () => {
-  const { topics } = await useFetch("/api/topics")
-  // const { abouts } = await useFetch("/api/abouts")
+  const { topics } = await handleTopics()
+  const { about } = await handleAboutMe()
   return (
     <>
       <Image priority src={ AkaneDream } alt="" id="home-bg" width={'3000'} height={'3000'} className="w-full h-[930px] object-cover absolute z-[-100] opacity-[0.5] dark:opacity-[0.3] " />
@@ -51,7 +60,7 @@ const Home = async () => {
             <div className="about-me w-full flex flex-col lg:flex-row justify-between items-center lg:items-start 2xl:justify-evenly ">
               <TopicImage src={ Me } />
               <div className="about-me flex flex-col gap-[30px] ">
-                {/* {abouts.map((about: AboutType) => (
+                {about.map((about: AboutType) => (
                   <About 
                     key={ about._id }
                     displayName={ about.displayName }
@@ -64,7 +73,7 @@ const Home = async () => {
                     nationality={ about.nationality }
                     status={ about.status }
                     languages={ about.languages }/>
-                ))} */}
+                ))}
               </div>
             </div>
             <div className="topics w-full grid grid-cols-1 lg:grid-cols-2 gap-10 ">