hotfix: 총 게시글 수 증가 표시 관련 오류 핫픽스

Author: six-standard

src/app/(auth-required)/main/Content.tsx

@@ -3,7 +3,7 @@
 import { useInfiniteQuery, useQuery } from '@tanstack/react-query';
 import { useEffect, useMemo } from 'react';
 import { useInView } from 'react-intersection-observer';
-import { postList, postSummary } from '@/apis';
+import { postList, postSummary, totalStats } from '@/apis';
 import { Section, Summary } from '@/app/components';
 import { PATHS, SORT_TYPE } from '@/constants';
 import { useSearchParam } from '@/hooks';
@@ -42,6 +42,12 @@ export const Content = () => {
     queryFn: postSummary,
   });
 
+  const { data: yesterdayPostCount } = useQuery({
+    queryKey: [PATHS.TOTALSTATS],
+    queryFn: async () => totalStats('post'),
+    select: (data) => data.slice(1, 2)[0]?.value,
+  });
+
   useEffect(() => {
     const pages = posts?.pages;
     if (!pages?.length || !inView) return;
@@ -59,7 +65,7 @@ export const Content = () => {
 
   return (
     <div className="flex w-full h-full gap-[30px] max-MBI:flex-col max-TBL:gap-[20px] overflow-hidden">
-      {summaries && <Summary {...summaries} />}
+      {summaries && <Summary {...summaries} yesterdayPostCount={yesterdayPostCount} />}
 
       <div className="w-full flex flex-col gap-[30px] overflow-auto max-TBL:gap-[20px]">
         <div className="flex h-fit flex-col items-center p-[20px] bg-BG-SUB gap-5 rounded-[4px]">

src/app/components/Summary/SidebarContent.tsx

@@ -24,8 +24,10 @@ export const SidebarContent = ({ title, content, increasement, typeIsCount, id }
         <Inform.Title>{title}</Inform.Title>
         <Inform.Horizontal>
           <Inform.Content suffix={typeIsCount ? '회' : '개'}>{parseNumber(content)}</Inform.Content>
-          {increasement && (
+          {increasement ? (
             <Inform.Highlighted suffix="↑">{parseNumber(increasement)}</Inform.Highlighted>
+          ) : (
+            <></>
           )}
         </Inform.Horizontal>
       </Inform>

src/app/components/Summary/index.tsx

@@ -6,7 +6,13 @@ import { PostSummaryDto } from '@/types';
 import { BarContent } from './BarContent';
 import { SidebarContent } from './SidebarContent';
 
-export const Summary = ({ totalPostCount, stats }: PostSummaryDto) => {
+interface IProp {
+  totalPostCount: number;
+  yesterdayPostCount?: number;
+  stats: PostSummaryDto['stats'];
+}
+
+export const Summary = ({ totalPostCount, yesterdayPostCount, stats }: IProp) => {
   const [open, setOpen] = useState(false);
 
   return (
@@ -28,7 +34,12 @@ export const Summary = ({ totalPostCount, stats }: PostSummaryDto) => {
           increasement={stats?.totalLikes - stats?.yesterdayLikes}
           id="like"
         />
-        <SidebarContent title="총 게시글 수" content={totalPostCount} id="post" />
+        <SidebarContent
+          title="총 게시글 수"
+          content={totalPostCount}
+          increasement={yesterdayPostCount ? totalPostCount - yesterdayPostCount : undefined}
+          id="post"
+        />
       </aside>
       <section
         className={`flex flex-col w-full px-5 bg-BG-SUB rounded-[4px] cursor-pointer MBI:hidden`}
@@ -51,7 +62,11 @@ export const Summary = ({ totalPostCount, stats }: PostSummaryDto) => {
               content={stats?.totalLikes}
               increasement={stats?.totalLikes - stats?.yesterdayLikes}
             />
-            <BarContent title="총 게시글 수" content={totalPostCount} />
+            <BarContent
+              title="총 게시글 수"
+              content={totalPostCount}
+              increasement={yesterdayPostCount ? totalPostCount - yesterdayPostCount : undefined}
+            />
           </div>
         )}
       </section>