[test-deploy] recruit 기능 테스트 배포 (admin) (#1357)

* [Feat] page state 추가 #1256 * [Feat] 제목 수이블 타입 추가 #1256 * 파일명 수정을 위한 삭제 * [Fix] lint에 맞지 않는 파일 수정 #1256 * [Fix] quill 새로고침 css 꺠짐 해결 #1256 * [Feat] 질문지 항목 작성 #1256 * [Feat] useRecruitmentEditInfo 커스텀 훅 추가 #12556 * [style] mock api연걸 * Rename detailRecruitUserList.tsx to DetailRecruitUserList.tsx * Rename notificationResults.tsx to NotificationResults.tsx * [Feat] inputType 바꾸기 기능 추가 #1256 * [Fix] 바뀐 SINGLE_CHECK MULTI_CHECK 수정 #1256 * [style] recruit 리팩토링 #1246 * [fix] notificationResults error 처리 #1246 * [Feat] MUI 컴포넌트 추가 #1256 * [Feat] 삭제 버튼 추가 #1256 * [Fix] IQuestionForm의 inputType 수정 * [Fix] useRecruitDetail - refetchOnWindowFocus false 설정 * [Feat] mock api 페이지네이션 추가 * [refactor] 구조 개선 #1256 * [Feat] DragAndDrop Question 순서 변경 #1256 * [Fix] 질문 유형 드롭다운 스타일 수정 #1256 * [Feat] useCheckRecruit의 staleTime 추가 * [Chore] recruitmentListData 타입 추가 * [Feat] useInfiniteRecruitList 훅 추가 * [Feat] RecruitList 컴포넌트 템플릿 적용 * [Feat] RecruitListItem 추가 * [Refact] StickyHeader 컴포넌트 분리 * [Refact] 불필요한 div 제거 * [Feat] recruitmentQuestionTypes 추가 * [Feat] recoil modalType selector - recruitment 추가 * [Fix] qeustion null case 중간 return 추가 #1256 * [Feat] modalTypes - recruitment 관련 타입 추가 * [Refact] 불필요한 div 삭제 * [Chore] id => recruitId 변수명 변경 * [Feat] ModalProvider - recruitment 추가 * [Feat] RecruitmentModal 추가 * [Feat] recruitment - ApplyModal 추가 * [Feat] ApplicationForm - 지원하기 기능 추가 * [Design] noRecruit 레이아웃 수정 * [Fix] makeEmptyQuestion 함수 수정 #1256 * [Design] 메인페이지 StickyHeader 적용 * [Design] applicationContainer 제거 공통 레이아웃 디자인 적용을 위함 * [Design] stickyHeader z-index 적용 * [Feat] RecruitListItem 디자인 적용 * [Fix] observer 버그 수정 * [Chore] 주석 정리 * [Design] 공고 목록 버튼 디자인 수정 * [Feat] recruit 결과 안내 메시지 템플릿 작성 버튼 * [Test] mock api 수정, application 테스트 버튼 수정 * [Style] ApplyModal 스타일 적용 * [Style] ApplicationForm 스타일 수정 * [Test] recruitDetail 테스트 api 수정 * [Test] recruitDetail 필요없는 부분 삭제 * [Feat] 42GG로 돌아가기 버튼 추가 * [Feat] 모집 메인 페이지 라우팅 설정 * [Chore] mock 데이터 추가 및 수정 * [Feat] useRecruitDetail 훅 적용 * [Refact] quillViewer mixin 적용 * [Chore] mock 데이터 수정 * [Design] 페이지 헤더 디자인 추가 * [Design] 페이지 헤더 StickyHeader로 변경 * [Refact] DynamicQuill 추가 * [Chore] mock 데이터 추가 * [Feat] 모집 content quillViewer 적용 * [Feat] 지원하기 버튼 추가 * [Feat] MyRecruitment 템플릿 추가 * [Design] pageSubTitle margin 제거 * [Feat] collapse list 추가 * [Fix] IApplicationAnswer quesionsId -> questionsId 타입 이름 변경 * [Fix, Refactor] Application 폼 useRef 배열 에러 수정, div => Grid, Box, Paper mui 컴포넌트로 수정 * [Refactor] ApplyModal - 기존 모달 방식에서 mui dialog 모달로 변경 * [Test] apply post mock api 수정 * [Refactor] snackbar => mui snackBar로 변경 * [Style] ApplyModal 스타일 수정 * [Chore] 기존 recruitment modal 사용에 필요했던 부분 삭제 * [Feat] ApplicationForm - 빈 문항 있을 시 스낵바 alert 추가 * [Chore] IRefs - 타입 파일로 이동 * [Refactor] ApplicationForm, ApplictionQuestions - 컴포넌트 분리 * [Fix] 기존 JSX 상태 리터럴 입 상태로 변경 #1256 * [Feat] 공고 수정, 생성 버튼 추가 #1256 * [Fix] ApplicationForm - 오타, 문구 수정, 유효하지 않은 요청 snackbar 추가 * [Feat] recruit 메시지 템플릿 작성 컴포넌트 구현 * [Feat] 템플릿 등록 mockApi 연결 * [Fix] ApplicationForm - 올바르지 않은 요청 에러 수정 * [Feat] ApplyModal - 제출하기 후 모달 닫기 추가 * [Chore] 주석 삭제 * [Style] ApplyModal - 색상 팔레트 secondary 추가, DialogTitle,Content로 변경, css 수정 * [Style] admin-button cursor pointer 추가 * [Feat] dateToString에 fillZero 추기 * [Design] 지원하기 버튼 중앙정렬로 변경 * [Feat] 내용 없을 시 경고 문구 추가 * [Chore] template message type 이름 수정 * [Feat] 템플릿 수정 모달로 변경 * [Fix] recruit merge 후 일부 수정 * [refactor] prop 개선 #1256 * [Feat, Refactor] 확인, 수정, 기능(작업중) / ref => state로 변경(작업중) * [Fix] ApplyModal - Dialog => Moadl로 변경 * [Fix] mock api conflict 수정 * [Fix] mock api conflict 수정 * [style] MUI 컴포넌트로 스타일 변경 #1256 * [Feat] 지원 결과 확인 mock api 추가 * [Fix] property name error 수정 * [style] 버튼 스타일 수정 #1256 * [style] 불러오기 버튼 좌우길이 수정 #1256 * [Feat] CollapseListItem 추가 * [Feat] recruitmentResult 타입 추가 * [Fix] NaN 요청 제거 * [Feat] useGetRecruitResult 훅 추가 * [Feat] MyApplicationInfo 추가 * [Feat] MyRecruitStatus 추가 * [Feat] CollapseListItem 기본 펼침상태로 변경 * [Feat] RecruitStepper 추가 * [Design] Step 아이콘 변경 * [Design] 간격 추가 * [Design] StyledLabel 수정 * [Fix] color 적용이 안되던 문제 해결 * [Chore] import 경로 절대경로로 변경 * [Feat, Refactor] ApplicationForm - input값 관리 ref => state로 변경 / 컴포넌트 분리 및 util 로직 분리 / applicationForm 폴더 분리 * [Refactor] 유저응답 관련 타입 형식 및 이름 변경 * [Feat] 유저 응답 recoil 상태 추가 * [Feat] useRecruitDetailUser - useQuery 키값 추가 * [Feat] ApplyModal - props 값 중 answerList recoilValue 로 변경 * [Test] mock api 수정 * [Chore] 파일 경로 변경 * [Feat] refMap 타입 추가 * [Refactor] 매개변수 형식 props로 변경 * [Refactor] 제출하기 버튼 분리 * [Chore] 주석 추가 * [Chore] applicationFormUtils 파일 utils 폴더로 이동 * [Feat] ApplicationFormHeader 추가 * [Feat] alert, modal 리코일 추가, useRef refMap 선언 위치 변경 * [Chore] applicantId 추가 * [Feat] 지원한 경우 지원하기 버튼 비활성화 * [Feat] useGetRecruitResult에 지원 결과가 없는 응답 추가 * [Chore] mock api 데이터 변경 - 지원 상태 추가 - applicationId 추가 * [Feat] 지원 상태 타입 수정 * [Chore] applicantId 를 applicationId로 수정 * [Refact] 상태 판단 조건 수정 * [Feat] applicationAnswer 기본값 만드는 함수 추가 * [Feat] recoil - modalState, applicationInfo, invalidInput 추가 * [Feat] Apply, Cancel 모달 관련 스탕리 recruitModal로 통합 * [Chore] 사용하지 않는 formRefs 삭제 * [Feat] Apply, CancelModal - Cancel 모달 추가, Apply 모달 수정 * [Feat] recoil State 추가에 맞춰서 기존 state들 수정 * [Fix] 리스트 null문제 수정 #1256 * [Fix] 임시 문자열 삭제 #1256 * [Refactor] applicationForm 아이템 컴포넌트 파일 분리 * [Refactor] applicationSnackBar 분리 * [Feat] 기존 recruitment 공고에 지원서 페이지 연결 * [Test] mock api 수정 * [Chore] type 일부 수정 recoil 일부 수정 * [Feat] applicatoinFooter 추가 * [Test] mock api 수정 * [Feat] application 페이지 렌더 시 alert false 추가 * [Feat] 안쓰는 recoil 상태 제거 * [Feat] modal 페이지 이동 전 sleep 추가, props => router 쿼리 값으로 대체 * [Style] stickyFooter padding-left 제거, 주석 제거 * [feat] 지원자 페이지 기본 구성 #1254 * [Chore] 빈 태그 제거 * [Refactor] snackbar layout으로 이동 * [Feat] 지원서 지원/ 확인수정 페이지 분리 * [Chore] 안쓰는 recoil 상태들 삭제 * [Feat] tsconfig - formData iterator 사용을 위한 컴파일 옵션 추가 * [Feat] 지원자 리스트 상세보기, 호버기능, 필터레이아웃 추가 #1254 * [Refactor] loading, nodata 컴포넌트 분리 * [Refactor] header, footer 컴포넌트 분리 * [Fix] Application state 관리 => form 형식으로 제출방식 변경, 폼 데이터 관련 훅들 상위 페이지 컴포넌트로 이동, FormItem 중간 컴포넌트 삭제 * [Fix] Apply => ApplyEdit 이름 변경, 모달 내 버튼 작동방식 수정 * [Fix] 기존 상태관리 다루는 함수 삭제, 폼데이터 다루는 함수 추가 * [Fix] 사용하지 않는 recoil 삭제, modal 상태 수정 * [Fix] 기존 useRecruitDetail, useRecruitDetailUser 인자 수정 * [Feat] useUserApplicationForm 훅 추가 * [Feat] 내 지원서 페이지 추가, 기존 ApplicationForm 컴포넌트 내에서 불러오던 훅들 해당페이지에서 호출하는 방식으로 변경 * [Fix] 기존 공고 컴포넌트, 페이지 변경사항에 맞춰 수정 * [Test] mock api 긴 문자열 추가 * [Style] Paper 컴포넌트 elevation 옵션 설정 * [Fix] 기존 유저 텍스트 값 수정 문제로 value state 추가 * [Style] 지원서 전반적인 스타일 수정 * [Feat] formRefs의 ref들을 문항을 감싸는 div 태그의 ref로 변경 및 스크롤 방식 추가 * [Refactor] recoil interface 이동, refMap 타입 수정 * [Feat] 지원, 수정인 경우 스택바 색깔 다르게 수정 * [Refactor] recoil modalstate, setmodalState 하나로 합침 * [Test] mock api 긴문자열 테스트 추가 * [Fix] 체크 항목 줄바꿈 안되는 문제 수정 * [Chore] 사용하지 않는 useRecoilValue import문에서 삭제 * [Fix] 모집 유저 기능 mockInstance -> instance로 변환 * [Fix] TournamentMegaphone mockInstace -> instance로 변환 * [Fix] recruitments 확인 api의 빠진 query string 추가 * [Feat] 공고 생성 mockAPI 작성 #1256 * [Feat] 페이지 상태 props 추가 #1256 * [Fix] IRecruitmentEditInfo 통합 삭제 #1256 * [Feat] 공고확인 초안 작성 #1256 * [Feat] 공고확인 버튼 삭제 #1256 * [Feat] 미사용 import 삭제 #1256 * [Feat] 공고 확인 스타일 분리 #1256 * [Feat] 공고 상세보기 페이지 버튼 추가 #1256 * [Feat] 필터옵션추가 #1254 * [Feat] 필터 api연결 #1254 * [Fix] form이 undefine일 경우 예외처리 #1256 * [Fix] Quill style, DynamicQuill 컴포넌트로 변경 #1256 * [Feat] 공고 API 연동 #1256 * [Fix] 주석제거 #1256 * [Feat] 결과 템플릿 조회 및 등록 api 수정 * [Fix] Iquestion 타입 수정 - checkedList -> checkList * [Fix] IuserFormResponse 추가 * [Fix] IcheckItem 변경사항 적용 * [Feat] 서류 결과 등록 모달 호출 로직 추가 * [Refact] 결과 등록 모달 하나로 통일 * [Feat] 최종 결과 등록 모달 호출 로직 추가 * [Feat] 결과 등록 임시 모달 생성 * [Fix] 타입 에러 수정 * [Refactor] 사용하지 않는 import 제거 * [Feat] mockInstance 제거 * [Feat] RecruitmentsHistoryList 임시 api 연결 * [Feat] useRucruitmentUserFilter 임시 api 연결 * [Feat] NotificationResults 임시 api 연결 * [Fix] 중복된 admin 제거 --------- Co-authored-by: kimjaehyuk <jhkim0097@gmail.com> Co-authored-by: Sangmin Park <sangminpark@Sangminui-MacBookPro.local> Co-authored-by: greatSweetMango <93255519+greatSweetMango@users.noreply.github.com> Co-authored-by: PHJoon <phj9503@gmail.com> Co-authored-by: hyungjpa <100325940+PHJoon@users.noreply.github.com> Co-authored-by: parksangmin1543 <103469291+parksangmin1543@users.noreply.github.com> Co-authored-by: hyobb109 <hyobb109@gmail.com> Co-authored-by: hyobicho <105159293+hyobb109@users.noreply.github.com>
42organization · Apr 6, 2024 · 2cb711a · 2cb711a
1 parent 180e38b
commit 2cb711a
Show file tree

Hide file tree

Showing 50 changed files with 1,726 additions and 364 deletions.
diff --git a/components/UI/DraggableList.tsx b/components/UI/DraggableList.tsx
@@ -24,26 +24,27 @@ const DraggableList = React.memo(
               {...provided.droppableProps}
               style={{ width: '100%' }}
             >
-              {children.map((item, index) => (
-                <Draggable
-                  draggableId={`item-${index}`}
-                  index={index}
-                  key={index}
-                >
-                  {(provided, snapshot) => (
-                    <ListItem
-                      ref={provided.innerRef}
-                      {...provided.draggableProps}
-                      {...provided.dragHandleProps}
-                      className={
-                        snapshot.isDragging ? styles.draggingListItem : ''
-                      }
-                    >
-                      {item}
-                    </ListItem>
-                  )}
-                </Draggable>
-              ))}
+              {children &&
+                children.map((item, index) => (
+                  <Draggable
+                    draggableId={`item-${index}`}
+                    index={index}
+                    key={index}
+                  >
+                    {(provided, snapshot) => (
+                      <ListItem
+                        ref={provided.innerRef}
+                        {...provided.draggableProps}
+                        {...provided.dragHandleProps}
+                        className={
+                          snapshot.isDragging ? styles.draggingListItem : ''
+                        }
+                      >
+                        {item}
+                      </ListItem>
+                    )}
+                  </Draggable>
+                ))}
               {provided.placeholder}
             </div>
           )}

diff --git a/components/admin/common/AdminTable.tsx b/components/admin/common/AdminTable.tsx
@@ -71,3 +71,24 @@ export function AdminContent({
     <div>{content?.toString()}</div>
   );
 }
+
+export function DetailContentHover({
+  content,
+  maxLen,
+}: {
+  content?: string;
+  maxLen: number;
+}) {
+  if (!content) return <div>N/A</div>;
+
+  return content?.length > maxLen ? (
+    <div className={styles.tableBodyItemHover}>
+      <div className={styles.info}>
+        {(content?.toString() || '').slice(0, maxLen)}...
+      </div>
+      {/* <div className={`${styles.hoverInfo}`}>{content}</div> */}
+    </div>
+  ) : (
+    <div>{content?.toString()}</div>
+  );
+}
diff --git a/components/admin/recruitments/RecruitmentsHistoryList.tsx b/components/admin/recruitments/RecruitmentsHistoryList.tsx
@@ -1,4 +1,10 @@
-import { useCallback, useEffect, useState } from 'react';
+import {
+  Dispatch,
+  SetStateAction,
+  useCallback,
+  useEffect,
+  useState,
+} from 'react';
 import { useSetRecoilState } from 'recoil';
 import {
   Paper,
@@ -8,10 +14,14 @@ import {
   TableContainer,
   TableRow,
 } from '@mui/material';
-import { Irecruit, IrecruitTable } from 'types/admin/adminRecruitmentsTypes';
-// import { instanceInManage } from 'utils/axios';
+import {
+  Irecruit,
+  IrecruitTable,
+  RecruitmentDetailProps,
+  RecruitmentsPages,
+} from 'types/admin/adminRecruitmentsTypes';
+import { instanceInManage } from 'utils/axios';
 import { dateToStringShort } from 'utils/handleTime';
-import { mockInstance } from 'utils/mockAxios';
 import { toastState } from 'utils/recoil/toast';
 import { tableFormat } from 'constants/admin/table';
 import {
@@ -32,7 +42,11 @@ const tableTitle: { [key: string]: string } = {
   detaillUser: '지원자 보기',
 };
 
-function RecruitmentsHistoryList() {
+function RecruitmentsHistoryList({
+  setPage,
+}: {
+  setPage: Dispatch<SetStateAction<RecruitmentsPages>>;
+}) {
   const [recruitData, setRecruitData] = useState<IrecruitTable>({
     recruitment: [],
     totalPage: 0,
@@ -45,15 +59,20 @@ function RecruitmentsHistoryList() {
 
   const getRecruitHandler = useCallback(async () => {
     try {
-      // const res = await instanceInManage.get(
-      //   `/recruitments?page=${currentPage}&size=20`
-      // );
-      const res = await mockInstance.get(`admin/recruitments`);
+      const res = await instanceInManage.get(
+        `/recruitments?page=${currentPage}&size=20`
+      );
+      // FIXME : 페이지네이션 x 임시로 1페이지로 고정
       setRecruitData({
-        recruitment: res.data.recruitment,
-        totalPage: res.data.totalPages,
-        currentPage: res.data.number + 1,
+        recruitment: res.data.recruitments,
+        totalPage: 1,
+        currentPage: 1,
       });
+      // setRecruitData({
+      //   recruitment: res.data.recruitment,
+      //   totalPage: res.data.totalPages,
+      //   currentPage: res.data.number + 1,
+      // });
     } catch (e: any) {
       setSnackBar({
         toastName: 'get recruitment',
@@ -68,7 +87,8 @@ function RecruitmentsHistoryList() {
 
   // };
 
-  const recruitmentApplicant = (recruitId: number) => {
+  const recruitmentApplicant = (recruitId: number | undefined) => {
+    if (!recruitId) return;
     setSelectedRecruit(recruitId);
     setView('detail');
   };
@@ -78,12 +98,25 @@ function RecruitmentsHistoryList() {
   }, [currentPage]);
 
   if (view === 'detail') {
-    return <MenuTab recruitId={selectedRecruit} />;
+    return <MenuTab setPage={setPage} recruitId={selectedRecruit} />;
   }
 
   const renderTableCell = (recruit: Irecruit, columnName: string) => {
     if (columnName === 'detailRecruitment') {
-      return <button className={styles.deleteBtn}>상세보기</button>;
+      return (
+        <button
+          className={styles.deleteBtn}
+          onClick={() => {
+            const props = {
+              setPage: setPage,
+              recruit: recruit,
+            } as RecruitmentDetailProps;
+            setPage({ pageType: 'DETAIL', props: props });
+          }}
+        >
+          상세보기
+        </button>
+      );
     }
 
     if (columnName === 'detaillUser') {
@@ -109,9 +142,9 @@ function RecruitmentsHistoryList() {
 
     return (
       <AdminContent
-        content={recruit[columnName as keyof Irecruit]?.toString()}
+        content={recruit[columnName as keyof Irecruit]?.toString() as string}
         maxLen={16}
-        detailTitle={recruit.id.toString()}
+        detailTitle={(recruit.id as number).toString()}
         detailContent={recruit.title}
       />
     );

diff --git a/components/admin/recruitments/RecruitmentsMain.tsx b/components/admin/recruitments/RecruitmentsMain.tsx
@@ -1,29 +1,29 @@
 import { Dispatch, SetStateAction } from 'react';
+import {
+  RecruitmentsMainProps,
+  RecruitmentsPages,
+} from 'types/admin/adminRecruitmentsTypes';
 import styles from 'styles/admin/store/StoreMain.module.scss';
 import RecruitmentEdit from './recruitmentsEdit/RecruitmentEdit';
 import RecruitmentsHistoryList from './RecruitmentsHistoryList';
 
-interface RecruitmentsMainProps {
-  setPageType: Dispatch<SetStateAction<'MAIN' | 'EDIT'>>;
-}
-
-function RecruitmentsMain({ setPageType }: RecruitmentsMainProps) {
+function RecruitmentsMain({ setPage }: RecruitmentsMainProps) {
   //return menutab
   return (
     <div className={styles.mainContainer}>
       <div className={styles.subContainer}>
         <button
           className={styles.sectionTitle}
           onClick={() => {
-            setPageType('EDIT');
+            setPage({ pageType: 'EDIT', props: { mode: 'CREATE', setPage } });
           }}
         >
           지원 공고 등록
         </button>
       </div>
       <div className={styles.subContainer}>
         <div className={styles.sectionTitle}>변경 이력</div>
-        <RecruitmentsHistoryList />
+        <RecruitmentsHistoryList setPage={setPage} />
       </div>
     </div>
   );

diff --git a/components/admin/recruitments/recruitmentsDetail/RecruitmentDetail.tsx b/components/admin/recruitments/recruitmentsDetail/RecruitmentDetail.tsx
@@ -0,0 +1,91 @@
+import { useEffect, useState } from 'react';
+import { useSetRecoilState } from 'recoil';
+import {
+  Iquestion,
+  Irecruit,
+  RecruitmentDetailProps,
+  RecruitmentsMainProps,
+} from 'types/admin/adminRecruitmentsTypes';
+import { instanceInManage } from 'utils/axios';
+import { toastState } from 'utils/recoil/toast';
+import styles from 'styles/admin/recruitments/recruitmentDetail/RecruitmentDetail.module.scss';
+import ActionSelectorButtons from './components/ActionSelectorButtons';
+import QuestionForm from './components/QuestionForm';
+import QuillDescriptionViewer from './components/QuillDescriptionViewer';
+import TitleTimeRange from './components/TitleTimeRange';
+
+export default function RecruitmentDetail({
+  setPage,
+  recruit,
+}: RecruitmentDetailProps) {
+  const [recruitmentInfo, setRecruitmentInfo] = useState<Irecruit>({
+    title: '',
+    startDate: new Date(),
+    endDate: new Date(),
+    generation: '',
+    contents: '',
+    form: [],
+  });
+
+  const [isLoading, setIsLoading] = useState<boolean>(true);
+  const setSnackBar = useSetRecoilState(toastState);
+
+  const getRecruitmentInfo = async () => {
+    setIsLoading(true);
+    try {
+      const res = await instanceInManage.get('/recruitments/' + recruit.id);
+      const data: Irecruit = {
+        id: recruit.id,
+        status: recruit.status,
+        title: res.data.title,
+        startDate: new Date(res.data.startDate),
+        endDate: new Date(res.data.endDate),
+        generation: res.data.generation,
+        contents: res.data.contents,
+        form: res.data.form,
+      };
+      setRecruitmentInfo(data);
+      setIsLoading(false);
+    } catch (e: any) {
+      setSnackBar({
+        toastName: 'get recruitment',
+        severity: 'error',
+        message: `API 요청에 문제가 발생했습니다.`,
+        clicked: true,
+      });
+    }
+  };
+
+  useEffect(() => {
+    getRecruitmentInfo();
+  }, []);
+
+  return (
+    <div className={styles.container}>
+      <button
+        onClick={() => {
+          const props = { setPage: setPage } as RecruitmentsMainProps;
+          setPage({ pageType: 'MAIN', props: props });
+        }}
+      >
+        홈으로 돌아가기
+      </button>
+      {isLoading ? (
+        <p>로딩중...</p>
+      ) : (
+        <>
+          <ActionSelectorButtons
+            recruitmentInfo={recruitmentInfo as Irecruit}
+            actionType='CREATE'
+            setPage={setPage}
+          ></ActionSelectorButtons>
+          <TitleTimeRange recruitmentInfo={recruitmentInfo as Irecruit} />
+          <QuillDescriptionViewer
+            contents={recruitmentInfo.contents as string}
+          />
+          <QuestionForm form={recruitmentInfo.form as Iquestion[]} />
+        </>
+      )}
+    </div>
+  );
+}