diff --git a/.changeset/dry-doors-fly.md b/.changeset/dry-doors-fly.md new file mode 100644 index 00000000..30fa518c --- /dev/null +++ b/.changeset/dry-doors-fly.md @@ -0,0 +1,5 @@ +--- +"@clab-platforms/member": patch +--- + +refactor(member): 라우팅 파일 프로젝트 구조 변경 diff --git a/apps/member/src/App.tsx b/apps/member/src/App.tsx index 5361c5aa..e8bb5f09 100644 --- a/apps/member/src/App.tsx +++ b/apps/member/src/App.tsx @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import { server } from '@api/server'; import { useToken } from '@hooks/common/useToken'; -import AppRouter from '@router/AppRouter'; +import { Routes } from '@pages/Routes'; import { useSetIsLoggedInStore } from '@store/auth'; import { authorization } from '@utils/api'; @@ -25,7 +25,7 @@ const App = () => { return null; } - return ; + return ; }; export default App; diff --git a/apps/member/src/main.tsx b/apps/member/src/main.tsx index 380407e2..9a9ca508 100644 --- a/apps/member/src/main.tsx +++ b/apps/member/src/main.tsx @@ -16,7 +16,6 @@ import { API_BASE_URL } from '@constants/api.ts'; import { CHANNEL_TALK_TOKEN, ENVIRONMENT_MODE, - IS_DEVELOPMENT, IS_PRODUCTION, SENTRY_DSN, } from '@constants/environment.ts'; @@ -59,7 +58,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render( - {IS_DEVELOPMENT && } + , ); diff --git a/apps/member/src/pages/ErrorPage/ErrorPage.tsx b/apps/member/src/pages/GlobalErrorPage/index.tsx similarity index 95% rename from apps/member/src/pages/ErrorPage/ErrorPage.tsx rename to apps/member/src/pages/GlobalErrorPage/index.tsx index 14f04fe4..42a1d80c 100644 --- a/apps/member/src/pages/ErrorPage/ErrorPage.tsx +++ b/apps/member/src/pages/GlobalErrorPage/index.tsx @@ -10,10 +10,10 @@ import ProtectAuth from '@components/router/ProtectAuth'; import { IS_DEVELOPMENT } from '@constants/environment'; import { PATH } from '@constants/path'; -const ErrorPage = () => { +export function GlobalErrorPage() { const error = useRouteError(); let errorStatus: number | undefined = undefined; - let errorMessage: string = 'Unknown error'; + let errorMessage: string = 'Unknown Error'; if (isRouteErrorResponse(error)) { errorStatus = error.status; @@ -27,7 +27,7 @@ const ErrorPage = () => { return ( - + {IS_DEVELOPMENT && ( Development Error Message: @@ -61,10 +61,8 @@ const ErrorPage = () => { - + ); -}; - -export default ErrorPage; +} diff --git a/apps/member/src/router/AppLayout.tsx b/apps/member/src/pages/PageLayout.tsx similarity index 53% rename from apps/member/src/router/AppLayout.tsx rename to apps/member/src/pages/PageLayout.tsx index 99526171..0e647079 100644 --- a/apps/member/src/router/AppLayout.tsx +++ b/apps/member/src/pages/PageLayout.tsx @@ -7,35 +7,27 @@ import TextBanner from '@components/common/TextBanner/TextBanner'; import PanelAside from '@components/panels/PanelAside/PanelAside'; import ProtectAuth from '@components/router/ProtectAuth'; -const View = () => { +export function PageLayout() { const banner = true; - return ( - - {banner && ( - - )} - - - - - - ); -}; - -const AppLayout = () => { return ( - + + {banner && ( + + )} + + + + + ); -}; - -export default AppLayout; +} diff --git a/apps/member/src/pages/Routes.tsx b/apps/member/src/pages/Routes.tsx new file mode 100644 index 00000000..3dc5634d --- /dev/null +++ b/apps/member/src/pages/Routes.tsx @@ -0,0 +1,232 @@ +import { Suspense, lazy } from 'react'; +import { RouterProvider, createBrowserRouter } from 'react-router-dom'; + +import { SectionSkeleton } from '@components/common/Section'; +import ProtectAuth from '@components/router/ProtectAuth'; + +import { PATH } from '@constants/path'; +import MainPage from '@pages/MainPage/MainPage'; + +import { GlobalErrorPage } from './GlobalErrorPage'; +import { PageLayout } from './PageLayout'; + +const CommunityPage = lazy(() => import('@pages/CommunityPage/CommunityPage')); +const CommunityPostPage = lazy( + () => import('@pages/CommunityPostPage/CommunityPostPage'), +); +const CommunityDetailPage = lazy( + () => import('@pages/CommunityDetailPage/CommunityDetailPage'), +); +const CommunityWritePage = lazy( + () => import('@pages/CommunityWritePage/CommunityWritePage'), +); +const GroupPage = lazy(() => import('@pages/GroupPage/GroupPage')); +const GroupApplyPage = lazy( + () => import('@pages/GroupApplyPage/GroupApplyPage'), +); +const GroupDetailPage = lazy( + () => import('@pages/GroupDetailPage/GroupDetailPage'), +); +const GroupAssignmentPage = lazy( + () => import('@pages/GroupAssignmentPage/GroupAssignmentPage'), +); +const GroupConfigPage = lazy( + () => import('@pages/GroupConfigPage/GroupConfigPage'), +); +const GroupCreatePage = lazy( + () => import('@pages/GroupCreatePage/GroupCreatePage'), +); +const LibraryPage = lazy(() => import('@pages/LibraryPage/LibraryPage')); +const LibraryDetailPage = lazy( + () => import('@pages/LibraryDetailPage/LibraryDetailPage'), +); +const MyPage = lazy(() => import('@pages/MyPage/MyPage')); +const CalendarPage = lazy(() => import('@pages/CalendarPage/CalendarPage')); +const SupportPage = lazy(() => import('@pages/SupportPage/SupportPage')); +const LoginPage = lazy(() => import('@pages/LoginPage/LoginPage')); +const AuthPage = lazy(() => import('@pages/AuthPage/AuthPage')); +const BlogPage = lazy(() => import('@pages/BlogPage/BlogPage')); +const ManagePage = lazy(() => import('@pages/ManagePage/ManagePage')); +const ApplicationPage = lazy( + () => import('@pages/ApplicationPage/ApplicationPage'), +); + +const router = createBrowserRouter([ + { + path: PATH.MAIN, + element: , + errorElement: , + children: [ + { + path: PATH.MAIN, + element: ( + }> + + + ), + }, + { + path: PATH.COMMUNITY, + element: ( + }> + + + ), + }, + { + path: PATH.COMMUNITY_POST, + element: ( + + + + ), + }, + { + path: PATH.COMMUNITY_DETAIL, + element: ( + + + + ), + }, + { + path: PATH.COMMUNITY_WRITE, + element: ( + + + + ), + }, + { + path: PATH.BLOG_DETAIL, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY_APPLY, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY_DETAIL, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY_CONFIG, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY_ASSIGNMENT, + element: ( + + + + ), + }, + { + path: PATH.ACTIVITY_CREATE, + element: ( + + + + ), + }, + { + path: PATH.LIBRARY, + element: ( + + + + ), + }, + { + path: PATH.LIBRARY_DETAIL, + element: ( + + + + ), + }, + { + path: PATH.MY, + element: ( + + + + ), + }, + { + path: PATH.CALENDER, + element: ( + + + + ), + }, + { + path: PATH.SUPPORT, + element: ( + + + + ), + }, + { + path: PATH.MANAGE, + element: ( + + + + ), + }, + { + path: PATH.APPLICATION, + element: ( + + + + ), + }, + ], + }, + { + path: PATH.MAIN, + element: , + children: [ + { + path: PATH.LOGIN, + element: , + }, + { + path: PATH.AUTH, + element: , + }, + ], + }, +]); + +export function Routes() { + return ; +} diff --git a/apps/member/src/router/AppRouter.tsx b/apps/member/src/router/AppRouter.tsx deleted file mode 100644 index 0660f1f5..00000000 --- a/apps/member/src/router/AppRouter.tsx +++ /dev/null @@ -1,235 +0,0 @@ -import { Suspense, lazy } from 'react'; -import { RouterProvider, createBrowserRouter } from 'react-router-dom'; - -import { SectionSkeleton } from '@components/common/Section'; -import ProtectAuth from '@components/router/ProtectAuth'; - -import { PATH } from '@constants/path'; -import ErrorPage from '@pages/ErrorPage/ErrorPage'; -import MyPageSkeleton from '@pages/MyPage/MyPageSkeleton'; - -import AppLayout from './AppLayout'; - -const MainPage = lazy(() => import('@pages/MainPage/MainPage')); -const CommunityPage = lazy(() => import('@pages/CommunityPage/CommunityPage')); -const CommunityPostPage = lazy( - () => import('@pages/CommunityPostPage/CommunityPostPage'), -); -const CommunityDetailPage = lazy( - () => import('@pages/CommunityDetailPage/CommunityDetailPage'), -); -const CommunityWritePage = lazy( - () => import('@pages/CommunityWritePage/CommunityWritePage'), -); -const GroupPage = lazy(() => import('@pages/GroupPage/GroupPage')); -const GroupApplyPage = lazy( - () => import('@pages/GroupApplyPage/GroupApplyPage'), -); -const GroupDetailPage = lazy( - () => import('@pages/GroupDetailPage/GroupDetailPage'), -); -const GroupAssignmentPage = lazy( - () => import('@pages/GroupAssignmentPage/GroupAssignmentPage'), -); -const GroupConfigPage = lazy( - () => import('@pages/GroupConfigPage/GroupConfigPage'), -); -const GroupCreatePage = lazy( - () => import('@pages/GroupCreatePage/GroupCreatePage'), -); -const LibraryPage = lazy(() => import('@pages/LibraryPage/LibraryPage')); -const LibraryDetailPage = lazy( - () => import('@pages/LibraryDetailPage/LibraryDetailPage'), -); -const MyPage = lazy(() => import('@pages/MyPage/MyPage')); -const CalendarPage = lazy(() => import('@pages/CalendarPage/CalendarPage')); -const SupportPage = lazy(() => import('@pages/SupportPage/SupportPage')); -const LoginPage = lazy(() => import('@pages/LoginPage/LoginPage')); -const AuthPage = lazy(() => import('@pages/AuthPage/AuthPage')); -const BlogPage = lazy(() => import('@pages/BlogPage/BlogPage')); -const ManagePage = lazy(() => import('@pages/ManagePage/ManagePage')); -const ApplicationPage = lazy( - () => import('@pages/ApplicationPage/ApplicationPage'), -); - -const AppRouter = () => { - const router = createBrowserRouter([ - { - path: PATH.MAIN, - element: , - errorElement: , - children: [ - { - path: PATH.MAIN, - element: ( - }> - - - ), - }, - { - path: PATH.COMMUNITY, - element: ( - }> - - - ), - }, - { - path: PATH.COMMUNITY_POST, - element: ( - - - - ), - }, - { - path: PATH.COMMUNITY_DETAIL, - element: ( - - - - ), - }, - { - path: PATH.COMMUNITY_WRITE, - element: ( - - - - ), - }, - { - path: PATH.BLOG_DETAIL, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY_APPLY, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY_DETAIL, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY_CONFIG, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY_ASSIGNMENT, - element: ( - - - - ), - }, - { - path: PATH.ACTIVITY_CREATE, - element: ( - - - - ), - }, - { - path: PATH.LIBRARY, - element: ( - - - - ), - }, - { - path: PATH.LIBRARY_DETAIL, - element: ( - - - - ), - }, - { - path: PATH.MY, - element: ( - }> - - - ), - }, - { - path: PATH.CALENDER, - element: ( - - - - ), - }, - { - path: PATH.SUPPORT, - element: ( - - - - ), - }, - { - path: PATH.MANAGE, - element: ( - - - - ), - }, - { - path: PATH.APPLICATION, - element: ( - - - - ), - }, - ], - }, - { - path: PATH.MAIN, - element: , - children: [ - { - path: PATH.LOGIN, - element: , - }, - { - path: PATH.AUTH, - element: , - }, - ], - }, - ]); - - return ; -}; - -export default AppRouter;
Development Error Message: