From b69e09c1269ac48554c17c91bff806b507d8058a Mon Sep 17 00:00:00 2001
From: tteokbokki-master <0jin.git@gmail.com>
Date: Mon, 11 Nov 2024 09:17:48 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20RecruitDetail=20=EC=88=98=EC=A0=95?=
 =?UTF-8?q?=20-=20useGetRequiredFieldCheck(=ED=95=84=EC=88=98=EA=B0=92=20?=
 =?UTF-8?q?=EC=B2=B4=ED=81=AC)=20recruitmentId=20=EC=A0=9C=EA=B1=B0=20-=20?=
 =?UTF-8?q?RecruitDetailProps=20=ED=83=80=EC=9E=85=20=EC=88=98=EC=A0=95=20?=
 =?UTF-8?q?-=20RecruitDetail=20=EC=8A=A4=ED=86=A0=EB=A6=AC=EB=B6=81=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95=20-=20RecruitDetail=20map=20=EB=A9=94?=
 =?UTF-8?q?=EC=84=9C=EB=93=9C=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../useRequiredFieldCheck.ts                  |  4 +--
 src/pages/recruit/RecruitDetail.tsx           | 26 +++++++------------
 src/pages/recruit/RecruitType.ts              | 12 +++------
 src/pages/recruit/index.tsx                   |  4 +--
 .../recruit/stories/RecruitDetail.stories.tsx | 19 +++-----------
 5 files changed, 18 insertions(+), 47 deletions(-)

diff --git a/src/apis/recruitmentsDetail/useRequiredFieldCheck.ts b/src/apis/recruitmentsDetail/useRequiredFieldCheck.ts
index 2a4ec7a..02dce6f 100644
--- a/src/apis/recruitmentsDetail/useRequiredFieldCheck.ts
+++ b/src/apis/recruitmentsDetail/useRequiredFieldCheck.ts
@@ -8,8 +8,8 @@ const getRequiredFieldCheck = async () => {
   return res.data;
 };
 
-export const useGetRequiredFieldCheck = (recruitmentId: number) =>
+export const useGetRequiredFieldCheck = () =>
   useQuery<RequiredFieldCheckProps, Error>({
-    queryKey: ['RequiredFieldCheckProps', recruitmentId],
+    queryKey: ['RequiredFieldCheckProps'],
     queryFn: () => getRequiredFieldCheck(),
   });
diff --git a/src/pages/recruit/RecruitDetail.tsx b/src/pages/recruit/RecruitDetail.tsx
index 933a485..89aca90 100644
--- a/src/pages/recruit/RecruitDetail.tsx
+++ b/src/pages/recruit/RecruitDetail.tsx
@@ -2,6 +2,7 @@ import { type SectionProps, type RecruitDetailProps } from './RecruitType';
 import styled from '@emotion/styled';
 import { Flex } from '@/components/common';
 import { useTranslation } from 'react-i18next';
+import { userLocalStorage } from '@/utils/storage';
 
 const SectionWithTitle = ({ title, children }: SectionProps) => (
   <Section>
@@ -24,7 +25,6 @@ const SectionConditions = ({ title, children }: SectionProps) => (
 );
 
 export default function RecruitDetail({
-  detailedDescription,
   majorBusiness,
   eligibilityCriteria,
   preferredConditions,
@@ -35,8 +35,11 @@ export default function RecruitDetail({
   workType,
   workHours,
   salary,
+  koreanDetailedDescription,
+  vietnameseDetailedDescription,
 }: RecruitDetailProps) {
   const { t } = useTranslation();
+  const language = userLocalStorage.getLanguage();
   return (
     <RecruitDetailContainer>
       <SectionWithTitle title={t('recruit.conditions')}>
@@ -68,23 +71,12 @@ export default function RecruitDetail({
           </Flex>
         </Flex>
       </SectionWithTitle>
-      <SectionWithTitle title={t('recruit.eligibilityRequirements')}>
-        {eligibilityCriteria?.map((data) => {
-          return <li key={data.id}>{data.text}</li>;
-        })}
-      </SectionWithTitle>
-      <SectionWithTitle title={t('recruit.detailedDescription')}>{detailedDescription}</SectionWithTitle>
-      <SectionWithTitle title={t('recruit.mainResponsibilities')}>
-        {majorBusiness?.map((data) => {
-          return <li key={data.id}>{data.text}</li>;
-        })}
-      </SectionWithTitle>
-
-      <SectionWithTitle title={t('recruit.PreferredRequirements')}>
-        {preferredConditions?.map((data) => {
-          return <li key={data.id}>{data.text}</li>;
-        })}
+      <SectionWithTitle title={t('recruit.eligibilityRequirements')}>{eligibilityCriteria}</SectionWithTitle>
+      <SectionWithTitle title={t('recruit.detailedDescription')}>
+        {language && language === 'ko' ? koreanDetailedDescription : vietnameseDetailedDescription}
       </SectionWithTitle>
+      <SectionWithTitle title={t('recruit.mainResponsibilities')}>{majorBusiness}</SectionWithTitle>
+      <SectionWithTitle title={t('recruit.PreferredRequirements')}>{preferredConditions}</SectionWithTitle>
     </RecruitDetailContainer>
   );
 }
diff --git a/src/pages/recruit/RecruitType.ts b/src/pages/recruit/RecruitType.ts
index 210e32a..12214db 100644
--- a/src/pages/recruit/RecruitType.ts
+++ b/src/pages/recruit/RecruitType.ts
@@ -11,21 +11,15 @@ export interface RecruitCardProps {
   requiredFieldCheck?: RequiredFieldCheckProps;
 }
 
-interface Item {
-  id: number;
-  text: string;
-}
-
 export interface RecruitDetailProps {
   salary: string;
   workDuration: string;
   workDays: string;
   workType: string;
   workHours: string;
-  detailedDescription: string;
-  majorBusiness: Item[];
-  eligibilityCriteria: Item[];
-  preferredConditions: Item[];
+  majorBusiness: string;
+  eligibilityCriteria: string;
+  preferredConditions: string;
   employerName: string;
   companyName: string;
   koreanDetailedDescription: string;
diff --git a/src/pages/recruit/index.tsx b/src/pages/recruit/index.tsx
index f1bfaa1..dc7e5cb 100644
--- a/src/pages/recruit/index.tsx
+++ b/src/pages/recruit/index.tsx
@@ -11,12 +11,10 @@ export default function Recruit() {
   const { recruitmentId = '1' } = useParams();
 
   const { data, isLoading } = useGetRecruitmentsDetail(Number(recruitmentId));
-  const { data: requiredFieldCheck } = useGetRequiredFieldCheck(Number(recruitmentId));
-
+  const { data: requiredFieldCheck } = useGetRequiredFieldCheck();
   if (isLoading || !data) {
     return <Spinner />;
   }
-
   return (
     <Layout>
       <Container>
diff --git a/src/pages/recruit/stories/RecruitDetail.stories.tsx b/src/pages/recruit/stories/RecruitDetail.stories.tsx
index 9b18079..22bc0c4 100644
--- a/src/pages/recruit/stories/RecruitDetail.stories.tsx
+++ b/src/pages/recruit/stories/RecruitDetail.stories.tsx
@@ -7,7 +7,6 @@ const meta: Meta<RecruitDetailProps> = {
   component: RecruitDetail,
   tags: ['autodocs'],
   argTypes: {
-    detailedDescription: { control: 'text' },
     majorBusiness: { control: 'object', description: 'id와 text 객체를 추가 및 수정해보십쇼!' },
     eligibilityCriteria: { control: 'object' },
     preferredConditions: { control: 'object' },
@@ -22,21 +21,9 @@ const meta: Meta<RecruitDetailProps> = {
     salary: { control: 'text' },
   },
   args: {
-    detailedDescription: '김밥 만들기 알바',
-    majorBusiness: [
-      { id: 1, text: '김밥 만들기' },
-      { id: 2, text: '재료 전처리' },
-      { id: 3, text: '마감 청소' },
-    ],
-    eligibilityCriteria: [
-      { id: 1, text: '비자를 가진 사람' },
-      { id: 2, text: '주 2회 이상 근무 가능한 사람' },
-    ],
-    preferredConditions: [
-      { id: 1, text: '한국어 의사 소통이 잘 되는 사람' },
-      { id: 2, text: '지각하지 않는 사람' },
-      { id: 3, text: '김밥에 있는 오이를 빼지 않는 사람' },
-    ],
+    majorBusiness: '김밥 만들기',
+    eligibilityCriteria: '비자를 가진 사람',
+    preferredConditions: '한국어 의사 소통이 잘 되는 사람',
     employerName: '이재용',
     companyName: '삼성전자',
     koreanDetailedDescription: '김밥 만들기 아르바이트',