From a41699ba56c4510686f907001b8459b679ccac15 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=97=90=EC=9D=B4=EB=93=A0?=
 <62369936+gyeongza@users.noreply.github.com>
Date: Wed, 20 Sep 2023 18:58:44 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A6=AC=ED=94=84=EB=A0=88=EC=89=AC=20?=
 =?UTF-8?q?=ED=86=A0=ED=81=B0=20=EC=98=A4=EB=A5=98=20=EC=BD=94=EB=93=9C=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80,=20=EC=A7=80=EC=9B=90=ED=95=9C=20=EC=84=9C?=
 =?UTF-8?q?=ED=8F=AC=ED=84=B0=20=EC=97=86=EC=9D=84=20=EA=B2=BD=EC=9A=B0=20?=
 =?UTF-8?q?=EB=B2=84=ED=8A=BC=20=EB=B9=84=ED=99=9C=EC=84=B1=ED=99=94=20(#5?=
 =?UTF-8?q?72)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: 로그인 만료 오류코드 추가

* feat: 지원한 서포터 없을 경우 버튼 숨기기
---
 .../MyPage/MyPagePostButton/MyPagePostButton.tsx      | 11 ++++++++++-
 .../MyPage/MyPagePostItem/MyPagePostItem.tsx          |  1 +
 frontend/src/components/common/Button/Button.tsx      | 11 +++++++----
 frontend/src/hooks/useFetch.ts                        |  2 +-
 .../src/mocks/data/myPagePost/myPagePostList.json     |  2 +-
 5 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx b/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
index 888fb8c19..066014baa 100644
--- a/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
+++ b/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
@@ -14,10 +14,18 @@ interface Props {
   reviewStatus: ReviewStatus;
   isRunner: boolean;
   supporterId?: number;
+  applicantCount: number;
   handleDeletePost: (handleDeletePost: number) => void;
 }
 
-const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId, handleDeletePost }: Props) => {
+const MyPagePostButton = ({
+  runnerPostId,
+  reviewStatus,
+  isRunner,
+  supporterId,
+  applicantCount,
+  handleDeletePost,
+}: Props) => {
   const { goToSupportSelectPage, goToSupporterFeedbackPage } = usePageRouter();
 
   const { isMobile } = useViewport();
@@ -78,6 +86,7 @@ const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId, h
             fontWeight={700}
             width={isMobile ? '100%' : '180px'}
             height="40px"
+            disabled={applicantCount < 1}
             onClick={isRunner ? handleClickSupportSelectButton : handleClickCancelReviewButton}
           >
             {isRunner ? '서포터 선택하기' : '리뷰 제안 취소'}
diff --git a/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx b/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
index 6f64ab660..e25d1c176 100644
--- a/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
+++ b/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
@@ -65,6 +65,7 @@ const MyPagePostItem = ({
 
         <MyPagePostButton
           handleDeletePost={handleDeletePost}
+          applicantCount={applicantCount}
           runnerPostId={runnerPostId}
           isRunner={isRunner}
           reviewStatus={reviewStatus}
diff --git a/frontend/src/components/common/Button/Button.tsx b/frontend/src/components/common/Button/Button.tsx
index ce9dbc656..b1f45a2c8 100644
--- a/frontend/src/components/common/Button/Button.tsx
+++ b/frontend/src/components/common/Button/Button.tsx
@@ -14,27 +14,27 @@ interface Props extends React.HTMLProps<HTMLButtonElement> {
 const Button = ({
   colorTheme,
   children,
-  width,
-  height,
   type,
   fontSize,
   fontWeight,
   onClick,
   ariaLabel,
   dataType,
+  disabled,
+  ...buttonProps
 }: Props) => {
   return (
     <S.ButtonWrapper>
       <S.Button
         data-type={dataType}
-        $width={width}
-        $height={height}
         $colorTheme={colorTheme}
         type={type}
+        $disabled={disabled}
         $fontSize={fontSize}
         $fontWeight={fontWeight}
         onClick={onClick}
         aria-label={ariaLabel}
+        {...buttonProps}
       >
         {children}
       </S.Button>
@@ -57,6 +57,7 @@ const S = {
     $height?: string | number;
     $fontSize?: string | number;
     $fontWeight?: number;
+    $disabled?: boolean;
   }>`
     ${({ $colorTheme }) => themeStyles[$colorTheme]}
 
@@ -68,6 +69,8 @@ const S = {
     font-size: ${({ $fontSize }) => $fontSize || '18px'};
     font-weight: ${({ $fontWeight }) => $fontWeight || '400'};
 
+    visibility: ${({ $disabled }) => ($disabled ? 'hidden' : 'visible')};
+
     @media (max-width: 768px) {
       width: ${({ $width }) => $width || '180px'};
       height: 100%;
diff --git a/frontend/src/hooks/useFetch.ts b/frontend/src/hooks/useFetch.ts
index fc3354e98..09c4f5215 100644
--- a/frontend/src/hooks/useFetch.ts
+++ b/frontend/src/hooks/useFetch.ts
@@ -22,7 +22,7 @@ export const useFetch = () => {
 
             showErrorToast({
               title: ERROR_TITLE.NO_PERMISSION,
-              description: ['JW007', 'JW008', 'JW009'].includes(apiError.errorCode)
+              description: ['JW007', 'JW008', 'JW009', 'JW010'].includes(apiError.errorCode)
                 ? ERROR_DESCRIPTION.TOKEN_EXPIRATION
                 : ERROR_DESCRIPTION.NO_TOKEN,
             });
diff --git a/frontend/src/mocks/data/myPagePost/myPagePostList.json b/frontend/src/mocks/data/myPagePost/myPagePostList.json
index 93039c49b..c9a378518 100644
--- a/frontend/src/mocks/data/myPagePost/myPagePostList.json
+++ b/frontend/src/mocks/data/myPagePost/myPagePostList.json
@@ -6,7 +6,7 @@
       "deadline": "2020-10-13T11:30",
       "tags": ["java", "JAVA"],
       "reviewStatus": "NOT_STARTED",
-      "applicantCount": 4,
+      "applicantCount": 0,
       "watchedCount": 125,
       "supporterId": 1
     },