From 94c981b0cb93aa5038ccb161cf114a3d3c8901ce Mon Sep 17 00:00:00 2001
From: Eugene Kim <eugene02876@gmail.com>
Date: Thu, 5 Sep 2024 00:18:21 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20=EB=8F=84?=
 =?UTF-8?q?=EB=A9=94=EC=9D=B8=20=EC=9E=85=EB=A0=A5=EC=8B=9C=20UI=20?=
 =?UTF-8?q?=EA=B9=A8=EC=A7=80=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4?=
 =?UTF-8?q?=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bottomsheet/JoinRegularMemberBottomSheet.tsx  |  5 ++++-
 src/components/myPage/ApproveBox.tsx              | 15 ++++++++++-----
 src/components/myPage/JoinStatus.tsx              | 15 ++++++++++++---
 src/components/signup/EmailInputField.tsx         | 10 ++++++++--
 src/pages/Dashboard.tsx                           |  1 +
 5 files changed, 35 insertions(+), 11 deletions(-)

diff --git a/src/components/bottomsheet/JoinRegularMemberBottomSheet.tsx b/src/components/bottomsheet/JoinRegularMemberBottomSheet.tsx
index b8b4ca6..1a2c0e4 100644
--- a/src/components/bottomsheet/JoinRegularMemberBottomSheet.tsx
+++ b/src/components/bottomsheet/JoinRegularMemberBottomSheet.tsx
@@ -81,10 +81,13 @@ const JoinRegularMemberBottomSheet = ({
           text={<Text typo="label1">{recruitmentPeriod}</Text>}
         />
         <Button
+          disabled={currentRecruitment ? true : false}
           onClick={() => {
             joinRegularMember(currentRecruitment.recruitmentId);
           }}>
-          지원하러 가기
+          {currentRecruitment
+            ? '정회원 가입 조건을 완료해주세요'
+            : '지원하러 가기'}
         </Button>
       </BottomSheetContent>
     </BottomSheet>
diff --git a/src/components/myPage/ApproveBox.tsx b/src/components/myPage/ApproveBox.tsx
index 805cf00..c085ec6 100644
--- a/src/components/myPage/ApproveBox.tsx
+++ b/src/components/myPage/ApproveBox.tsx
@@ -1,6 +1,9 @@
 import Box from 'wowds-ui/Box';
 import styled from '@emotion/styled';
-import { CurrentRecruitmentType } from '@/apis/member/memberType';
+import {
+  CurrentMembershipType,
+  CurrentRecruitmentType
+} from '@/apis/member/memberType';
 import {
   convertRecruitmentPeriod,
   convertRecruitmentName
@@ -13,14 +16,16 @@ type BoxStatusType = 'default' | 'success' | 'error';
 
 export const ApproveBox = ({
   role,
-  currentRecruitment
+  currentRecruitment,
+  currentMembership
 }: {
   role: UserRoleType;
   currentRecruitment: CurrentRecruitmentType;
+  currentMembership?: CurrentMembershipType;
 }) => {
   const { handleBottomSheet } = useBottomSheet();
 
-  if (!currentRecruitment) {
+  if (!currentRecruitment && role !== 'REGULAR') {
     return (
       <Box
         variant="warn"
@@ -48,7 +53,7 @@ export const ApproveBox = ({
     ASSOCIATE: {
       title: `${convertRecruitmentName(currentRecruitment.name, currentRecruitment.roundTypeValue)}`,
       description: `${convertRecruitmentPeriod(currentRecruitment.period)}`,
-      boxVariant: 'arrow',
+      boxVariant: currentMembership ? 'text' : 'arrow',
       status: 'error'
     },
     REGULAR: {
@@ -63,7 +68,7 @@ export const ApproveBox = ({
   return (
     <BoxWrapper
       onClick={() => {
-        if (role === 'ASSOCIATE') handleBottomSheet();
+        if (role === 'ASSOCIATE' && !currentMembership) handleBottomSheet();
         else if (role === 'REGULAR') {
           window.location.href = 'https://study.gdschongik.com/';
         } else {
diff --git a/src/components/myPage/JoinStatus.tsx b/src/components/myPage/JoinStatus.tsx
index b8542e0..e6673dd 100644
--- a/src/components/myPage/JoinStatus.tsx
+++ b/src/components/myPage/JoinStatus.tsx
@@ -5,18 +5,23 @@ import styled from '@emotion/styled';
 import MemberStatusInfoBox from '@/components/myPage/MemberStatusInfoBox';
 import { ApproveBox } from './ApproveBox';
 import { Text, Flex, Space } from '../common/Wrapper';
-import { CurrentRecruitmentType } from '@/apis/member/memberType';
+import {
+  CurrentMembershipType,
+  CurrentRecruitmentType
+} from '@/apis/member/memberType';
 import MemberStatusStepper from './MemberStatusStepper';
 import { User, UserRoleType } from '@/types/user';
 
 const JoinStatus = ({
   role,
   currentRecruitmentRound,
-  member
+  member,
+  currentMembership
 }: {
   role: UserRoleType;
   currentRecruitmentRound: CurrentRecruitmentType;
   member: User;
+  currentMembership?: CurrentMembershipType;
 }) => {
   const [openInfo, setOpenInfo] = useState(false);
   const helpButtonRef = useRef<HTMLDivElement>(null);
@@ -50,7 +55,11 @@ const JoinStatus = ({
       <Space height={40} />
       <MemberStatusStepper member={member} />
       <Space height={20} />
-      <ApproveBox role={role} currentRecruitment={currentRecruitmentRound} />
+      <ApproveBox
+        role={role}
+        currentRecruitment={currentRecruitmentRound}
+        currentMembership={currentMembership}
+      />
     </Flex>
   );
 };
diff --git a/src/components/signup/EmailInputField.tsx b/src/components/signup/EmailInputField.tsx
index fa2f587..e7d4452 100644
--- a/src/components/signup/EmailInputField.tsx
+++ b/src/components/signup/EmailInputField.tsx
@@ -38,7 +38,7 @@ const EmailInputField = ({ control }: DepartmentSelectProps) => {
         render={({ field, fieldState }) => (
           <TextFieldWrapper>
             <TextField
-              style={{ minWidth: '100%' }}
+              style={{ minWidth: '100%', flex: 1, maxWidth: '150px' }}
               label="이메일"
               error={fieldState.invalid}
               ref={field.ref}
@@ -69,7 +69,7 @@ const EmailInputField = ({ control }: DepartmentSelectProps) => {
             {customEmail ? (
               <TextFieldWrapper>
                 <TextField
-                  style={{ minWidth: '100%' }}
+                  style={{ minWidth: '100%', flex: 1, maxWidth: '150px' }}
                   label="도메인"
                   error={fieldState.invalid}
                   ref={field.ref}
@@ -137,3 +137,9 @@ const EmailFieldWrapper = styled.div`
   align-items: center;
   justify-content: space-between;
 `;
+
+const TextFieldStyle = {
+  minWidth: '100%',
+  flex: 1,
+  maxWidth: '100%'
+};
diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx
index 915edd7..c7cf352 100644
--- a/src/pages/Dashboard.tsx
+++ b/src/pages/Dashboard.tsx
@@ -42,6 +42,7 @@ export const Dashboard = () => {
           <JoinStatus
             role={member.role}
             currentRecruitmentRound={currentRecruitmentRound}
+            currentMembership={currentMembership}
             member={member}
           />
         </Flex>