diff --git a/src/App.tsx b/src/App.tsx index 8b636115..16d99b4b 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -19,6 +19,7 @@ import ModifyEvent from 'page/ManageEvent/ModifyEvent'; import LogPage from 'component/common/PageLog'; import CommonLayout from 'page/Auth/components/Common'; import FindPassword from 'page/Auth/FindPassword'; +import ROUTES from 'static/routes'; interface ProtectedRouteProps { userTypeRequired: UserType; @@ -30,10 +31,10 @@ function ProtectedRoute({ userTypeRequired }: ProtectedRouteProps) { if (userType !== userTypeRequired) { if (userType === 'OWNER') { - return ; + return ; } if (userType === null) { - return ; + return ; } } @@ -44,30 +45,30 @@ function App() { return ( }> - } /> + } /> }> - }> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> + }> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> }> }> - } /> + } /> }> - } /> - } /> + } /> + } /> - } /> + } /> diff --git a/src/component/common/Header/MobilePanel/index.tsx b/src/component/common/Header/MobilePanel/index.tsx index f5f8bcdd..63e5e401 100644 --- a/src/component/common/Header/MobilePanel/index.tsx +++ b/src/component/common/Header/MobilePanel/index.tsx @@ -11,6 +11,7 @@ import useMobileSidebar from 'component/common/Header/hooks/useMobileSidebar'; import useUserTypeStore from 'store/useUserTypeStore'; import { CATEGORY_OWNER, HeaderCategory } from 'utils/constant/category'; import useSuspenseUser from 'utils/hooks/useSuspenseUser'; +import ROUTES from 'static/routes'; import styles from './MobilePanel.module.scss'; interface Prop { @@ -63,8 +64,8 @@ export default function MobilePanel() { const handleLogout = () => { logout(undefined, { onSettled: () => { - setPrevPath('/login'); - navigate('/login'); + setPrevPath(ROUTES.Login()); + navigate(ROUTES.Login()); }, }); }; @@ -75,7 +76,7 @@ export default function MobilePanel() { className={styles['mobile-header']} > - {pathname === '/owner' ? ( + {pathname === ROUTES.Owner.Root() ? ( ) : (targetCategory .flatMap((categoryValue) => categoryValue.submenu) @@ -119,7 +120,7 @@ export default function MobilePanel() {
  • - + 내 정보
  • diff --git a/src/component/common/Header/PCPanel/index.tsx b/src/component/common/Header/PCPanel/index.tsx index 9b421d9e..061b355d 100644 --- a/src/component/common/Header/PCPanel/index.tsx +++ b/src/component/common/Header/PCPanel/index.tsx @@ -6,6 +6,7 @@ import { useLogout } from 'query/auth'; import usePrevPathStore from 'store/path'; import useMegaMenu from 'component/common/Header/hooks/useMegaMenu'; import useUserTypeStore from 'store/useUserTypeStore'; +import ROUTES from 'static/routes'; import styles from './PCPanel.module.scss'; const ID: { [key: string]: string; } = { @@ -94,8 +95,8 @@ export default function PCPanel() { const handleLogout = () => { logout(undefined, { onSettled: () => { - setPrevPath('/login'); - navigate('/login'); + setPrevPath(ROUTES.Login()); + navigate(ROUTES.Login()); }, }); }; @@ -104,20 +105,13 @@ export default function PCPanel() { <> -
      - {/* Auth 완료시 수정 필요 */} - {/*
    • - - 정보수정 - -
    • */}
    • - {pathname === '/owner/add-menu' && '메뉴추가'} - {pathname.startsWith('/owner/modify-menu/') && '메뉴수정'} - {pathname.startsWith('/owner/event-add/') && '이벤트/공지 작성하기'} + {pathname === ROUTES.Owner.AddMenu() && '메뉴추가'} + {pathname.startsWith(ROUTES.Owner.ModifyMenu({ isLink: false })) && '메뉴수정'} + {pathname.startsWith(ROUTES.Owner.Event({ isLink: false })) && '이벤트/공지 작성하기'}
      ); diff --git a/src/layout/OwnerLayout/index.tsx b/src/layout/OwnerLayout/index.tsx index 22b2fb8f..e53d85e3 100644 --- a/src/layout/OwnerLayout/index.tsx +++ b/src/layout/OwnerLayout/index.tsx @@ -2,6 +2,7 @@ import ErrorBoundary from 'component/common/ErrorBoundary'; import Header from 'component/common/Header'; import { useEffect } from 'react'; import { Outlet, useLocation, useNavigate } from 'react-router-dom'; +import ROUTES from 'static/routes'; import usePrevPathStore from 'store/path'; import useUserStore from 'store/user'; import useErrorBoundary from 'utils/hooks/useErrorBoundary'; @@ -18,8 +19,8 @@ export default function OwnerLayout() { setUser() .catch(handleErrorBoundary) .catch(() => { - setPrevPath('/owner/shop-registration'); - navigate('/owner/shop-registration'); + setPrevPath(ROUTES.Owner.ShopRegistration()); + navigate(ROUTES.Owner.ShopRegistration()); }); } }, [handleErrorBoundary, setUser, setPrevPath, navigate, user]); @@ -28,7 +29,7 @@ export default function OwnerLayout() {
      {user && ( <> - {location.pathname !== '/owner/shop-registration' &&
      } + {location.pathname !== ROUTES.Owner.ShopRegistration() &&
      } diff --git a/src/page/AddMenu/components/GoMyShop/index.tsx b/src/page/AddMenu/components/GoMyShop/index.tsx index f36a11ee..cee9d1f8 100644 --- a/src/page/AddMenu/components/GoMyShop/index.tsx +++ b/src/page/AddMenu/components/GoMyShop/index.tsx @@ -1,5 +1,6 @@ import { createPortal } from 'react-dom'; import { Link } from 'react-router-dom'; +import ROUTES from 'static/routes'; import styles from './GoMyShopModal.module.scss'; interface CheckModalProps { @@ -30,7 +31,7 @@ export default function GoMyShopModal({ > {mainMessage} {subMessage} - + )} diff --git a/src/page/Auth/SignupTmp/view/CompletePage/index.tsx b/src/page/Auth/SignupTmp/view/CompletePage/index.tsx index ce38903d..5cd1d8fe 100644 --- a/src/page/Auth/SignupTmp/view/CompletePage/index.tsx +++ b/src/page/Auth/SignupTmp/view/CompletePage/index.tsx @@ -1,6 +1,7 @@ import { Link } from 'react-router-dom'; import { ReactComponent as Check } from 'assets/svg/auth/check.svg'; import useStepStore from 'store/useStepStore'; +import ROUTES from 'static/routes'; import styles from './Complete.module.scss'; export default function Complete() { @@ -22,7 +23,7 @@ export default function Complete() { 가입 허가가 승인되면 로그인이 가능합니다.
      - 로그인 화면 바로가기 + 로그인 화면 바로가기 ); } diff --git a/src/page/Auth/SignupTmp/view/TermsOfServicePage/index.tsx b/src/page/Auth/SignupTmp/view/TermsOfServicePage/index.tsx index c13afb80..d62ffdf3 100644 --- a/src/page/Auth/SignupTmp/view/TermsOfServicePage/index.tsx +++ b/src/page/Auth/SignupTmp/view/TermsOfServicePage/index.tsx @@ -4,6 +4,7 @@ import useMediaQuery from 'utils/hooks/useMediaQuery'; import TERMS from 'page/Auth/Signup/constant/terms'; import React, { useEffect, useRef, useState } from 'react'; +import ROUTES from 'static/routes'; import styles from './TermsOfService.module.scss'; type ButtonClickEventProps = { @@ -87,7 +88,7 @@ export default function TermsOfService({ clickEvent, termsRef }:ButtonClickEvent
      {isMobile ? ( <> - 취소 + 취소 ) diff --git a/src/page/Auth/components/Common/index.tsx b/src/page/Auth/components/Common/index.tsx index 1735a45d..a0d485c2 100644 --- a/src/page/Auth/components/Common/index.tsx +++ b/src/page/Auth/components/Common/index.tsx @@ -3,15 +3,14 @@ import { FormProvider, useForm, UseFormSetError } from 'react-hook-form'; import { Outlet, useLocation, useNavigate } from 'react-router-dom'; import cn from 'utils/ts/className'; import { Register, RegisterUser } from 'model/auth'; -// eslint-disable-next-line import { changePassword } from 'api/auth'; import { phoneRegisterUser } from 'api/register'; import { isKoinError, sendClientError } from '@bcsdlab/koin'; import { useStep } from 'page/Auth/hook/useStep'; import sha256 from 'utils/ts/SHA-256'; import { useDebounce } from 'utils/hooks/useDebounce'; -// eslint-disable-next-line -import Done from '../Done/index'; +import ROUTES from 'static/routes'; +import Done from 'page/Auth/components/Done'; import styles from './index.module.scss'; const setNewPassword = async ( @@ -96,7 +95,7 @@ export default function CommonLayout() { const progressPercentage = (index + 1) / totalStep * 100; const stepCheck = async () => { - if (isComplete) navigate('/login'); + if (isComplete) navigate(ROUTES.Login()); if (!errors.root) { if (index + 1 === totalStep && isFindPassword) { setNewPassword(getValues('phone_number'), getValues('password'), setError); diff --git a/src/page/Auth/components/Done/index.tsx b/src/page/Auth/components/Done/index.tsx index 5921c360..b9b2ea8d 100644 --- a/src/page/Auth/components/Done/index.tsx +++ b/src/page/Auth/components/Done/index.tsx @@ -1,5 +1,6 @@ import { ReactComponent as Success } from 'assets/svg/auth/done.svg'; import { useNavigate } from 'react-router-dom'; +import ROUTES from 'static/routes'; import styles from './index.module.scss'; const completeFindPassword = { @@ -36,7 +37,7 @@ export default function Done({ isFindPassword }: Props) {
      diff --git a/src/page/ManageEvent/AddingEvent/index.tsx b/src/page/ManageEvent/AddingEvent/index.tsx index 104f6d81..d1fba3ae 100644 --- a/src/page/ManageEvent/AddingEvent/index.tsx +++ b/src/page/ManageEvent/AddingEvent/index.tsx @@ -15,6 +15,7 @@ import { ReactComponent as PictureDisalbe } from 'assets/svg/common/picture-disa import { createPortal } from 'react-dom'; import AlertModal from 'component/common/Modal/alertModal'; import useLogger from 'utils/hooks/useLogger'; +import ROUTES from 'static/routes'; /* eslint-disable no-await-in-loop */ /* eslint-disable jsx-a11y/label-has-associated-control */ @@ -419,7 +420,7 @@ export default function AddingEvent() { setIsOpen={setIsAlertModalOpen} cancelText="이어쓰기" acceptText="취소하기" - callBack={() => navigate('/')} + callBack={() => navigate(ROUTES.Main())} />, document.body, )} diff --git a/src/page/ManageEvent/ModifyEvent/index.tsx b/src/page/ManageEvent/ModifyEvent/index.tsx index 8c9f5e81..5cc4e9e2 100644 --- a/src/page/ManageEvent/ModifyEvent/index.tsx +++ b/src/page/ManageEvent/ModifyEvent/index.tsx @@ -15,6 +15,7 @@ import { ReactComponent as Cancel } from 'assets/svg/common/cancel.svg'; import { ReactComponent as Picture } from 'assets/svg/common/picture.svg'; import { ReactComponent as PictureDisalbe } from 'assets/svg/common/picture-disable.svg'; import { createPortal } from 'react-dom'; +import ROUTES from 'static/routes'; /* eslint-disable jsx-a11y/label-has-associated-control */ @@ -349,7 +350,7 @@ export default function ModifyEvent() { setIsOpen={setIsAlertModalOpen} cancelText="이어쓰기" acceptText="취소하기" - callBack={() => navigate('/')} + callBack={() => navigate(ROUTES.Main())} />, document.body, )} diff --git a/src/page/ModifyMenu/index.tsx b/src/page/ModifyMenu/index.tsx index 20f056d3..c137e2b8 100644 --- a/src/page/ModifyMenu/index.tsx +++ b/src/page/ModifyMenu/index.tsx @@ -15,6 +15,7 @@ import GoMyShopModal from 'page/AddMenu/components/GoMyShop'; import MobileDivide from 'page/AddMenu/components/MobileDivide'; import useScrollToTop from 'utils/hooks/useScrollToTop'; import useFormValidation from 'page/AddMenu/hook/useFormValidation'; +import ROUTES from 'static/routes'; export default function ModifyMenu() { useScrollToTop(); @@ -26,22 +27,22 @@ export default function ModifyMenu() { setIsComplete((prevState) => !prevState); } }; - const { menuId } = useParams(); + const { id } = useParams(); - assert(menuId != null, 'menuId가 없습니다.'); + assert(id != null, 'menuId가 없습니다.'); const navigate = useNavigate(); - const { menuData, refetch, modifyMenuMutation } = useMenuInfo(Number(menuId)); + const { menuData, refetch, modifyMenuMutation } = useMenuInfo(Number(id)); useEffect(() => { refetch(); }, [refetch]); const goMyShop = () => { - navigate('/owner'); + navigate(ROUTES.Owner.Root()); }; const { deleteMenuMutation } = useDeleteMenu(); const handleMobileDeleteMenu = () => { - deleteMenuMutation(Number(menuId)); + deleteMenuMutation(Number(id)); goMyShop(); }; @@ -116,7 +117,7 @@ export default function ModifyMenu() { }; const handleDeleteMenu = () => { - deleteMenuMutation(Number(menuId)); + deleteMenuMutation(Number(id)); openGoMyShopModal(); }; diff --git a/src/page/MyShopPage/components/CatagoryMenuList/index.tsx b/src/page/MyShopPage/components/CatagoryMenuList/index.tsx index 2470fc89..bbeb2cbc 100644 --- a/src/page/MyShopPage/components/CatagoryMenuList/index.tsx +++ b/src/page/MyShopPage/components/CatagoryMenuList/index.tsx @@ -2,12 +2,13 @@ import { useNavigate } from 'react-router-dom'; import { ReactComponent as EventMarkIcon } from 'assets/svg/myshop/event-menu-mark.svg'; import { MenuCategory } from 'model/shopInfo/menuCategory'; import { ReactComponent as CUTLERY } from 'assets/svg/myshop/cutlery.svg'; +import ROUTES from 'static/routes'; import styles from './CatagoryMenuList.module.scss'; export default function CatagoryMenuList({ menuCategory }: { menuCategory: MenuCategory }) { const navigate = useNavigate(); const handleMenuClick = (menuId: number) => { - navigate(`/owner/modify-menu/${menuId}`); + navigate(ROUTES.Owner.ModifyMenu({ id: String(menuId), isLink: true })); }; return (
      diff --git a/src/page/MyShopPage/components/EventTable/index.tsx b/src/page/MyShopPage/components/EventTable/index.tsx index d5aae898..5ec8b9a5 100644 --- a/src/page/MyShopPage/components/EventTable/index.tsx +++ b/src/page/MyShopPage/components/EventTable/index.tsx @@ -12,6 +12,7 @@ import { ReactComponent as Check } from 'assets/svg/myshop/check.svg'; import { ReactComponent as CompleteIcon } from 'assets/svg/myshop/complete-icon.svg'; import DeleteAlertModal from 'component/common/Modal/alertModal'; import useLogger from 'utils/hooks/useLogger'; +import ROUTES from 'static/routes'; import EventCard from './components/EventCard'; import EventErrorModal from './components/EventErrorModal'; import styles from './EventTable.module.scss'; @@ -73,7 +74,10 @@ export default function EventTable() { const selected = eventList?.events.filter( (event) => event.event_id === selectedEventIds[0], )[0]; - navigate(`/owner/event-modify/${selectedEventIds[0]}`, { + navigate(ROUTES.Owner.EventModify({ + id: String(selectedEventIds[0]), + isLink: true, + }), { state: { content: selected?.content, event_id: selected?.event_id, @@ -124,7 +128,7 @@ export default function EventTable() { type="button" className={styles['manage-event-button']} onClick={() => { - navigate(`/owner/event-add/${shopData?.id}`); + navigate(ROUTES.Owner.Event({ id: String(shopData?.id), isLink: true })); logger.actionEventClick({ actionTitle: 'OWNER', title: 'add_event', value: '이벤트 추가' }); }} > diff --git a/src/page/MyShopPage/components/MenuTable/index.tsx b/src/page/MyShopPage/components/MenuTable/index.tsx index 1a276eec..a3327747 100644 --- a/src/page/MyShopPage/components/MenuTable/index.tsx +++ b/src/page/MyShopPage/components/MenuTable/index.tsx @@ -3,6 +3,7 @@ import { MenuCategory } from 'model/shopInfo/menuCategory'; import cn from 'utils/ts/className'; import MENU_CATEGORY from 'utils/constant/menu'; import { Link } from 'react-router-dom'; +import ROUTES from 'static/routes'; import styles from './MenuTable.module.scss'; interface MenuTableProps { @@ -117,7 +118,7 @@ function MenuTable({ shopMenuCategories, onClickImage }: MenuTableProps) { />
      )} - +
      {menu.name} @@ -151,7 +152,7 @@ function MenuTable({ shopMenuCategories, onClickImage }: MenuTableProps) { />
      )} - +
      {`${menu.name} - ${item.option}`} diff --git a/src/page/MyShopPage/components/MyShopList/MyShopList.tsx b/src/page/MyShopPage/components/MyShopList/MyShopList.tsx index d053d8a6..82c5e95a 100644 --- a/src/page/MyShopPage/components/MyShopList/MyShopList.tsx +++ b/src/page/MyShopPage/components/MyShopList/MyShopList.tsx @@ -3,6 +3,7 @@ import CustomModal from 'component/common/CustomModal'; import useMyShop from 'query/shop'; import { Suspense } from 'react'; import { useNavigate } from 'react-router-dom'; +import ROUTES from 'static/routes'; import styles from './MyShopList.module.scss'; const useSelectMyShop = () => { @@ -13,7 +14,7 @@ const useSelectMyShop = () => { const selectShop = (myShopId: number) => { queryClient.invalidateQueries({ queryKey: ['myShop', myShopId] }); localStorage.setItem('myShopId', String(myShopId)); - navigate('/'); + navigate(ROUTES.Main()); }; return { myShop, selectShop }; diff --git a/src/page/MyShopPage/index.tsx b/src/page/MyShopPage/index.tsx index 8aa0fc06..c23058dc 100644 --- a/src/page/MyShopPage/index.tsx +++ b/src/page/MyShopPage/index.tsx @@ -10,6 +10,7 @@ import useModalPortal from 'utils/hooks/useModalPortal'; import showToast from 'utils/ts/showToast'; import ImageModal from 'component/common/Modal/ImageModal'; import useLogger from 'utils/hooks/useLogger'; +import ROUTES from 'static/routes'; import CatagoryMenuList from './components/CatagoryMenuList'; import ShopInfo from './components/ShopInfo'; import styles from './MyShopPage.module.scss'; @@ -52,7 +53,7 @@ export default function MyShopPage() { useEffect(() => { if (!shopData && !isLoading) { - navigate('/owner/shop-registration'); + navigate(ROUTES.Owner.ShopRegistration()); } }, [shopData, navigate, isLoading]); @@ -80,7 +81,7 @@ export default function MyShopPage() { {isMobile ? ( <>
      - 가게 추가 + 가게 추가 {myShop.shops.length >= 2 && ( <> @@ -88,7 +89,7 @@ export default function MyShopPage() { {listOpen && } )} - +