From 63c2d46a7eaf2158e30757d0347598a1febb53df Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 17:29:11 +0900 Subject: [PATCH 1/9] =?UTF-8?q?refactor:=20=EB=AF=B8=EC=85=98=20=EC=A0=9C?= =?UTF-8?q?=EC=B6=9C=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=A6=AC=ED=8C=A9?= =?UTF-8?q?=ED=84=B0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/hooks/useSubmitSolution.ts | 5 -- frontend/src/mocks/handlers.ts | 41 ++++++++++ .../src/pages/MissionSubmitPage.styled.ts | 5 ++ frontend/src/pages/MissionSubmitPage.tsx | 78 +++++++++++-------- 4 files changed, 91 insertions(+), 38 deletions(-) diff --git a/frontend/src/hooks/useSubmitSolution.ts b/frontend/src/hooks/useSubmitSolution.ts index e60d44fb..39d55cf8 100644 --- a/frontend/src/hooks/useSubmitSolution.ts +++ b/frontend/src/hooks/useSubmitSolution.ts @@ -4,7 +4,6 @@ import useSubmitSolutionMutation from './useSubmitSolutionMutation'; import useModal from './useModal'; import type { FormEvent } from 'react'; import useSolutionTitle from './useSolutionTitle'; -// import extractMissionName from '@/utils/extractMissionName'; interface UseSubmitSolutionParams { missionId: number; @@ -14,9 +13,6 @@ interface UseSubmitSolutionParams { const useSubmitSolution = ({ missionId }: UseSubmitSolutionParams) => { const { url, handleUrl, isValidUrl, isUrlError, setIsUrlError } = useUrl(); - //TODO 임시 주석 처리 - // const isMatchedMissionName = missionName === extractMissionName(url); - const { description, handleDescription, @@ -77,7 +73,6 @@ const useSubmitSolution = ({ missionId }: UseSubmitSolutionParams) => { isDescriptionError, isSolutionTitleError, isSubmitSolutionError, - // isMatchedMissionName, }; }; diff --git a/frontend/src/mocks/handlers.ts b/frontend/src/mocks/handlers.ts index 69120c67..6a6dcac2 100644 --- a/frontend/src/mocks/handlers.ts +++ b/frontend/src/mocks/handlers.ts @@ -197,4 +197,45 @@ export const handlers = [ http.delete(`${API_URL}${PATH.discussions}/:id`, () => { return HttpResponse.json({ status: 200 }); }), + + http.post(`${API_URL}${PATH.submitSolution}`, async ({ request }) => { + try { + const { missionId, title, url, description } = (await request.json()) as { + missionId: number; + title: string; + url: string; + description: string; + }; + + const newSolution = { + id: mockSolutions.length + 1, + title, + description, + url, + member: { + id: 1, + email: 'email@example.com', + name: 'test', + imageUrl: 'http://example.com', + }, + mission: { + id: missionId, + title: 'string', + language: 'string', + descriptionUrl: 'string', + thumbnail: 'string', + url: 'https://github.com/develup-mission/react-auth-form', + isStarted: 'boolean', + summary: 'string', + hashTags: [{ id: 1, name: 'zz' }], + }, + }; + + mockSolutions.push(newSolution); + + return HttpResponse.json({ data: newSolution }, { status: 201 }); + } catch (error) { + return HttpResponse.json({ message: 'Invalid data' }, { status: 400 }); + } + }), ]; diff --git a/frontend/src/pages/MissionSubmitPage.styled.ts b/frontend/src/pages/MissionSubmitPage.styled.ts index 4ae6eca1..b4644009 100644 --- a/frontend/src/pages/MissionSubmitPage.styled.ts +++ b/frontend/src/pages/MissionSubmitPage.styled.ts @@ -18,3 +18,8 @@ export const Container = styled.div` animation: ${show} 0.5s; transition: 0.5s; `; + +export const Wrapper = styled.section` + maxwidth: 100rem; + margin: 0 auto; +` \ No newline at end of file diff --git a/frontend/src/pages/MissionSubmitPage.tsx b/frontend/src/pages/MissionSubmitPage.tsx index 504e4f29..51a8fd2d 100644 --- a/frontend/src/pages/MissionSubmitPage.tsx +++ b/frontend/src/pages/MissionSubmitPage.tsx @@ -11,7 +11,7 @@ import useSubmitSolution from '@/hooks/useSubmitSolution'; import LoadingSpinner from '@/components/common/LoadingSpinner/LoadingSpinner'; import MissionTitle from '@/components/MissionSubmit/MissionTitle'; import useUserInfo from '@/hooks/useUserInfo'; -import { useEffect } from 'react'; +import { useCallback, useEffect } from 'react'; import { useUpdateSolution } from '@/hooks/useUpdateSolution'; import useSolution from '@/hooks/useSolution'; @@ -42,50 +42,62 @@ export default function MissionSubmitPage() { isDescriptionError, isSolutionTitleError, isSubmitSolutionError, - // isValidUrl, - // isValidDescription, isValidSolutionTitle, - // isMatchedMissionName, } = useSubmitSolution({ missionId, missionName }); const { title: inputTitle, url: inputUrl, description: inputDescription, member } = solution; const isEditMode = !!solutionId; - // 글을 수정하는 경우 input의 초기값을 해당 값으로 변경 - useEffect(() => { - if (isEditMode && member?.id === userInfo?.id) { - if (inputTitle) - handleSolutionTitle({ - target: { value: inputTitle }, - } as React.ChangeEvent); - if (inputDescription) - handleDescription({ - target: { value: inputDescription }, - } as React.ChangeEvent); - if (inputUrl) - handleUrl({ target: { value: inputUrl } } as React.ChangeEvent); + // 초기값 설정 함수 + const setInitialInputValues = useCallback(() => { + if (!isEditMode || member?.id !== userInfo?.id) return; + + if (inputTitle) { + handleSolutionTitle({ target: { value: inputTitle } } as React.ChangeEvent); + } + if (inputDescription) { + handleDescription({ + target: { value: inputDescription }, + } as React.ChangeEvent); } - }, [isEditMode, inputTitle, inputDescription, inputUrl, member?.id, userInfo?.id]); + if (inputUrl) { + handleUrl({ target: { value: inputUrl } } as React.ChangeEvent); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [isEditMode, member?.id, userInfo?.id, inputTitle, inputDescription, inputUrl]); - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); + useEffect(() => { + setInitialInputValues(); + }, [setInitialInputValues]); - if (isEditMode && solutionId) { - solutionPatchMutation({ - solutionId, - title: solutionTitle, - description, - url, - }); - } else { - handleSubmitSolution(e); - } - }; + // 수정 모드에서의 제출 처리 + const handleEditSubmit = useCallback(() => { + solutionPatchMutation({ + solutionId, + title: solutionTitle, + description, + url, + }); + }, [solutionId, solutionPatchMutation, solutionTitle, description, url]); + + // 제출 처리 + const handleFormSubmit = useCallback( + (e: React.FormEvent) => { + e.preventDefault(); + + if (isEditMode && solutionId) { + handleEditSubmit(); + } else { + handleSubmitSolution(e); + } + }, + [isEditMode, handleEditSubmit, handleSubmitSolution, solutionId], + ); return ( {isPending && } -
+
-
+ From ae767df8b34b23281aa425e58c0e9649524c0c8a Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 17:31:19 +0900 Subject: [PATCH 2/9] =?UTF-8?q?rename:=20MissionSubmitPage=20=EA=B2=BD?= =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/index.tsx | 2 +- .../pages/{ => MissionSubmitPage}/MissionSubmitPage.styled.ts | 4 ++-- .../src/pages/{ => MissionSubmitPage}/MissionSubmitPage.tsx | 0 3 files changed, 3 insertions(+), 3 deletions(-) rename frontend/src/pages/{ => MissionSubmitPage}/MissionSubmitPage.styled.ts (93%) rename frontend/src/pages/{ => MissionSubmitPage}/MissionSubmitPage.tsx (100%) diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx index 7b598943..41852d48 100644 --- a/frontend/src/index.tsx +++ b/frontend/src/index.tsx @@ -40,7 +40,7 @@ const UserProfilePage = lazy(() => import('./pages/UserProfilePage')); // 미션 const MissionDetailPage = lazy(() => import('./pages/MissionDetailPage')); -const MissionSubmitPage = lazy(() => import('./pages/MissionSubmitPage')); +const MissionSubmitPage = lazy(() => import('./pages/MissionSubmitPage/MissionSubmitPage')); const MissionListPage = lazy(() => import('./pages/MissionListPage')); // 풀이 (솔루션) diff --git a/frontend/src/pages/MissionSubmitPage.styled.ts b/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.styled.ts similarity index 93% rename from frontend/src/pages/MissionSubmitPage.styled.ts rename to frontend/src/pages/MissionSubmitPage/MissionSubmitPage.styled.ts index b4644009..64d95cd9 100644 --- a/frontend/src/pages/MissionSubmitPage.styled.ts +++ b/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.styled.ts @@ -20,6 +20,6 @@ export const Container = styled.div` `; export const Wrapper = styled.section` - maxwidth: 100rem; + max-width: 100rem; margin: 0 auto; -` \ No newline at end of file +`; diff --git a/frontend/src/pages/MissionSubmitPage.tsx b/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx similarity index 100% rename from frontend/src/pages/MissionSubmitPage.tsx rename to frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx From 2d8cbee5e56ab7ee6b4aa60d0bf8217925adf46d Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 18:05:52 +0900 Subject: [PATCH 3/9] =?UTF-8?q?fix:=20useSubmitDiscussionMutation=EC=9D=98?= =?UTF-8?q?=20invalidateQuery=20Key=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/hooks/useSubmitDiscussionMutation.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/hooks/useSubmitDiscussionMutation.ts b/frontend/src/hooks/useSubmitDiscussionMutation.ts index c324a372..06fa16ef 100644 --- a/frontend/src/hooks/useSubmitDiscussionMutation.ts +++ b/frontend/src/hooks/useSubmitDiscussionMutation.ts @@ -3,6 +3,7 @@ import useSingleRequestMutation from './useSingleRequestMutation'; import { ROUTES } from '../constants/routes'; import { useNavigate } from 'react-router-dom'; import { postDiscussionSubmit } from '@/apis/discussionAPI'; +import { discussionKeys } from './queries/keys'; const SINGLE_REQUEST_ID = 'submit_discussion'; @@ -12,7 +13,7 @@ const useSubmitDiscussionMutation = () => { const { mutate: submitDiscussionMutation, isPending } = useSingleRequestMutation({ mutationFn: postDiscussionSubmit, onSuccess: () => { - queryClient.invalidateQueries({ queryKey: ['all'] }); // TODO: all, 필터링까지 캐시 무효화 잘 되는지 확인 필요 @프룬 + queryClient.invalidateQueries({ queryKey: discussionKeys.all }); navigate(ROUTES.discussions); }, onError: (error: Error) => { From 4183ca3adf5569262b508eae7e451f7ebbf82645 Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 18:06:15 +0900 Subject: [PATCH 4/9] =?UTF-8?q?refactor:=20discussion=20=EC=A0=9C=EC=B6=9C?= =?UTF-8?q?=20=EB=A1=9C=EC=A7=81=20=EB=A6=AC=ED=8C=A9=ED=84=B0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/DiscussionSubmit/index.tsx | 90 +++++++----- frontend/src/mocks/Discussion.json | 128 ++++++++++++++---- frontend/src/mocks/handlers.ts | 44 +++++- 3 files changed, 197 insertions(+), 65 deletions(-) diff --git a/frontend/src/components/DiscussionSubmit/index.tsx b/frontend/src/components/DiscussionSubmit/index.tsx index e9338f32..ac8a6926 100644 --- a/frontend/src/components/DiscussionSubmit/index.tsx +++ b/frontend/src/components/DiscussionSubmit/index.tsx @@ -3,7 +3,7 @@ import DiscussionTitle from './DiscussionTitle'; import DiscussionDescription from './DiscussionDescription'; import SubmitButton from '../MissionSubmit/SubmitButton'; import useHashTags from '@/hooks/useHashTags'; -import { useEffect, useState } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import useMissions from '@/hooks/useMissions'; import TagMultipleList from '../common/TagMultipleList'; import type { HashTag } from '@/types'; @@ -43,7 +43,6 @@ export default function DiscussionSubmit() { discussionTitle, isDiscussionTitleError, isValidDiscussionTitle, - // isValidDescription, handleDiscussionTitle, handleMarkDownDescription, isDescriptionError, @@ -59,40 +58,69 @@ export default function DiscussionSubmit() { member, } = discussion; - useEffect(() => { - if (isEditMode && member.id === userInfo?.id) { - if (inputTitle) - handleDiscussionTitle({ - target: { value: inputTitle }, - } as React.ChangeEvent); - if (inputContent) - handleDescription({ - target: { value: inputContent }, - } as React.ChangeEvent); - if (inputMission) - setSelectedMission({ - id: inputMission.id, - title: inputMission.title, - }); - if (inputHashTags) setSelectedHashTags(inputHashTags); + // 초기 데이터 설정 함수 + const initializeFormValues = useCallback(() => { + if (!isEditMode || member.id !== userInfo?.id) return; + + if (inputTitle) { + handleDiscussionTitle({ + target: { value: inputTitle }, + } as React.ChangeEvent); } - }, [isEditMode, inputTitle, inputContent, inputMission, inputHashTags, member.id, userInfo?.id]); - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); + if (inputContent) { + handleDescription({ + target: { value: inputContent }, + } as React.ChangeEvent); + } - if (isEditMode && discussionId) { - discussionPatchMutation({ - discussionId, - title: discussionTitle, - content: description, - missionId: selectedMission?.id, - hashTagIds: selectedHashTags.map((hashTag) => hashTag.id), + if (inputMission) { + setSelectedMission({ + id: inputMission.id, + title: inputMission.title, }); - } else { - handleSubmitDiscussion(e); } - }; + + if (inputHashTags) { + setSelectedHashTags(inputHashTags); + } + }, [isEditMode, inputTitle, inputContent, inputMission, inputHashTags, member.id, userInfo?.id]); + + useEffect(() => { + initializeFormValues(); + }, [initializeFormValues]); + + // 수정 모드 제출 함수 + const handleEditSubmit = useCallback(() => { + discussionPatchMutation({ + discussionId, + title: discussionTitle, + content: description, + missionId: selectedMission?.id, + hashTagIds, + }); + }, [ + discussionId, + discussionPatchMutation, + discussionTitle, + description, + selectedMission?.id, + hashTagIds, + ]); + + // 폼 제출 핸들러 + const handleFormSubmit = useCallback( + (e: React.FormEvent) => { + e.preventDefault(); + + if (isEditMode && discussionId) { + handleEditSubmit(); + } else { + handleSubmitDiscussion(e); + } + }, + [isEditMode, handleEditSubmit, handleSubmitDiscussion], + ); return ( diff --git a/frontend/src/mocks/Discussion.json b/frontend/src/mocks/Discussion.json index f178fd31..9edbdf7f 100644 --- a/frontend/src/mocks/Discussion.json +++ b/frontend/src/mocks/Discussion.json @@ -1,38 +1,106 @@ -{ - "id": 1, - "member": { +[ + { "id": 1, - "email": "test@example.com", - "name": "test", - "imageUrl": "sample.com" - }, - "title": "id가 1인 discussion", - "hashTags": [ - { + "member": { "id": 1, - "name": "JAVA" - } - ], - "content": "하이", - "mission": { - "id": 1, - "title": "", - "thumbnail": "https://raw.githubusercontent.com/develup-mission/docs/main/image/java-order.webp", - "summary": " ", - "url": "https://github.com/develup-mission/java-order", + "email": "test@example.com", + "name": "test", + "imageUrl": "sample.com" + }, + "title": "id가 1인 discussion", "hashTags": [ { "id": 1, "name": "JAVA" - }, - { - "id": 2, - "name": "객체지향" - }, - { - "id": 3, - "name": "클린코드" } - ] + ], + "content": "하이", + "mission": { + "id": 1, + "title": "", + "thumbnail": "https://raw.githubusercontent.com/develup-mission/docs/main/image/java-order.webp", + "summary": " ", + "url": "https://github.com/develup-mission/java-order", + "hashTags": [ + { + "id": 1, + "name": "JAVA" + }, + { + "id": 2, + "name": "객체지향" + }, + { + "id": 3, + "name": "클린코드" + } + ] + } + }, + { + "id": 2, + "member": { + "id": 1, + "email": "test@example.com", + "name": "test", + "imageUrl": "sample.com" + }, + "title": "zzz", + "hashTags": [], + "content": "zzz", + "mission": { + "id": 2, + "title": "", + "thumbnail": "https://raw.githubusercontent.com/develup-mission/docs/main/image/java-order.webp", + "summary": " ", + "url": "https://github.com/develup-mission/java-order", + "hashTags": [ + { + "id": 1, + "name": "JAVA" + }, + { + "id": 2, + "name": "객체지향" + }, + { + "id": 3, + "name": "클린코드" + } + ] + } + }, + { + "id": 3, + "title": "aasdadw", + "member": { + "id": 1, + "email": "test@example.com", + "name": "test", + "imageUrl": "sample.com" + }, + "hashTags": [], + "content": "aasdadw", + "mission": { + "id": 2, + "title": "", + "thumbnail": "https://raw.githubusercontent.com/develup-mission/docs/main/image/java-order.webp", + "summary": " ", + "url": "https://github.com/develup-mission/java-order", + "hashTags": [ + { + "id": 1, + "name": "JAVA" + }, + { + "id": 2, + "name": "객체지향" + }, + { + "id": 3, + "name": "클린코드" + } + ] + } } -} +] diff --git a/frontend/src/mocks/handlers.ts b/frontend/src/mocks/handlers.ts index 6a6dcac2..b934481f 100644 --- a/frontend/src/mocks/handlers.ts +++ b/frontend/src/mocks/handlers.ts @@ -146,9 +146,11 @@ export const handlers = [ ); }), - http.get(`${API_URL}${PATH.discussions}/:id`, () => { - // id가 1번인 discussion만 리턴하도록 할게요 - return HttpResponse.json({ data: mockDiscussion }, { status: 200 }); + http.get(`${API_URL}${PATH.discussions}/:id`, ({ request }) => { + const url = new URL(request.url); + const id = Number(url.pathname.split('/').pop()); + + return HttpResponse.json({ data: mockDiscussion[id - 1] }, { status: 200 }); }), http.patch(`${API_URL}${PATH.discussions}`, async ({ request }) => { @@ -160,7 +162,8 @@ export const handlers = [ hashTagIds: number[]; }; - mockDiscussion.content = content; + mockDiscussion[discussionId - 1].title = title; + mockDiscussion[discussionId - 1].content = content; const discussionIndex = mockDiscussions.findIndex( (discussion) => discussion.id === discussionId, @@ -238,4 +241,37 @@ export const handlers = [ return HttpResponse.json({ message: 'Invalid data' }, { status: 400 }); } }), + + http.post(`${API_URL}${PATH.submitDiscussion}`, async ({ request }) => { + try { + const { title, content, missionId, hashTagIds } = (await request.json()) as { + title: string; + content: string; + missionId?: number; + hashTagIds: number[]; + }; + + const newDiscussion = { + id: mockDiscussions.length + 1, + title, + content, + mission: '단어 퍼즐 게임', + hashTags: [], + member: { + id: 1, + email: 'test@example.com', + name: 'test', + imageUrl: 'sample.com', + }, + commentCount: 10, + createdAt: '2024-11-08T16:33:56.081285', + }; + + mockDiscussions.push(newDiscussion); + + return HttpResponse.json({ data: newDiscussion }, { status: 201 }); + } catch (error) { + return HttpResponse.json({ message: 'Invalid data' }, { status: 400 }); + } + }), ]; From a32c277b8633122fde3c3088f257309d10c83386 Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 18:31:47 +0900 Subject: [PATCH 5/9] =?UTF-8?q?refactor:=20discussion=20delete,=20post=20m?= =?UTF-8?q?sw=20=ED=95=B8=EB=93=A4=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/mocks/handlers.ts | 45 ++++++++++++++++++++++++++++++++-- 1 file changed, 43 insertions(+), 2 deletions(-) diff --git a/frontend/src/mocks/handlers.ts b/frontend/src/mocks/handlers.ts index b934481f..5643bea3 100644 --- a/frontend/src/mocks/handlers.ts +++ b/frontend/src/mocks/handlers.ts @@ -197,8 +197,13 @@ export const handlers = [ } }), - http.delete(`${API_URL}${PATH.discussions}/:id`, () => { - return HttpResponse.json({ status: 200 }); + http.delete(`${API_URL}${PATH.discussions}/:id`, ({ request }) => { + const url = new URL(request.url); + const id = Number(url.pathname.split('/').pop()); + + const discussions = mockDiscussions.filter((discussion) => discussion.id !== id); + + return HttpResponse.json({ data: discussions }, { status: 200 }); }), http.post(`${API_URL}${PATH.submitSolution}`, async ({ request }) => { @@ -267,7 +272,43 @@ export const handlers = [ createdAt: '2024-11-08T16:33:56.081285', }; + const newDiscussionDetail = { + id: mockDiscussions.length + 1, + title, + content, + hashTags: [], + member: { + id: 1, + email: 'test@example.com', + name: 'test', + imageUrl: 'sample.com', + }, + mission: { + id: missionId || 0, + title: '미션 제목', + thumbnail: + 'https://raw.githubusercontent.com/develup-mission/docs/main/image/java-order.webp', + summary: ' ', + url: 'https://github.com/develup-mission/java-order', + hashTags: [ + { + id: 1, + name: 'JAVA', + }, + { + id: 2, + name: '객체지향', + }, + { + id: 3, + name: '클린코드', + }, + ], + }, + }; + mockDiscussions.push(newDiscussion); + mockDiscussion.push(newDiscussionDetail); return HttpResponse.json({ data: newDiscussion }, { status: 201 }); } catch (error) { From b94d3473e5d43582173c90273d7bf579d5cbedba Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 18:57:39 +0900 Subject: [PATCH 6/9] =?UTF-8?q?refactor:=20=EB=AF=B8=EC=85=98=20=EC=A0=9C?= =?UTF-8?q?=EC=B6=9C=20=EB=B0=8F=20=EC=88=98=EC=A0=95=20=EB=A1=9C=EC=A7=81?= =?UTF-8?q?=20=EC=BB=A4=EC=8A=A4=ED=85=80=20=ED=9B=85=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/hooks/useFormSubmission.ts | 46 ++++++++++ frontend/src/hooks/useInitializeInputs.ts | 43 +++++++++ .../src/hooks/useSubmitSolutionHandlers.ts | 85 ++++++++++++++++++ frontend/src/hooks/useUpdateSolution.ts | 2 +- .../MissionSubmitPage/MissionSubmitPage.tsx | 89 +++---------------- frontend/src/types/solution.ts | 2 +- 6 files changed, 188 insertions(+), 79 deletions(-) create mode 100644 frontend/src/hooks/useFormSubmission.ts create mode 100644 frontend/src/hooks/useInitializeInputs.ts create mode 100644 frontend/src/hooks/useSubmitSolutionHandlers.ts diff --git a/frontend/src/hooks/useFormSubmission.ts b/frontend/src/hooks/useFormSubmission.ts new file mode 100644 index 00000000..62a7c299 --- /dev/null +++ b/frontend/src/hooks/useFormSubmission.ts @@ -0,0 +1,46 @@ +import { useCallback } from 'react'; +import type { SolutionPatchMutationProps } from './useUpdateSolution'; + +interface FormSubmissionParams { + isEditMode: boolean; + id: number; + handleSubmit: (e: React.FormEvent) => void; + patchMutation: (props: SolutionPatchMutationProps) => void; + solutionTitle: string; + description: string; + url: string; +} + +export const useFormSubmission = ({ + isEditMode, + id, + handleSubmit, + patchMutation, + solutionTitle, + description, + url, +}: FormSubmissionParams) => { + const handleEditSubmit = useCallback(() => { + patchMutation({ + solutionId: id, + title: solutionTitle, + description, + url, + }); + }, [id, patchMutation, solutionTitle, description, url]); + + const handleFormSubmit = useCallback( + (e: React.FormEvent) => { + e.preventDefault(); + + if (isEditMode && id) { + handleEditSubmit(); + } else { + handleSubmit(e); + } + }, + [isEditMode, id, handleEditSubmit, handleSubmit], + ); + + return handleFormSubmit; +}; diff --git a/frontend/src/hooks/useInitializeInputs.ts b/frontend/src/hooks/useInitializeInputs.ts new file mode 100644 index 00000000..77de3c59 --- /dev/null +++ b/frontend/src/hooks/useInitializeInputs.ts @@ -0,0 +1,43 @@ +import type { Member } from '@/types/solution'; +import type { UserInfo } from '@/types/user'; +import { useCallback, useEffect } from 'react'; + +interface InitializeInputsParams { + isEditMode: boolean; + userInfo: UserInfo | undefined; + member: Member; + inputTitle: string; + inputDescription: string; + inputUrl: string; + handleTitle: (e: React.ChangeEvent) => void; + handleDescription: (e: React.ChangeEvent) => void; + handleUrl: (e: React.ChangeEvent) => void; +} + +export const useInitializeInputs = ({ + isEditMode, + userInfo, + member, + inputTitle, + inputDescription, + inputUrl, + handleTitle, + handleDescription, + handleUrl, +}: InitializeInputsParams) => { + const setInitialInputValues = useCallback(() => { + if (!isEditMode || member?.id !== userInfo?.id) return; + + if (inputTitle) + handleTitle({ target: { value: inputTitle } } as React.ChangeEvent); + if (inputDescription) + handleDescription({ + target: { value: inputDescription }, + } as React.ChangeEvent); + if (inputUrl) handleUrl({ target: { value: inputUrl } } as React.ChangeEvent); + }, [isEditMode, userInfo?.id, member?.id, inputTitle, inputDescription, inputUrl]); + + useEffect(() => { + setInitialInputValues(); + }, [setInitialInputValues]); +}; diff --git a/frontend/src/hooks/useSubmitSolutionHandlers.ts b/frontend/src/hooks/useSubmitSolutionHandlers.ts new file mode 100644 index 00000000..d9998850 --- /dev/null +++ b/frontend/src/hooks/useSubmitSolutionHandlers.ts @@ -0,0 +1,85 @@ +import { useParams, useSearchParams } from 'react-router-dom'; +import useMission from '@/hooks/useMission'; +import useSubmitSolution from '@/hooks/useSubmitSolution'; +import useSolution from '@/hooks/useSolution'; +import useUserInfo from '@/hooks/useUserInfo'; +import { useUpdateSolution } from '@/hooks/useUpdateSolution'; +import { useInitializeInputs } from './useInitializeInputs'; +import { useFormSubmission } from './useFormSubmission'; + +export const useSubmitSolutionHandlers = () => { + const { id } = useParams(); + const missionId = Number(id) || 0; + const [searchParams] = useSearchParams(); + const solutionId = Number(searchParams.get('solutionId')) ?? null; + + const { data: mission } = useMission(missionId); + const { data: solution } = useSolution(solutionId); + const { data: userInfo } = useUserInfo(); + const { solutionPatchMutation } = useUpdateSolution(solutionId); + + const missionName = new URL(mission.url).pathname.split('/').pop() ?? ''; + const { + solutionTitle, + url, + description, + handleDescription, + handleMarkDownDescription, + handleUrl, + handleSubmitSolution: handleSubmit, + handleSolutionTitle, + isPending, + isModalOpen, + isUrlError, + isDescriptionError, + isSolutionTitleError, + isSubmitSolutionError, + isValidSolutionTitle, + } = useSubmitSolution({ missionId, missionName }); + + const { title: inputTitle, url: inputUrl, description: inputDescription, member } = solution; + const isEditMode = !!solutionId; + + // 초기값 설정 로직 + useInitializeInputs({ + isEditMode, + userInfo, + member, + inputTitle, + inputDescription, + inputUrl, + handleTitle: handleSolutionTitle, + handleDescription, + handleUrl, + }); + + // 폼 제출 로직 + const handleFormSubmit = useFormSubmission({ + isEditMode, + id: solutionId, + handleSubmit, + patchMutation: solutionPatchMutation, + solutionTitle, + description, + url, + }); + + return { + mission, + missionId, + isPending, + isModalOpen, + solutionTitle, + handleSolutionTitle, + url, + handleUrl, + description, + handleMarkDownDescription, + isSolutionTitleError, + isValidSolutionTitle, + isUrlError, + isSubmitSolutionError, + isDescriptionError, + handleFormSubmit, + }; +}; diff --git a/frontend/src/hooks/useUpdateSolution.ts b/frontend/src/hooks/useUpdateSolution.ts index 30a89afa..5f430782 100644 --- a/frontend/src/hooks/useUpdateSolution.ts +++ b/frontend/src/hooks/useUpdateSolution.ts @@ -5,7 +5,7 @@ import { queryClient } from '..'; import { ROUTES } from '@/constants/routes'; import { solutionKeys } from './queries/keys'; -interface SolutionPatchMutationProps { +export interface SolutionPatchMutationProps { solutionId: number; title: string; description: string; diff --git a/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx b/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx index 51a8fd2d..e136cd4e 100644 --- a/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx +++ b/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx @@ -4,95 +4,30 @@ import PRLink from '@/components/MissionSubmit/PRLink'; import OneWord from '@/components/MissionSubmit/OneWord'; import SubmitButton from '@/components/MissionSubmit/SubmitButton'; import SubmitSuccessPopUp from '@/components/PopUp/SubmitSuccessPopUp'; -import { useParams, useSearchParams } from 'react-router-dom'; -import useMission from '@/hooks/useMission'; import { ERROR_MESSAGE } from '@/constants/messages'; -import useSubmitSolution from '@/hooks/useSubmitSolution'; import LoadingSpinner from '@/components/common/LoadingSpinner/LoadingSpinner'; import MissionTitle from '@/components/MissionSubmit/MissionTitle'; -import useUserInfo from '@/hooks/useUserInfo'; -import { useCallback, useEffect } from 'react'; -import { useUpdateSolution } from '@/hooks/useUpdateSolution'; -import useSolution from '@/hooks/useSolution'; +import { useSubmitSolutionHandlers } from '@/hooks/useSubmitSolutionHandlers'; export default function MissionSubmitPage() { - const { id } = useParams(); - const missionId = Number(id) || 0; - const [searchParams] = useSearchParams(); - const solutionId = Number(searchParams.get('solutionId')) ?? null; - - const { data: mission } = useMission(missionId); - const { data: solution } = useSolution(solutionId); - const { data: userInfo } = useUserInfo(); - const { solutionPatchMutation } = useUpdateSolution(solutionId); - - const missionName = new URL(mission.url).pathname.split('/').pop() ?? ''; const { + mission, + missionId, + isPending, + isModalOpen, solutionTitle, + handleSolutionTitle, url, + handleUrl, description, - handleDescription, handleMarkDownDescription, - handleUrl, - handleSubmitSolution, - handleSolutionTitle, - isPending, - isModalOpen, - isUrlError, - isDescriptionError, isSolutionTitleError, - isSubmitSolutionError, isValidSolutionTitle, - } = useSubmitSolution({ missionId, missionName }); - - const { title: inputTitle, url: inputUrl, description: inputDescription, member } = solution; - const isEditMode = !!solutionId; - - // 초기값 설정 함수 - const setInitialInputValues = useCallback(() => { - if (!isEditMode || member?.id !== userInfo?.id) return; - - if (inputTitle) { - handleSolutionTitle({ target: { value: inputTitle } } as React.ChangeEvent); - } - if (inputDescription) { - handleDescription({ - target: { value: inputDescription }, - } as React.ChangeEvent); - } - if (inputUrl) { - handleUrl({ target: { value: inputUrl } } as React.ChangeEvent); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [isEditMode, member?.id, userInfo?.id, inputTitle, inputDescription, inputUrl]); - - useEffect(() => { - setInitialInputValues(); - }, [setInitialInputValues]); - - // 수정 모드에서의 제출 처리 - const handleEditSubmit = useCallback(() => { - solutionPatchMutation({ - solutionId, - title: solutionTitle, - description, - url, - }); - }, [solutionId, solutionPatchMutation, solutionTitle, description, url]); - - // 제출 처리 - const handleFormSubmit = useCallback( - (e: React.FormEvent) => { - e.preventDefault(); - - if (isEditMode && solutionId) { - handleEditSubmit(); - } else { - handleSubmitSolution(e); - } - }, - [isEditMode, handleEditSubmit, handleSubmitSolution, solutionId], - ); + isUrlError, + isSubmitSolutionError, + isDescriptionError, + handleFormSubmit, + } = useSubmitSolutionHandlers(); return ( diff --git a/frontend/src/types/solution.ts b/frontend/src/types/solution.ts index f423f1ff..e9f14c3c 100644 --- a/frontend/src/types/solution.ts +++ b/frontend/src/types/solution.ts @@ -1,6 +1,6 @@ import type { Mission } from '.'; -interface Member { +export interface Member { id: number; email: string; name: string; From c7fe0dea139f6f9a463fc9a6556e3af229b6aecf Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 22:03:13 +0900 Subject: [PATCH 7/9] =?UTF-8?q?refactor:=20useFormSubmission,=20=EC=A0=9C?= =?UTF-8?q?=EC=B6=9C=20=ED=95=B8=EB=93=A4=EB=9F=AC=20=EC=BB=A4=EC=8A=A4?= =?UTF-8?q?=ED=85=80=20=ED=9B=85=20=EC=B6=94=EC=83=81=ED=99=94=20=EB=B0=8F?= =?UTF-8?q?=20discussion=20=EC=A0=9C=EC=B6=9C=20=EB=A1=9C=EC=A7=81=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/DiscussionSubmit/index.tsx | 121 ++---------------- frontend/src/hooks/useDiscussion.ts | 2 +- frontend/src/hooks/useFormSubmission.ts | 26 ++-- frontend/src/hooks/useInitializeInputs.ts | 2 +- .../src/hooks/useSubmitDiscussionHandlers.ts | 93 ++++++++++++++ .../src/hooks/useSubmitSolutionHandlers.ts | 13 +- frontend/src/hooks/useUpdateDiscussion.ts | 2 +- 7 files changed, 126 insertions(+), 133 deletions(-) create mode 100644 frontend/src/hooks/useSubmitDiscussionHandlers.ts diff --git a/frontend/src/components/DiscussionSubmit/index.tsx b/frontend/src/components/DiscussionSubmit/index.tsx index ac8a6926..33b891b0 100644 --- a/frontend/src/components/DiscussionSubmit/index.tsx +++ b/frontend/src/components/DiscussionSubmit/index.tsx @@ -1,126 +1,29 @@ -import { useSubmitDiscussion } from '@/hooks/useSubmitDiscussion'; import DiscussionTitle from './DiscussionTitle'; import DiscussionDescription from './DiscussionDescription'; import SubmitButton from '../MissionSubmit/SubmitButton'; -import useHashTags from '@/hooks/useHashTags'; -import { useCallback, useEffect, useState } from 'react'; -import useMissions from '@/hooks/useMissions'; import TagMultipleList from '../common/TagMultipleList'; -import type { HashTag } from '@/types'; import TagList from '@/components/common/TagList'; import * as S from './DiscussionSubmit.styled'; -import { useSearchParams } from 'react-router-dom'; -import useDiscussion from '@/hooks/useDiscussion'; -import useUserInfo from '@/hooks/useUserInfo'; -import { useUpdateDiscussion } from '@/hooks/useUpdateDiscussion'; import { ERROR_MESSAGE } from '@/constants/messages'; +import { useDiscussionSubmitHandlers } from '@/hooks/useSubmitDiscussionHandlers'; export default function DiscussionSubmit() { - const [searchParams] = useSearchParams(); - const discussionId = Number(searchParams.get('discussionId')) ?? null; - const isEditMode = !!discussionId; - - const { data: discussion } = useDiscussion(discussionId); - const { data: allHashTags } = useHashTags(); - const [selectedHashTags, setSelectedHashTags] = useState([]); - const [selectedMission, setSelectedMission] = useState<{ id: number; title: string } | null>( - null, - ); - - const { missions } = useMissions(); - - const { data: userInfo } = useUserInfo(); - const { discussionPatchMutation } = useUpdateDiscussion(discussionId); - - const hashTagIds = selectedHashTags.map((tag) => tag.id); - const useSubmitDiscussionData = { - hashTagIds, - ...(selectedMission?.id && { missionId: selectedMission?.id }), - }; - const { - description, + missions, + allHashTags, + selectedHashTags, + setSelectedHashTags, + selectedMission, + setSelectedMission, discussionTitle, - isDiscussionTitleError, - isValidDiscussionTitle, + description, handleDiscussionTitle, handleMarkDownDescription, + isDiscussionTitleError, + isValidDiscussionTitle, isDescriptionError, - handleDescription, - handleSubmitDiscussion, - } = useSubmitDiscussion(useSubmitDiscussionData); - - const { - title: inputTitle, - content: inputContent, - mission: inputMission, - hashTags: inputHashTags, - member, - } = discussion; - - // 초기 데이터 설정 함수 - const initializeFormValues = useCallback(() => { - if (!isEditMode || member.id !== userInfo?.id) return; - - if (inputTitle) { - handleDiscussionTitle({ - target: { value: inputTitle }, - } as React.ChangeEvent); - } - - if (inputContent) { - handleDescription({ - target: { value: inputContent }, - } as React.ChangeEvent); - } - - if (inputMission) { - setSelectedMission({ - id: inputMission.id, - title: inputMission.title, - }); - } - - if (inputHashTags) { - setSelectedHashTags(inputHashTags); - } - }, [isEditMode, inputTitle, inputContent, inputMission, inputHashTags, member.id, userInfo?.id]); - - useEffect(() => { - initializeFormValues(); - }, [initializeFormValues]); - - // 수정 모드 제출 함수 - const handleEditSubmit = useCallback(() => { - discussionPatchMutation({ - discussionId, - title: discussionTitle, - content: description, - missionId: selectedMission?.id, - hashTagIds, - }); - }, [ - discussionId, - discussionPatchMutation, - discussionTitle, - description, - selectedMission?.id, - hashTagIds, - ]); - - // 폼 제출 핸들러 - const handleFormSubmit = useCallback( - (e: React.FormEvent) => { - e.preventDefault(); - - if (isEditMode && discussionId) { - handleEditSubmit(); - } else { - handleSubmitDiscussion(e); - } - }, - [isEditMode, handleEditSubmit, handleSubmitDiscussion], - ); + handleFormSubmit, + } = useDiscussionSubmitHandlers(); return ( diff --git a/frontend/src/hooks/useDiscussion.ts b/frontend/src/hooks/useDiscussion.ts index f0a9244c..842605b4 100644 --- a/frontend/src/hooks/useDiscussion.ts +++ b/frontend/src/hooks/useDiscussion.ts @@ -3,7 +3,7 @@ import { discussionKeys } from './queries/keys'; import type { DiscussionDetail } from '@/types/discussion'; import { getDiscussionById } from '@/apis/discussionAPI'; -const useDiscussion = (discussionId?: number) => { +const useDiscussion = (discussionId: number) => { const { data } = useQuery({ queryKey: discussionKeys.detail(discussionId || 0), queryFn: discussionId ? () => getDiscussionById(discussionId) : undefined, diff --git a/frontend/src/hooks/useFormSubmission.ts b/frontend/src/hooks/useFormSubmission.ts index 62a7c299..21e63186 100644 --- a/frontend/src/hooks/useFormSubmission.ts +++ b/frontend/src/hooks/useFormSubmission.ts @@ -1,33 +1,27 @@ import { useCallback } from 'react'; -import type { SolutionPatchMutationProps } from './useUpdateSolution'; -interface FormSubmissionParams { +interface FormSubmissionParams { isEditMode: boolean; id: number; handleSubmit: (e: React.FormEvent) => void; - patchMutation: (props: SolutionPatchMutationProps) => void; - solutionTitle: string; - description: string; - url: string; + patchMutation: (props: T) => void; + props: T; } -export const useFormSubmission = ({ +export const useFormSubmission = ({ isEditMode, id, handleSubmit, patchMutation, - solutionTitle, - description, - url, -}: FormSubmissionParams) => { + props, +}: FormSubmissionParams) => { + console.log(isEditMode); const handleEditSubmit = useCallback(() => { patchMutation({ - solutionId: id, - title: solutionTitle, - description, - url, + ...props, + id, }); - }, [id, patchMutation, solutionTitle, description, url]); + }, [patchMutation, props, id]); const handleFormSubmit = useCallback( (e: React.FormEvent) => { diff --git a/frontend/src/hooks/useInitializeInputs.ts b/frontend/src/hooks/useInitializeInputs.ts index 77de3c59..9db25715 100644 --- a/frontend/src/hooks/useInitializeInputs.ts +++ b/frontend/src/hooks/useInitializeInputs.ts @@ -27,7 +27,7 @@ export const useInitializeInputs = ({ }: InitializeInputsParams) => { const setInitialInputValues = useCallback(() => { if (!isEditMode || member?.id !== userInfo?.id) return; - + if (inputTitle) handleTitle({ target: { value: inputTitle } } as React.ChangeEvent); if (inputDescription) diff --git a/frontend/src/hooks/useSubmitDiscussionHandlers.ts b/frontend/src/hooks/useSubmitDiscussionHandlers.ts new file mode 100644 index 00000000..f107c6cf --- /dev/null +++ b/frontend/src/hooks/useSubmitDiscussionHandlers.ts @@ -0,0 +1,93 @@ +import { useState } from 'react'; +import { useInitializeInputs } from './useInitializeInputs'; +import { useFormSubmission } from './useFormSubmission'; +import useDiscussion from '@/hooks/useDiscussion'; +import useUserInfo from '@/hooks/useUserInfo'; +import useHashTags from '@/hooks/useHashTags'; +import useMissions from '@/hooks/useMissions'; +import { + type DiscussionPatchMutationProps, + useUpdateDiscussion, +} from '@/hooks/useUpdateDiscussion'; +import { useSubmitDiscussion } from '@/hooks/useSubmitDiscussion'; +import type { HashTag } from '@/types'; +import { useSearchParams } from 'react-router-dom'; + +export const useDiscussionSubmitHandlers = () => { + const [searchParams] = useSearchParams(); + const discussionId = Number(searchParams.get('discussionId')) ?? null; + + const { data: userInfo } = useUserInfo(); + const { data: allHashTags } = useHashTags(); + const { missions } = useMissions(); + + const [selectedHashTags, setSelectedHashTags] = useState([]); + const [selectedMission, setSelectedMission] = useState<{ id: number; title: string } | null>( + null, + ); + + const { data: discussion } = useDiscussion(discussionId); + const { discussionPatchMutation } = useUpdateDiscussion(discussionId || 0); + + const { + description, + discussionTitle, + isDiscussionTitleError, + isValidDiscussionTitle, + handleDiscussionTitle, + handleMarkDownDescription, + isDescriptionError, + handleDescription, + handleSubmitDiscussion, + } = useSubmitDiscussion({ + hashTagIds: selectedHashTags.map((tag) => tag.id), + missionId: selectedMission?.id, + }); + + const { title: inputTitle, content: inputContent, member } = discussion || {}; + + // 초기값 설정 로직 + useInitializeInputs({ + isEditMode: !!discussionId, + userInfo, + member, + inputTitle, + inputDescription: inputContent, + inputUrl: '', + handleTitle: handleDiscussionTitle, + handleDescription, + handleUrl: () => {}, + }); + + // 폼 제출 로직 + const handleFormSubmit = useFormSubmission({ + isEditMode: !!discussionId, + id: discussionId || 0, + handleSubmit: handleSubmitDiscussion, + patchMutation: (props: DiscussionPatchMutationProps) => discussionPatchMutation(props), + props: { + discussionId: discussionId || 0, + content: description, + hashTagIds: selectedHashTags.map((tag) => tag.id), + missionId: selectedMission?.id, + title: discussionTitle, + }, + }); + + return { + missions, + allHashTags, + selectedHashTags, + setSelectedHashTags, + selectedMission, + setSelectedMission, + discussionTitle, + description, + handleDiscussionTitle, + handleMarkDownDescription, + isDiscussionTitleError, + isValidDiscussionTitle, + isDescriptionError, + handleFormSubmit, + }; +}; diff --git a/frontend/src/hooks/useSubmitSolutionHandlers.ts b/frontend/src/hooks/useSubmitSolutionHandlers.ts index d9998850..55c162e0 100644 --- a/frontend/src/hooks/useSubmitSolutionHandlers.ts +++ b/frontend/src/hooks/useSubmitSolutionHandlers.ts @@ -3,7 +3,7 @@ import useMission from '@/hooks/useMission'; import useSubmitSolution from '@/hooks/useSubmitSolution'; import useSolution from '@/hooks/useSolution'; import useUserInfo from '@/hooks/useUserInfo'; -import { useUpdateSolution } from '@/hooks/useUpdateSolution'; +import { type SolutionPatchMutationProps, useUpdateSolution } from '@/hooks/useUpdateSolution'; import { useInitializeInputs } from './useInitializeInputs'; import { useFormSubmission } from './useFormSubmission'; @@ -54,14 +54,17 @@ export const useSubmitSolutionHandlers = () => { }); // 폼 제출 로직 - const handleFormSubmit = useFormSubmission({ + const handleFormSubmit = useFormSubmission({ isEditMode, id: solutionId, handleSubmit, patchMutation: solutionPatchMutation, - solutionTitle, - description, - url, + props: { + solutionId, + title: solutionTitle, + description, + url, + }, }); return { diff --git a/frontend/src/hooks/useUpdateDiscussion.ts b/frontend/src/hooks/useUpdateDiscussion.ts index 07f96aad..90e8a344 100644 --- a/frontend/src/hooks/useUpdateDiscussion.ts +++ b/frontend/src/hooks/useUpdateDiscussion.ts @@ -5,7 +5,7 @@ import { queryClient } from '..'; import { discussionKeys } from './queries/keys'; import { ROUTES } from '@/constants/routes'; -interface DiscussionPatchMutationProps { +export interface DiscussionPatchMutationProps { discussionId: number; title: string; content: string; From dff3b37585a3824c20749f4b3a30ccc894f04ead Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 22:09:59 +0900 Subject: [PATCH 8/9] =?UTF-8?q?rename:=20useSubmitDiscussionHandlers=20?= =?UTF-8?q?=EB=84=A4=EC=9D=B4=EB=B0=8D,=20MissionSubmitPage=20=EB=84=A4?= =?UTF-8?q?=EC=9D=B4=EB=B0=8D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/components/DiscussionSubmit/index.tsx | 4 ++-- frontend/src/hooks/useSubmitDiscussionHandlers.ts | 2 +- frontend/src/index.tsx | 2 +- .../MissionSubmitPage/{MissionSubmitPage.tsx => index.tsx} | 0 4 files changed, 4 insertions(+), 4 deletions(-) rename frontend/src/pages/MissionSubmitPage/{MissionSubmitPage.tsx => index.tsx} (100%) diff --git a/frontend/src/components/DiscussionSubmit/index.tsx b/frontend/src/components/DiscussionSubmit/index.tsx index 33b891b0..9fd1d890 100644 --- a/frontend/src/components/DiscussionSubmit/index.tsx +++ b/frontend/src/components/DiscussionSubmit/index.tsx @@ -5,7 +5,7 @@ import TagMultipleList from '../common/TagMultipleList'; import TagList from '@/components/common/TagList'; import * as S from './DiscussionSubmit.styled'; import { ERROR_MESSAGE } from '@/constants/messages'; -import { useDiscussionSubmitHandlers } from '@/hooks/useSubmitDiscussionHandlers'; +import { useSubmitDiscussionHandlers } from '@/hooks/useSubmitDiscussionHandlers'; export default function DiscussionSubmit() { const { @@ -23,7 +23,7 @@ export default function DiscussionSubmit() { isValidDiscussionTitle, isDescriptionError, handleFormSubmit, - } = useDiscussionSubmitHandlers(); + } = useSubmitDiscussionHandlers(); return ( diff --git a/frontend/src/hooks/useSubmitDiscussionHandlers.ts b/frontend/src/hooks/useSubmitDiscussionHandlers.ts index f107c6cf..19abee26 100644 --- a/frontend/src/hooks/useSubmitDiscussionHandlers.ts +++ b/frontend/src/hooks/useSubmitDiscussionHandlers.ts @@ -13,7 +13,7 @@ import { useSubmitDiscussion } from '@/hooks/useSubmitDiscussion'; import type { HashTag } from '@/types'; import { useSearchParams } from 'react-router-dom'; -export const useDiscussionSubmitHandlers = () => { +export const useSubmitDiscussionHandlers = () => { const [searchParams] = useSearchParams(); const discussionId = Number(searchParams.get('discussionId')) ?? null; diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx index 41852d48..7b598943 100644 --- a/frontend/src/index.tsx +++ b/frontend/src/index.tsx @@ -40,7 +40,7 @@ const UserProfilePage = lazy(() => import('./pages/UserProfilePage')); // 미션 const MissionDetailPage = lazy(() => import('./pages/MissionDetailPage')); -const MissionSubmitPage = lazy(() => import('./pages/MissionSubmitPage/MissionSubmitPage')); +const MissionSubmitPage = lazy(() => import('./pages/MissionSubmitPage')); const MissionListPage = lazy(() => import('./pages/MissionListPage')); // 풀이 (솔루션) diff --git a/frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx b/frontend/src/pages/MissionSubmitPage/index.tsx similarity index 100% rename from frontend/src/pages/MissionSubmitPage/MissionSubmitPage.tsx rename to frontend/src/pages/MissionSubmitPage/index.tsx From 969cbbdb3acdddbe70260e5ab40ed06381f58871 Mon Sep 17 00:00:00 2001 From: bmj0053 Date: Sat, 16 Nov 2024 22:12:27 +0900 Subject: [PATCH 9/9] =?UTF-8?q?style:=20console.log=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/hooks/useFormSubmission.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/hooks/useFormSubmission.ts b/frontend/src/hooks/useFormSubmission.ts index 21e63186..22332be8 100644 --- a/frontend/src/hooks/useFormSubmission.ts +++ b/frontend/src/hooks/useFormSubmission.ts @@ -15,7 +15,6 @@ export const useFormSubmission = ({ patchMutation, props, }: FormSubmissionParams) => { - console.log(isEditMode); const handleEditSubmit = useCallback(() => { patchMutation({ ...props,