From 89c85cee19b5124104fd76745fde488e152e4827 Mon Sep 17 00:00:00 2001
From: Collection50 <fkaus65@naver.com>
Date: Wed, 12 Jun 2024 17:55:55 +0900
Subject: [PATCH 1/4] =?UTF-8?q?fix:=20nextjs=EC=9D=98=20Link=EB=A5=BC=20pr?=
 =?UTF-8?q?efetch=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/MouseImageGallery/index.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/MouseImageGallery/index.tsx b/src/components/MouseImageGallery/index.tsx
index d2220b3..97ddbc1 100644
--- a/src/components/MouseImageGallery/index.tsx
+++ b/src/components/MouseImageGallery/index.tsx
@@ -103,7 +103,11 @@ export default function MouseImageGallery() {
             <LikeIcon color="#000" />
           </Link>
 
-          <Link href={`/blog/${blogId}`} className="flex gap-10 z-[100]">
+          <Link
+            href={`/blog/${blogId}`}
+            className="flex gap-10 z-[100]"
+            prefetch={false}
+          >
             <Mypage />
           </Link>
 

From f8330427eab317a8e11fdb153f79600b3cf8ea46 Mon Sep 17 00:00:00 2001
From: Collection50 <fkaus65@naver.com>
Date: Wed, 12 Jun 2024 17:57:53 +0900
Subject: [PATCH 2/4] =?UTF-8?q?fix:=20=EA=B0=9C=EC=9D=B8=20=EB=B8=94?=
 =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20=ED=99=88=ED=8E=98=EC=9D=B4=EC=A7=80?=
 =?UTF-8?q?=EC=9D=98=20albums,=20stories,=20boarder=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/blog/[blogId]/components/Albums/Slider.tsx   | 11 ++++++++++-
 src/app/blog/[blogId]/components/Albums/index.tsx    | 12 +++---------
 .../blog/[blogId]/components/BlogFetcher/types.ts    |  2 +-
 src/app/blog/[blogId]/components/Board/index.tsx     | 11 +++++++----
 src/app/blog/[blogId]/components/StoryBox/index.tsx  |  9 +++++----
 src/app/blog/[blogId]/page.tsx                       |  2 ++
 6 files changed, 28 insertions(+), 19 deletions(-)

diff --git a/src/app/blog/[blogId]/components/Albums/Slider.tsx b/src/app/blog/[blogId]/components/Albums/Slider.tsx
index 6554186..b3d8957 100644
--- a/src/app/blog/[blogId]/components/Albums/Slider.tsx
+++ b/src/app/blog/[blogId]/components/Albums/Slider.tsx
@@ -5,8 +5,15 @@ import Image from 'next/image';
 import { Button } from '@/components/Common';
 import { generateId } from '@/utils';
 import { useSlider } from './useSlider';
+import { useBlogPageContext } from '../BlogFetcher/BlogContext';
+
+export default function Slider() {
+  const { postItems } = useBlogPageContext();
+
+  const photos = postItems.flatMap(({ photoUrl }) =>
+    photoUrl ? photoUrl.filter(Boolean) : [],
+  );
 
-export default function Slider({ photos }: { photos: string[] }) {
   const { currentIndex, nextSlide, prevSlide } = useSlider(photos.length);
   const photoCount = photos.length;
   const slideWidth = 100 / photoCount;
@@ -30,11 +37,13 @@ export default function Slider({ photos }: { photos: string[] }) {
                 src={photo}
                 layout="fill"
                 objectFit="cover"
+                className="rounded-10"
               />
             </div>
           </div>
         ))}
       </div>
+
       {photoCount > 5 && (
         <div className="absolute inset-0 flex items-center justify-between px-4">
           <Button
diff --git a/src/app/blog/[blogId]/components/Albums/index.tsx b/src/app/blog/[blogId]/components/Albums/index.tsx
index 3f4d39c..ab1e184 100644
--- a/src/app/blog/[blogId]/components/Albums/index.tsx
+++ b/src/app/blog/[blogId]/components/Albums/index.tsx
@@ -1,23 +1,17 @@
 'use client';
 
-import { useBlogPageContext } from '../BlogFetcher/BlogContext';
 import Slider from './Slider';
 
 export default function Albums() {
-  const { postItems } = useBlogPageContext();
-
-  const photos = postItems.flatMap(({ photo }) =>
-    photo ? photo.filter(Boolean) : [],
-  );
-
   return (
-    <article className="flex flex-col w-full gap-20 px-100 items-start">
+    <article className="flex flex-col w-full gap-20 px-100 items-start mt-30 overflow-scroll">
       <div className="flex flex-col  justify-center items-center">
         <div className="font-extrabold text-4xl">Albums</div>
         <p className="w-135 h-3 bg-primary mb-2" />
         <p className="w-145 h-3 bg-primary mb-2" />
       </div>
-      <Slider photos={photos} />
+
+      <Slider />
     </article>
   );
 }
diff --git a/src/app/blog/[blogId]/components/BlogFetcher/types.ts b/src/app/blog/[blogId]/components/BlogFetcher/types.ts
index 1d6adbc..645d2b2 100644
--- a/src/app/blog/[blogId]/components/BlogFetcher/types.ts
+++ b/src/app/blog/[blogId]/components/BlogFetcher/types.ts
@@ -15,7 +15,7 @@ export interface BlogPageInfo {
       postId: number;
       title: string;
       preview: string;
-      photo: string[];
+      photoUrl: string[];
     },
   ];
   hashtagNames: string[];
diff --git a/src/app/blog/[blogId]/components/Board/index.tsx b/src/app/blog/[blogId]/components/Board/index.tsx
index 6b0e616..ea6b142 100644
--- a/src/app/blog/[blogId]/components/Board/index.tsx
+++ b/src/app/blog/[blogId]/components/Board/index.tsx
@@ -1,15 +1,18 @@
 'use client';
 
 import { useState } from 'react';
+import { AsyncBoundaryWithQuery } from '@/react-utils';
 import { BoardFetcher } from '../BlogFetcher';
 import BoardContent from './BoardContent';
 
 export default function Board({ blogId }: { blogId: number }) {
-  const [page, setPage] = useState<number>(1);
+  const [page, setPage] = useState<number>(0);
 
   return (
-    <BoardFetcher blogId={blogId} page={page}>
-      <BoardContent page={page} setPage={setPage} />
-    </BoardFetcher>
+    <AsyncBoundaryWithQuery>
+      <BoardFetcher blogId={blogId} page={page}>
+        <BoardContent page={page} setPage={setPage} />
+      </BoardFetcher>
+    </AsyncBoundaryWithQuery>
   );
 }
diff --git a/src/app/blog/[blogId]/components/StoryBox/index.tsx b/src/app/blog/[blogId]/components/StoryBox/index.tsx
index b69acb0..694d497 100644
--- a/src/app/blog/[blogId]/components/StoryBox/index.tsx
+++ b/src/app/blog/[blogId]/components/StoryBox/index.tsx
@@ -3,12 +3,12 @@
 import { generateId } from '@/utils';
 import { useBlogPageContext } from '../BlogFetcher/BlogContext';
 
-export function Story({ title, content }: { title: string; content: string }) {
+export function Story({ title, preview }: { title: string; preview: string }) {
   return (
     <div className="h-140">
       <div className="h-30 text-xl font-bold ">{title}</div>
       <div className="my-5 h-100 white-space:normal break-words text-overflow">
-        {content}
+        {preview}
       </div>
     </div>
   );
@@ -26,9 +26,10 @@ export default function StoryBox() {
           <p className="w-140 h-3 bg-primary mb-2" />
         </div>
       </header>
+
       <article className="w-full grid grid-cols-2 gap-30 mt-40">
-        {postItems.map(({ preview, title }) => (
-          <Story key={generateId()} title={title} content={preview} />
+        {postItems.map((postItem) => (
+          <Story key={generateId()} {...postItem} />
         ))}
       </article>
     </section>
diff --git a/src/app/blog/[blogId]/page.tsx b/src/app/blog/[blogId]/page.tsx
index 614010e..bf90bf8 100644
--- a/src/app/blog/[blogId]/page.tsx
+++ b/src/app/blog/[blogId]/page.tsx
@@ -30,6 +30,7 @@ export default function Page() {
             <ProfileBox />
             <Tags />
           </section>
+
           <section className="relative flex flex-col h-full w-full mr-50">
             <div className="absolute top-0 right-0 py-4">
               <div className="flex flex-row gap-10 items-center">
@@ -40,6 +41,7 @@ export default function Page() {
                     </Button>
                   </Link>
                 )}
+
                 <Button
                   className="bg-secondary"
                   onClick={() => setShowBoard((prev) => !prev)}

From bee233eb13dc2bf4c783f5732318b6547a3ea37c Mon Sep 17 00:00:00 2001
From: Collection50 <fkaus65@naver.com>
Date: Wed, 12 Jun 2024 17:58:07 +0900
Subject: [PATCH 3/4] =?UTF-8?q?fix:=20=ED=8E=98=EC=9D=B4=EC=A7=80=EB=84=A4?=
 =?UTF-8?q?=EC=9D=B4=EC=85=98=20=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Common/Pagination/usePagination.ts        | 28 ++++++++++---------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/components/Common/Pagination/usePagination.ts b/src/components/Common/Pagination/usePagination.ts
index a5a7dbb..3655d54 100644
--- a/src/components/Common/Pagination/usePagination.ts
+++ b/src/components/Common/Pagination/usePagination.ts
@@ -39,21 +39,23 @@ export function usePagination({ ...props }: UsePaginationProp) {
   const pageSize = 10;
   const Component = as || 'div';
 
-  const startPage = useMemo(
-    () => Math.floor((page - 1) / pageSize) * pageSize + 1,
-    [page, pageSize],
-  );
+  const startPage = useMemo(() => {
+    if (total <= 1) return 1;
+    return Math.floor((page - 1) / pageSize) * pageSize + 1;
+  }, [page, pageSize, total]);
 
-  const endPage = useMemo(
-    () => Math.min(startPage + pageSize - 1, total),
-    [total, pageSize, startPage],
-  );
+  const endPage = useMemo(() => {
+    if (total <= 1) return 1;
+    return Math.min(startPage + pageSize - 1, total);
+  }, [total, pageSize, startPage]);
 
-  const displayedPages = useMemo(
-    () =>
-      Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i),
-    [startPage, endPage],
-  );
+  const displayedPages = useMemo(() => {
+    if (total <= 1) return [1];
+    return Array.from(
+      { length: endPage - startPage + 1 },
+      (_, i) => startPage + i,
+    );
+  }, [startPage, endPage, total]);
 
   const getBaseProps = useCallback(
     () => ({

From 5e5e5d6e5cfba3782dc53b6f8c8f5797ca70f575 Mon Sep 17 00:00:00 2001
From: Collection50 <fkaus65@naver.com>
Date: Wed, 12 Jun 2024 19:50:07 +0900
Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=EA=B5=AC=EB=8F=85=20=ED=8E=98?=
 =?UTF-8?q?=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EC=9D=B4=EB=AF=B8?=
 =?UTF-8?q?=EC=A7=80=EA=B0=80=20=EC=98=AC=EB=B0=94=EB=A5=B4=EA=B2=8C=20?=
 =?UTF-8?q?=EB=9C=A8=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../post/[postId]/components/PostDetailHeader/index.tsx     | 2 +-
 src/app/search/components/BlogList/index.tsx                | 5 +++--
 src/app/subscribe/components/Feed/FeedContent.tsx           | 6 +++---
 src/app/subscribe/components/SubscribeFetcher/types.ts      | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/app/blog/[blogId]/post/[postId]/components/PostDetailHeader/index.tsx b/src/app/blog/[blogId]/post/[postId]/components/PostDetailHeader/index.tsx
index 402bc35..ab8802b 100644
--- a/src/app/blog/[blogId]/post/[postId]/components/PostDetailHeader/index.tsx
+++ b/src/app/blog/[blogId]/post/[postId]/components/PostDetailHeader/index.tsx
@@ -50,7 +50,7 @@ export default function PostDetailHeader({ postId }: { postId: string }) {
         />
 
         <div className="flex items-center justify-between px-5 border-b-1 border-[#D3D2D1] py-10">
-          <div className="flex items-center gap-13">
+          <div className="flex items-center gap-13 relative">
             <Image
               loader={() => profile}
               src={profile}
diff --git a/src/app/search/components/BlogList/index.tsx b/src/app/search/components/BlogList/index.tsx
index f9e81d0..444fc26 100644
--- a/src/app/search/components/BlogList/index.tsx
+++ b/src/app/search/components/BlogList/index.tsx
@@ -3,8 +3,9 @@ import BlogCard from './BlogCard';
 import { useSearchContext } from '../SearchFetcher/SearchContext';
 
 export default function BlogList() {
-  const { blogInfoItem } = useSearchContext();
-  const { blogInfoList } = blogInfoItem;
+  const {
+    blogInfoItem: { blogInfoList },
+  } = useSearchContext();
 
   return (
     <div>
diff --git a/src/app/subscribe/components/Feed/FeedContent.tsx b/src/app/subscribe/components/Feed/FeedContent.tsx
index 91dc70f..1411f2a 100644
--- a/src/app/subscribe/components/Feed/FeedContent.tsx
+++ b/src/app/subscribe/components/Feed/FeedContent.tsx
@@ -17,14 +17,14 @@ export default function FeedContent({
     <div>
       <div className="grid grid-cols-3 gap-40 py-50">
         {blogPostPreviews?.map(({ blogItem, postItem }) => {
-          const { postId, title, preview, photo } = postItem;
+          const { postId, title, profile } = postItem;
           return (
             <FeedBox
               postId={postId}
               key={postId}
               title={title}
-              preview={preview}
-              photo={photo}
+              preview={profile}
+              photo={blogItem.profile}
               blogItem={blogItem}
             />
           );
diff --git a/src/app/subscribe/components/SubscribeFetcher/types.ts b/src/app/subscribe/components/SubscribeFetcher/types.ts
index 4fb33b2..c193c57 100644
--- a/src/app/subscribe/components/SubscribeFetcher/types.ts
+++ b/src/app/subscribe/components/SubscribeFetcher/types.ts
@@ -18,7 +18,7 @@ export interface FollowPostResponse extends PaginationInfo {
       blogId: number;
       postId: number;
       title: string;
-      preview: string;
+      profile: string;
       photo: string;
     };
   }>;