From 0e1cd1d12cd2bd993cca7209f051820f2d17ac08 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EB=82=A8=EC=83=81=EA=B7=9C?= <103256030+tkdrb12@users.noreply.github.com> Date: Tue, 14 Nov 2023 21:33:17 +0900 Subject: [PATCH] =?UTF-8?q?=EC=84=9C=ED=8F=AC=ED=84=B0,=20=EB=9F=AC?= =?UTF-8?q?=EB=84=88=20=ED=94=84=EB=A1=9C=ED=95=84=20=EC=88=98=EC=A0=95=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=B6=84=ED=95=A0=20(#688)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: 서포터, 러너 페이지 프로필 수정페이지 분리 * fix: 서포터 프로필 정보 조회 시 러너 프로필 정보를 불러오는 오류 수정 --------- Co-authored-by: 상규 --- frontend/src/hooks/usePageRouter.ts | 11 +++-- frontend/src/pages/ProfileEditPage.tsx | 56 +++++--------------------- frontend/src/pages/RunnerMyPage.tsx | 4 +- frontend/src/pages/SupporterMyPage.tsx | 4 +- frontend/src/router.tsx | 11 +++-- 5 files changed, 29 insertions(+), 57 deletions(-) diff --git a/frontend/src/hooks/usePageRouter.ts b/frontend/src/hooks/usePageRouter.ts index 6acd35ecf..6698a5129 100644 --- a/frontend/src/hooks/usePageRouter.ts +++ b/frontend/src/hooks/usePageRouter.ts @@ -49,8 +49,12 @@ export const usePageRouter = () => { ); }; - const goToProfileEditPage = () => { - navigate(ROUTER_PATH.PROFILE_EDIT); + const goToRunnerProfileEditPage = () => { + navigate(ROUTER_PATH.RUNNER_PROFILE_EDIT); + }; + + const goToSupporterProfileEditPage = () => { + navigate(ROUTER_PATH.SUPPORTER_PROFILE_EDIT); }; const goToNoticePage = () => { @@ -74,9 +78,10 @@ export const usePageRouter = () => { goToSupporterMyPage, goToSupporterProfilePage, goToRunnerProfilePage, + goToRunnerProfileEditPage, goToSupportSelectPage, goToSupporterFeedbackPage, - goToProfileEditPage, + goToSupporterProfileEditPage, goToNoticePage, goToResultPage, goBack, diff --git a/frontend/src/pages/ProfileEditPage.tsx b/frontend/src/pages/ProfileEditPage.tsx index 58b78bdf7..be6cdc3a4 100644 --- a/frontend/src/pages/ProfileEditPage.tsx +++ b/frontend/src/pages/ProfileEditPage.tsx @@ -4,7 +4,7 @@ import TechTagSelectModal from '@/components/TechTagSelectModal/TechTagSelectMod import TextArea from '@/components/Textarea/Textarea'; import Avatar from '@/components/common/Avatar/Avatar'; import Button from '@/components/common/Button/Button'; -import { ERROR_DESCRIPTION, ERROR_TITLE, TOAST_ERROR_MESSAGE } from '@/constants/message'; +import { ERROR_DESCRIPTION, ERROR_TITLE } from '@/constants/message'; import { ModalContext } from '@/contexts/ModalContext'; import { ToastContext } from '@/contexts/ToastContext'; import { useMyRunnerProfile } from '@/hooks/query/useMyRunnerProfile'; @@ -19,7 +19,11 @@ import { validateCompany, validateIntroduction, validateName } from '@/utils/val import React, { useContext, useState } from 'react'; import styled from 'styled-components'; -const ProfileEditPage = () => { +interface Props { + isRunner: boolean; +} + +const ProfileEditPage = ({ isRunner = true }: Props) => { const { data: runnerProfileBefore } = useMyRunnerProfile(); const { data: supporterProfileBefore } = useMySupporterProfile(); const { mutate: editRunnerProfile } = useRunnerProfileEdit(); @@ -29,9 +33,7 @@ const ProfileEditPage = () => { const { openModal, closeModal } = useContext(ModalContext); const { goBack } = usePageRouter(); - const [isRunner, setIsRunner] = useState(true); - - const [runnerProfile, setRunnerProfile] = useState(runnerProfileBefore); + const [runnerProfile, setRunnerProfile] = useState(isRunner ? runnerProfileBefore : supporterProfileBefore); const [supporterProfile, setSupporterProfile] = useState(supporterProfileBefore); const [name, setName] = useState(runnerProfile.name); @@ -141,36 +143,6 @@ const ProfileEditPage = () => { closeModal(); }; - const handleClickRunnerButton = (e: React.MouseEvent) => { - e.preventDefault(); - - if (isRunner) return; - - if (!runnerProfile) return showErrorToast(TOAST_ERROR_MESSAGE.NO_PROFILE); - - if (isModified) { - if (!confirm('저장하지 않고 러너 프로필로 이동할까요?')) return; - } - - setIsRunner(true); - updateProfileInputValue(runnerProfile); - }; - - const handleClickSupporterButton = (e: React.MouseEvent) => { - e.preventDefault(); - - if (!isRunner) return; - - if (!supporterProfile) return showErrorToast(TOAST_ERROR_MESSAGE.NO_PROFILE); - - if (isModified) { - if (!confirm('저장하지 않고 서포터 프로필로 이동할까요?')) return; - } - - setIsRunner(false); - updateProfileInputValue(supporterProfile); - }; - const openTechTagSelectModal = () => { openModal( { {'<'} - 프로필 수정 + {`${isRunner ? '러너' : '서포터'} 프로필 수정`} @@ -209,15 +181,6 @@ const ProfileEditPage = () => { /> - - 러너 - - - 서포터 - 회원탈퇴 @@ -383,7 +346,7 @@ const S = { ButtonContainer: styled.div` position: relative; display: flex; - justify-content: center; + justify-content: end; gap: 15px; width: 600px; @@ -392,7 +355,6 @@ const S = { `, WithdrawalButtonWrapper: styled.div` - position: absolute; display: flex; justify-content: flex-end; margin: 20px 0; diff --git a/frontend/src/pages/RunnerMyPage.tsx b/frontend/src/pages/RunnerMyPage.tsx index 923eb8783..5199088c3 100644 --- a/frontend/src/pages/RunnerMyPage.tsx +++ b/frontend/src/pages/RunnerMyPage.tsx @@ -22,7 +22,7 @@ const RunnerMyPage = () => { const { isMobile } = useViewport(); const { showErrorToast } = useContext(ToastContext); - const { goToProfileEditPage, goToLoginPage } = usePageRouter(); + const { goToRunnerProfileEditPage, goToLoginPage } = usePageRouter(); const { data: myPostList, hasNextPage, fetchNextPage } = useMyPostList(true, reviewStatus); const { data: myRunnerProfile } = useMyRunnerProfile(); @@ -60,7 +60,7 @@ const RunnerMyPage = () => { colorTheme="WHITE" fontSize={isMobile ? '12px' : '16px'} fontWeight={400} - onClick={goToProfileEditPage} + onClick={goToRunnerProfileEditPage} > 수정하기 diff --git a/frontend/src/pages/SupporterMyPage.tsx b/frontend/src/pages/SupporterMyPage.tsx index 03895f9c9..555a8eb5e 100644 --- a/frontend/src/pages/SupporterMyPage.tsx +++ b/frontend/src/pages/SupporterMyPage.tsx @@ -22,7 +22,7 @@ const SupporterMyPage = () => { const { isMobile } = useViewport(); const { showErrorToast } = useContext(ToastContext); - const { goToProfileEditPage, goToLoginPage } = usePageRouter(); + const { goToSupporterProfileEditPage, goToLoginPage } = usePageRouter(); const { data: myPostList, hasNextPage, fetchNextPage } = useMyPostList(false, reviewStatus); const { data: mySupporterProfile } = useMySupporterProfile(); @@ -60,7 +60,7 @@ const SupporterMyPage = () => { colorTheme="WHITE" fontSize={isMobile ? '12px' : '16px'} fontWeight={400} - onClick={goToProfileEditPage} + onClick={goToSupporterProfileEditPage} > 수정하기 diff --git a/frontend/src/router.tsx b/frontend/src/router.tsx index 46a24501b..1b4e59ac4 100644 --- a/frontend/src/router.tsx +++ b/frontend/src/router.tsx @@ -28,7 +28,8 @@ export const ROUTER_PATH = { NOT_FOUND: '/*', RUNNER_PROFILE: '/runner-profile/:runnerId', SUPPORTER_PROFILE: '/supporter-profile/:supporterId', - PROFILE_EDIT: '/profile-edit', + RUNNER_PROFILE_EDIT: '/runner-profile-edit', + SUPPORTER_PROFILE_EDIT: '/supporter-profile-edit', SUPPORTER_FEEDBACK: '/supporter-feedback/:runnerPostId/:supporterId', GITHUB_CALLBACK: '/oauth/github/callback', NOTICE: '/notice', @@ -65,8 +66,12 @@ export const router = createBrowserRouter( element: , }, { - path: ROUTER_PATH.PROFILE_EDIT, - element: , + path: ROUTER_PATH.RUNNER_PROFILE_EDIT, + element: , + }, + { + path: ROUTER_PATH.SUPPORTER_PROFILE_EDIT, + element: , }, { path: ROUTER_PATH.GITHUB_CALLBACK, element: }, {