From d51a48c92f77cb87b29c083501386aaf4374eaac Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 10 Oct 2024 17:25:48 +0900
Subject: [PATCH] =?UTF-8?q?fix-fe:=20=EC=82=AC=EC=9D=B4=EB=93=9C=EB=B0=94?=
 =?UTF-8?q?=20=EC=85=80=EB=A0=89=ED=8A=B8=20=EB=90=9C=20=EB=A9=94=EB=89=B4?=
 =?UTF-8?q?=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95=20(#786)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Jeongwoo Park <121204715+lurgi@users.noreply.github.com>
---
 .../DashboardSidebar.stories.tsx              | 16 +++---
 .../dashboard/DashboardSidebar/index.tsx      | 51 ++++++++++---------
 frontend/src/pages/DashBoardList/index.tsx    |  4 +-
 frontend/src/pages/DashboardLayout/index.tsx  |  2 +-
 frontend/src/types/dashboard.ts               |  4 +-
 5 files changed, 40 insertions(+), 37 deletions(-)

diff --git a/frontend/src/components/dashboard/DashboardSidebar/DashboardSidebar.stories.tsx b/frontend/src/components/dashboard/DashboardSidebar/DashboardSidebar.stories.tsx
index 4941486c9..98a043c01 100644
--- a/frontend/src/components/dashboard/DashboardSidebar/DashboardSidebar.stories.tsx
+++ b/frontend/src/components/dashboard/DashboardSidebar/DashboardSidebar.stories.tsx
@@ -26,8 +26,8 @@ const meta: Meta<typeof DashboardSidebar> = {
       {
         text: '첫번째 옵션',
         isSelected: false,
-        dashboardId: '1',
-        applyFormId: '10',
+        dashboardId: 1,
+        applyFormId: 10,
         status: {
           isClosed: true,
           isPending: false,
@@ -38,8 +38,8 @@ const meta: Meta<typeof DashboardSidebar> = {
       {
         text: '두번째 옵션',
         isSelected: false,
-        dashboardId: '2',
-        applyFormId: '11',
+        dashboardId: 2,
+        applyFormId: 11,
         status: {
           isClosed: true,
           isPending: false,
@@ -50,8 +50,8 @@ const meta: Meta<typeof DashboardSidebar> = {
       {
         text: '세번째 옵션',
         isSelected: true,
-        dashboardId: '2',
-        applyFormId: '12',
+        dashboardId: 2,
+        applyFormId: 12,
         status: {
           isClosed: false,
           isPending: false,
@@ -62,8 +62,8 @@ const meta: Meta<typeof DashboardSidebar> = {
       {
         text: '네번째 옵션',
         isSelected: false,
-        dashboardId: '2',
-        applyFormId: '13',
+        dashboardId: 2,
+        applyFormId: 13,
         status: {
           isClosed: false,
           isPending: true,
diff --git a/frontend/src/components/dashboard/DashboardSidebar/index.tsx b/frontend/src/components/dashboard/DashboardSidebar/index.tsx
index 94330f0b5..6e5713830 100644
--- a/frontend/src/components/dashboard/DashboardSidebar/index.tsx
+++ b/frontend/src/components/dashboard/DashboardSidebar/index.tsx
@@ -20,8 +20,8 @@ import S from './style';
 interface Option {
   text: string;
   isSelected: boolean;
-  applyFormId: string;
-  dashboardId: string;
+  applyFormId: number;
+  dashboardId: number;
   status: RecruitmentStatusObject;
 }
 
@@ -113,28 +113,31 @@ export default function DashboardSidebar({ sidebarStyle, options }: DashboardSid
             return (
               <Fragment key={title}>
                 <S.ContentSubTitle>{sidebarStyle.isSidebarOpen ? title : <S.Circle />}</S.ContentSubTitle>
-                {posts?.map(({ text, isSelected, applyFormId, dashboardId, status }) => {
-                  const Icon = IconObj[status.status];
-
-                  return (
-                    <S.SidebarItem key={applyFormId}>
-                      <Link to={routes.dashboard.post({ dashboardId, applyFormId })}>
-                        <S.SidebarItemLink
-                          isSelected={isSelected}
-                          isSidebarOpen={sidebarStyle.isSidebarOpen}
-                        >
-                          <S.IconContainer>
-                            <Icon
-                              size={16}
-                              strokeWidth={4}
-                            />
-                          </S.IconContainer>
-                          {sidebarStyle.isSidebarOpen && <S.SidebarItemText>{text}</S.SidebarItemText>}
-                        </S.SidebarItemLink>
-                      </Link>
-                    </S.SidebarItem>
-                  );
-                })}
+                {posts?.map(
+                  ({ text, isSelected, applyFormId: applyFormIdNum, dashboardId: dashboardIdNum, status }) => {
+                    const Icon = IconObj[status.status];
+                    const dashboardId = String(dashboardIdNum);
+                    const applyFormId = String(applyFormIdNum);
+                    return (
+                      <S.SidebarItem key={applyFormId}>
+                        <Link to={routes.dashboard.post({ dashboardId, applyFormId })}>
+                          <S.SidebarItemLink
+                            isSelected={isSelected}
+                            isSidebarOpen={sidebarStyle.isSidebarOpen}
+                          >
+                            <S.IconContainer>
+                              <Icon
+                                size={16}
+                                strokeWidth={4}
+                              />
+                            </S.IconContainer>
+                            {sidebarStyle.isSidebarOpen && <S.SidebarItemText>{text}</S.SidebarItemText>}
+                          </S.SidebarItemLink>
+                        </Link>
+                      </S.SidebarItem>
+                    );
+                  },
+                )}
               </Fragment>
             );
           })}
diff --git a/frontend/src/pages/DashBoardList/index.tsx b/frontend/src/pages/DashBoardList/index.tsx
index 6292aab95..b96347631 100644
--- a/frontend/src/pages/DashBoardList/index.tsx
+++ b/frontend/src/pages/DashBoardList/index.tsx
@@ -19,12 +19,12 @@ export default function DashboardList() {
         {data?.dashboards.map((dashboard) => (
           <RecruitmentCard
             key={`${dashboard.dashboardId}-${dashboard.applyFormId}`}
-            dashboardId={dashboard.dashboardId}
+            dashboardId={String(dashboard.dashboardId)}
             title={dashboard.title}
             postStats={dashboard.stats}
             startDate={dashboard.startDate}
             endDate={dashboard.endDate}
-            onClick={() => handleCardClick(dashboard.dashboardId, dashboard.applyFormId)}
+            onClick={() => handleCardClick(String(dashboard.dashboardId), String(dashboard.applyFormId))}
           />
         ))}
         <S.AddCard onClick={() => navigate(routes.dashboard.create())}>
diff --git a/frontend/src/pages/DashboardLayout/index.tsx b/frontend/src/pages/DashboardLayout/index.tsx
index 84c38a1ea..7cb59385e 100644
--- a/frontend/src/pages/DashboardLayout/index.tsx
+++ b/frontend/src/pages/DashboardLayout/index.tsx
@@ -16,7 +16,7 @@ export default function DashboardLayout() {
 
   const applyFormList = data?.dashboards.map(({ title, dashboardId, applyFormId, startDate, endDate }) => ({
     text: title,
-    isSelected: !!currentPostId && currentPostId === applyFormId,
+    isSelected: !!currentPostId && currentPostId === String(applyFormId),
     status: getTimeStatus({ startDate, endDate }),
     applyFormId,
     dashboardId,
diff --git a/frontend/src/types/dashboard.ts b/frontend/src/types/dashboard.ts
index 2c517900a..13561e877 100644
--- a/frontend/src/types/dashboard.ts
+++ b/frontend/src/types/dashboard.ts
@@ -43,8 +43,8 @@ interface Stats {
 }
 
 interface Dashboard {
-  dashboardId: string;
-  applyFormId: string;
+  dashboardId: number;
+  applyFormId: number;
   title: string;
   stats: Stats;
   startDate: string;