Merge pull request #175 from COW-dev/feat/#174

동아리 상세정보 validation & 속성 배치 수정
COW-dev · Sep 26, 2024 · cc74ad3 · cc74ad3
2 parents 2dfcd6c + 33b16cf
commit cc74ad3
Show file tree

Hide file tree

Showing 12 changed files with 73 additions and 52 deletions.
diff --git a/src/apis/index.ts b/src/apis/index.ts
@@ -50,6 +50,7 @@ import { Score, ScoreDetail } from '@/types/score';
 export type ErrorType = {
   status: number;
   message: string;
+  timestamp: string;
 };
 
 const api = axios.create({

diff --git a/src/components/admin-club/ClubInfoForm.tsx b/src/components/admin-club/ClubInfoForm.tsx
@@ -130,24 +130,6 @@ export default function ClubInfoForm({
             disabled={!isEditing}
           />
         </div>
-        <div className="mb-2 w-full md:mb-3 md:w-[50%]">
-          <label className="inline-block w-20 font-semibold text-gray-500">
-            정기모임
-          </label>
-          <input
-            name="regularMeeting"
-            type="text"
-            spellCheck={false}
-            className={`${
-              !isEditing && 'opacity-60'
-            } w-[75%] rounded-xl border border-gray-100 bg-gray-50 px-4 py-2.5 outline-none md:px-5`}
-            value={regularMeeting}
-            onChange={(e) => handleChange(e)}
-            disabled={!isEditing}
-          />
-        </div>
-      </div>
-      <div className="flex flex-col md:flex-row ">
         <div className="mb-2 flex w-full items-center md:mb-3 md:w-[50%]">
           <label className="inline-block w-20 font-semibold text-gray-500">
             모집기간
@@ -181,6 +163,24 @@ export default function ClubInfoForm({
             )}
           </div>
         </div>
+      </div>
+      <div className="flex flex-col md:flex-row ">
+        <div className="mb-2 w-full md:mb-3 md:w-[50%]">
+          <label className="inline-block w-20 font-semibold text-gray-500">
+            정기모임
+          </label>
+          <input
+            name="regularMeeting"
+            type="text"
+            spellCheck={false}
+            className={`${
+              !isEditing && 'opacity-60'
+            } w-[75%] rounded-xl border border-gray-100 bg-gray-50 px-4 py-2.5 outline-none md:px-5`}
+            value={regularMeeting}
+            onChange={(e) => handleChange(e)}
+            disabled={!isEditing}
+          />
+        </div>
         <div className="mb-2 w-full md:mb-3 md:w-[50%]">
           <label className="inline-block w-20 font-semibold text-gray-500">
             지원링크

diff --git a/src/components/club/ClubHeading.tsx b/src/components/club/ClubHeading.tsx
@@ -4,7 +4,7 @@ import Heading from '@/components/common/Heading';
 import { deptCaptionColor } from '@/constants/color';
 import { useAllClubs } from '@/hooks/api/club/useAllClubs';
 import { ClubDetail } from '@/types/club';
-import { parseImgUrl } from '@/utils/parse';
+import { parseDate, parseImgUrl } from '@/utils/parse';
 
 type ClubHeadingProps = {
   info: ClubDetail;
@@ -74,16 +74,15 @@ export default function ClubHeading({ info }: ClubHeadingProps) {
               <span>{location}</span>
             </div>
             <div className="mb-1.5">
-              <span className="inline-block w-20 text-gray-500">정기모임</span>
-              <span>{regularMeeting}</span>
+              <span className="inline-block w-20 text-gray-500">모집기간</span>
+              {parseDate(startRecruitPeriod?.split(' ')[0])}
+              <span className="mx-1">~</span>
+              {parseDate(endRecruitPeriod?.split(' ')[0])}
             </div>
           </div>
           <div className="w-full">
-            <span className="inline-block w-20 text-gray-500">모집기간</span>
-            <span>
-              {startRecruitPeriod?.split(' ')[0]}~
-              {endRecruitPeriod?.split(' ')[0]}
-            </span>
+            <span className="inline-block w-20 text-gray-500">정기모임</span>
+            <span>{regularMeeting}</span>
           </div>
         </div>
         <button

diff --git a/src/hooks/api/club/useDeleteReport.ts b/src/hooks/api/club/useDeleteReport.ts
@@ -6,12 +6,12 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { deleteReport } from '@/apis';
+import { deleteReport, ErrorType } from '@/apis';
 import { DeleteReport } from '@/types/report';
 
 export function useDeleteReport(): UseMutationResult<
   unknown,
-  AxiosError,
+  AxiosError<ErrorType>,
   DeleteReport
 > {
   const queryClient = useQueryClient();
@@ -23,7 +23,9 @@ export function useDeleteReport(): UseMutationResult<
       queryClient.invalidateQueries(['activity-reports']);
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`활동보고서 삭제에 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/club/useNewReport.ts b/src/hooks/api/club/useNewReport.ts
@@ -6,11 +6,11 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { createReport } from '@/apis';
+import { createReport, ErrorType } from '@/apis';
 
 export function useNewReport(): UseMutationResult<
   unknown,
-  AxiosError,
+  AxiosError<ErrorType>,
   FormData
 > {
   const queryClient = useQueryClient();
@@ -23,7 +23,9 @@ export function useNewReport(): UseMutationResult<
       router.push('/report');
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`활동보고서 생성에 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/club/useUpdateMyClub.ts b/src/hooks/api/club/useUpdateMyClub.ts
@@ -5,11 +5,11 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { updateMyClub } from '@/apis';
+import { ErrorType, updateMyClub } from '@/apis';
 
 export function useUpdateMyClub(): UseMutationResult<
   unknown,
-  AxiosError,
+  AxiosError<ErrorType>,
   FormData,
   [string]
 > {
@@ -22,8 +22,11 @@ export function useUpdateMyClub(): UseMutationResult<
       });
       toast.success('동아리 정보를 수정했어요.');
     },
-    onError() {
-      toast.error('동아리 정보 수정을 실패했어요');
+    onError(error) {
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
+      toast.error(`동아리 정보 수정을 실패했어요. ${errorMessage}`);
     },
   });
 }
diff --git a/src/hooks/api/club/useUpdateReports.ts b/src/hooks/api/club/useUpdateReports.ts
@@ -6,11 +6,11 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { updateReports } from '@/apis';
+import { ErrorType, updateReports } from '@/apis';
 
 export function useUpdateReports(
   term: number,
-): UseMutationResult<unknown, AxiosError, FormData, [number]> {
+): UseMutationResult<unknown, AxiosError<ErrorType>, FormData, [number]> {
   const queryClient = useQueryClient();
 
   return useMutation((formData: FormData) => updateReports(term, formData), {
@@ -22,7 +22,9 @@ export function useUpdateReports(
       router.push('/report');
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`활동보고서 수정에 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/fixzone/useDeleteFixComment.ts b/src/hooks/api/fixzone/useDeleteFixComment.ts
@@ -5,20 +5,22 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { deleteFixComment } from '@/apis';
+import { deleteFixComment, ErrorType } from '@/apis';
 import { DeleteFixComment } from '@/types/fix';
 
 export function useDeleteFixComment(
   fixId: number,
-): UseMutationResult<unknown, AxiosError, DeleteFixComment> {
+): UseMutationResult<unknown, AxiosError<ErrorType>, DeleteFixComment> {
   const queryClient = useQueryClient();
   return useMutation(deleteFixComment, {
     onSuccess() {
       toast.success('댓글을 성공적으로 삭제했어요.');
       queryClient.invalidateQueries({ queryKey: ['fix', fixId] });
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`댓글 삭제를 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/fixzone/useNewFix.ts b/src/hooks/api/fixzone/useNewFix.ts
@@ -7,10 +7,14 @@ import {
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
 
-import { createFix } from '@/apis';
+import { createFix, ErrorType } from '@/apis';
 import { NewFix } from '../../../types/fix';
 
-export function useNewFix(): UseMutationResult<unknown, AxiosError, NewFix> {
+export function useNewFix(): UseMutationResult<
+  unknown,
+  AxiosError<ErrorType>,
+  NewFix
+> {
   const queryClient = useQueryClient();
   const router = useRouter();
 
@@ -21,7 +25,9 @@ export function useNewFix(): UseMutationResult<unknown, AxiosError, NewFix> {
       router.push('/fix');
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`요청을 전송하는데 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/fixzone/useNewFixComment.ts b/src/hooks/api/fixzone/useNewFixComment.ts
@@ -6,20 +6,22 @@ import {
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
 
-import { createFixComment } from '@/apis';
+import { createFixComment, ErrorType } from '@/apis';
 import { NewFixComment } from '../../../types/fix';
 
 export function useNewFixComment(
   fixId: number,
-): UseMutationResult<unknown, AxiosError, NewFixComment> {
+): UseMutationResult<unknown, AxiosError<ErrorType>, NewFixComment> {
   const queryClient = useQueryClient();
   return useMutation(createFixComment, {
     onSuccess() {
       toast.success('댓글 작성에 성공했어요.');
       queryClient.invalidateQueries({ queryKey: ['fix', fixId] });
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`댓글 작성에 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/hooks/api/fixzone/useUpdateComplete.ts b/src/hooks/api/fixzone/useUpdateComplete.ts
@@ -7,12 +7,12 @@ import {
 } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
 import toast from 'react-hot-toast';
-import { updateFixComplete } from '@/apis';
+import { ErrorType, updateFixComplete } from '@/apis';
 import { FixComplete } from '@/types/fix';
 
 export function useUpdateComplete(): UseMutationResult<
   unknown,
-  AxiosError,
+  AxiosError<ErrorType>,
   FixComplete
 > {
   const queryClient = useQueryClient();
@@ -26,7 +26,9 @@ export function useUpdateComplete(): UseMutationResult<
       router.push('/fix');
     },
     onError(error) {
-      const errorMessage = error.message ? `\n ${error.message}` : '';
+      const errorMessage = error.response?.data?.message
+        ? `\n ${error.response?.data?.message}`
+        : '';
       toast.error(`처리완료 변경에 실패했어요.${errorMessage}`);
     },
   });

diff --git a/src/utils/validator.ts b/src/utils/validator.ts
@@ -1,5 +1,5 @@
 const type: Record<string, RegExp> = {
-  phoneNumber: /^010-\d{4}-\d{4}$/,
+  phoneNumber: /^\d{2,3}-\d{3,4}-\d{4}$/,
   password: /^(?=.*[a-zA-Z])(?=.*\d).{8,}$/,
   location: /^S\d{4,}$/,
   date: /\d{4}-\d{2}-\d{2}/,