From ba69eca3a67fec9b5af9d04814f2353fe129972f Mon Sep 17 00:00:00 2001 From: sashtje Date: Tue, 26 Sep 2023 20:07:44 +0300 Subject: [PATCH] refactor: refactor router config --- .../providers/router/config}/index.ts | 0 .../providers/router/config}/routerConfig.tsx | 32 ++----------------- .../providers/router/config}/types.ts | 0 src/app/providers/router/ui/AppRouter.tsx | 2 +- src/app/providers/router/ui/RequireAuth.tsx | 3 +- .../ui/ArticleListItem/ArticleListItem.tsx | 2 +- .../Comment/ui/CommentItem/CommentItem.tsx | 2 +- .../ui/CountrySelect/CountrySelect.tsx | 2 +- .../ui/CurrencySelect/CurrencySelect.tsx | 2 +- .../Profile/ui/ProfileCard/ProfileCard.tsx | 2 +- .../ui/AvatarDropdown/AvatarDropdown.tsx | 2 +- .../EditableProfileCard.tsx | 2 +- .../EditableProfileCardHeader.tsx | 2 +- src/index.tsx | 2 ++ .../ArticleDetailsPageHeader.tsx | 2 +- src/pages/ProfilePage/ui/ProfilePage.tsx | 2 +- src/shared/const/router.ts | 29 +++++++++++++++++ src/widgets/Navbar/ui/Navbar.tsx | 2 +- .../model/selectors/getSidebarItems.ts | 2 +- src/widgets/Sidebar/model/types/sidebar.ts | 2 +- 20 files changed, 49 insertions(+), 45 deletions(-) rename src/{shared/config/routerConfig => app/providers/router/config}/index.ts (100%) rename src/{shared/config/routerConfig => app/providers/router/config}/routerConfig.tsx (70%) rename src/{shared/config/routerConfig => app/providers/router/config}/types.ts (100%) create mode 100644 src/shared/const/router.ts diff --git a/src/shared/config/routerConfig/index.ts b/src/app/providers/router/config/index.ts similarity index 100% rename from src/shared/config/routerConfig/index.ts rename to src/app/providers/router/config/index.ts diff --git a/src/shared/config/routerConfig/routerConfig.tsx b/src/app/providers/router/config/routerConfig.tsx similarity index 70% rename from src/shared/config/routerConfig/routerConfig.tsx rename to src/app/providers/router/config/routerConfig.tsx index 53619c09..f386b0fb 100644 --- a/src/shared/config/routerConfig/routerConfig.tsx +++ b/src/app/providers/router/config/routerConfig.tsx @@ -9,37 +9,9 @@ import { AdminPanelPage } from '@/pages/AdminPanelPage'; import { ForbiddenPage } from '@/pages/ForbiddenPage'; import { UserRole } from '@/entities/User'; -import { AppRoutesProps } from './types'; - -export enum AppRoutes { - MAIN = 'main', - ABOUT = 'about', - PROFILE = 'profile', - ARTICLES = 'articles', - ARTICLE_DETAILS = 'article_details', - ARTICLE_CREATE = 'article_create', - ARTICLE_EDIT = 'article_edit', - ADMIN_PANEL = 'admin_panel', - FORBIDDEN = 'forbidden', - - // last - NOT_FOUND = 'not_found', -} - -export const RoutePath: Record = { - [AppRoutes.MAIN]: '/', - [AppRoutes.ABOUT]: '/about', - [AppRoutes.PROFILE]: '/profile/', // + :id - [AppRoutes.ARTICLES]: '/articles', - [AppRoutes.ARTICLE_DETAILS]: '/articles/', // + :id - [AppRoutes.ARTICLE_CREATE]: '/articles/create', - [AppRoutes.ARTICLE_EDIT]: '/articles/:id/edit', - [AppRoutes.ADMIN_PANEL]: '/admin_panel', - [AppRoutes.FORBIDDEN]: '/forbidden', +import { AppRoutes, RoutePath } from '@/shared/const/router'; - // last - [AppRoutes.NOT_FOUND]: '*', -}; +import { AppRoutesProps } from './types'; export const routerConfig: Record = { [AppRoutes.MAIN]: { diff --git a/src/shared/config/routerConfig/types.ts b/src/app/providers/router/config/types.ts similarity index 100% rename from src/shared/config/routerConfig/types.ts rename to src/app/providers/router/config/types.ts diff --git a/src/app/providers/router/ui/AppRouter.tsx b/src/app/providers/router/ui/AppRouter.tsx index 9ba8507a..366167e0 100644 --- a/src/app/providers/router/ui/AppRouter.tsx +++ b/src/app/providers/router/ui/AppRouter.tsx @@ -2,8 +2,8 @@ import React, { memo, Suspense, useCallback } from 'react'; import { Route, Routes } from 'react-router-dom'; import { PageLoader } from '@/widgets/PageLoader'; -import { routerConfig, AppRoutesProps } from '@/shared/config/routerConfig'; +import { routerConfig, AppRoutesProps } from '../config'; import { RequireAuth } from './RequireAuth'; export const AppRouter = memo(() => { diff --git a/src/app/providers/router/ui/RequireAuth.tsx b/src/app/providers/router/ui/RequireAuth.tsx index d9b42a61..c8fdea86 100644 --- a/src/app/providers/router/ui/RequireAuth.tsx +++ b/src/app/providers/router/ui/RequireAuth.tsx @@ -3,7 +3,8 @@ import { useSelector } from 'react-redux'; import { Navigate, useLocation } from 'react-router-dom'; import { getUserAuthData, getUserRoles, UserRole } from '@/entities/User'; -import { AppRoutes, RoutePath } from '@/shared/config/routerConfig/routerConfig'; + +import { AppRoutes, RoutePath } from '@/shared/const/router'; interface RequireAuthProps { children: ReactNode; diff --git a/src/entities/Article/ui/ArticleListItem/ArticleListItem.tsx b/src/entities/Article/ui/ArticleListItem/ArticleListItem.tsx index eb4917d9..1ccffe22 100644 --- a/src/entities/Article/ui/ArticleListItem/ArticleListItem.tsx +++ b/src/entities/Article/ui/ArticleListItem/ArticleListItem.tsx @@ -9,7 +9,6 @@ import { Button } from '@/shared/ui/Button'; import { Icon } from '@/shared/ui/Icon'; import EyeIcon from '@/shared/assets/icons/eye-20-20.svg'; import { AppLink } from '@/shared/ui/AppLink'; -import { RoutePath } from '@/shared/config/routerConfig/routerConfig'; import { ArticleBlockType, ArticleView } from '../../model/consts/consts'; import { @@ -17,6 +16,7 @@ import { } from '../../model/types/article'; import cls from './ArticleListItem.module.scss'; import { ArticleTextBlockComponent } from '../../ui/ArticleTextBlockComponent/ArticleTextBlockComponent'; +import { RoutePath } from '@/shared/const/router'; interface ArticleListItemProps { className?: string; diff --git a/src/entities/Comment/ui/CommentItem/CommentItem.tsx b/src/entities/Comment/ui/CommentItem/CommentItem.tsx index 717d3dc9..fe084ac0 100644 --- a/src/entities/Comment/ui/CommentItem/CommentItem.tsx +++ b/src/entities/Comment/ui/CommentItem/CommentItem.tsx @@ -6,11 +6,11 @@ import { Avatar } from '@/shared/ui/Avatar'; import { Text } from '@/shared/ui/Text'; import { Skeleton } from '@/shared/ui/Skeleton'; import { AppLink } from '@/shared/ui/AppLink'; -import { AppRoutes, RoutePath } from '@/shared/config/routerConfig/routerConfig'; import { VStack } from '@/shared/ui/Stack'; import cls from './CommentItem.module.scss'; import { Comment } from '../../model/types/comment'; +import { AppRoutes, RoutePath } from '@/shared/const/router'; interface CommentItemProps { className?: string; diff --git a/src/entities/Country/ui/CountrySelect/CountrySelect.tsx b/src/entities/Country/ui/CountrySelect/CountrySelect.tsx index 5c34a175..5d549546 100644 --- a/src/entities/Country/ui/CountrySelect/CountrySelect.tsx +++ b/src/entities/Country/ui/CountrySelect/CountrySelect.tsx @@ -2,10 +2,10 @@ import { useCallback, useMemo, memo } from 'react'; import { useTranslation } from 'react-i18next'; import { classNames } from '@/shared/lib/classNames'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; import { ListBox } from '@/shared/ui/Popups/ui/ListBox'; import { Country } from '../../model/types/country'; +import { AppRoutes } from '@/shared/const/router'; interface CountrySelectProps { className?: string; diff --git a/src/entities/Currency/ui/CurrencySelect/CurrencySelect.tsx b/src/entities/Currency/ui/CurrencySelect/CurrencySelect.tsx index 54557946..0179be36 100644 --- a/src/entities/Currency/ui/CurrencySelect/CurrencySelect.tsx +++ b/src/entities/Currency/ui/CurrencySelect/CurrencySelect.tsx @@ -2,10 +2,10 @@ import { useCallback, useMemo, memo } from 'react'; import { useTranslation } from 'react-i18next'; import { classNames } from '@/shared/lib/classNames'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; import { ListBox } from '@/shared/ui/Popups/ui/ListBox'; import { Currency } from '../../model/types/currency'; +import { AppRoutes } from '@/shared/const/router'; interface CurrencySelectProps { className?: string; diff --git a/src/entities/Profile/ui/ProfileCard/ProfileCard.tsx b/src/entities/Profile/ui/ProfileCard/ProfileCard.tsx index 3caf0b03..0102576d 100644 --- a/src/entities/Profile/ui/ProfileCard/ProfileCard.tsx +++ b/src/entities/Profile/ui/ProfileCard/ProfileCard.tsx @@ -1,7 +1,6 @@ import { useTranslation } from 'react-i18next'; import { classNames, Mods } from '@/shared/lib/classNames'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; import { Text, TextTheme, TextAlign } from '@/shared/ui/Text'; import { Input } from '@/shared/ui/Input'; import { Loader } from '@/shared/ui/Loader'; @@ -12,6 +11,7 @@ import { HStack, VStack } from '@/shared/ui/Stack'; import { Profile } from '../../model/types/profile'; import cls from './ProfileCard.module.scss'; +import { AppRoutes } from '@/shared/const/router'; interface ProfileCardProps { className?: string; diff --git a/src/features/avatarDropdown/ui/AvatarDropdown/AvatarDropdown.tsx b/src/features/avatarDropdown/ui/AvatarDropdown/AvatarDropdown.tsx index 17999ef3..44786121 100644 --- a/src/features/avatarDropdown/ui/AvatarDropdown/AvatarDropdown.tsx +++ b/src/features/avatarDropdown/ui/AvatarDropdown/AvatarDropdown.tsx @@ -3,12 +3,12 @@ import { useDispatch, useSelector } from 'react-redux'; import { useTranslation } from 'react-i18next'; import { classNames } from '@/shared/lib/classNames'; -import { RoutePath } from '@/shared/config/routerConfig/routerConfig'; import { Avatar } from '@/shared/ui/Avatar'; import { Dropdown } from '@/shared/ui/Popups'; import { getUserAuthData, isUserAdmin, isUserManager, userActions, } from '@/entities/User'; +import { RoutePath } from '@/shared/const/router'; interface AvatarDropdownProps { className?: string; diff --git a/src/features/editableProfileCard/ui/EditableProfileCard/EditableProfileCard.tsx b/src/features/editableProfileCard/ui/EditableProfileCard/EditableProfileCard.tsx index 693dc66c..0f42a6fe 100644 --- a/src/features/editableProfileCard/ui/EditableProfileCard/EditableProfileCard.tsx +++ b/src/features/editableProfileCard/ui/EditableProfileCard/EditableProfileCard.tsx @@ -7,7 +7,6 @@ import { useAppDispatch } from '@/shared/lib/hooks/useAppDispatch/useAppDispatch import { useInitialEffect } from '@/shared/lib/hooks/useInitialEffect/useInitialEffect'; import { Currency } from '@/entities/Currency'; import { Country } from '@/entities/Country'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; import { Text, TextTheme } from '@/shared/ui/Text'; import { ProfileCard } from '@/entities/Profile'; import { DynamicModuleLoader, ReducersList } from '@/shared/lib/components/DynamicModuleLoader/DynamicModuleLoader'; @@ -24,6 +23,7 @@ import { getProfileReadonly, getProfileValidateErrors, } from '../../model/selectors'; +import { AppRoutes } from '@/shared/const/router'; interface EditableProfileCardProps { className?: string; diff --git a/src/features/editableProfileCard/ui/EditableProfileCardHeader/EditableProfileCardHeader.tsx b/src/features/editableProfileCard/ui/EditableProfileCardHeader/EditableProfileCardHeader.tsx index 194aa67a..925caff3 100644 --- a/src/features/editableProfileCard/ui/EditableProfileCardHeader/EditableProfileCardHeader.tsx +++ b/src/features/editableProfileCard/ui/EditableProfileCardHeader/EditableProfileCardHeader.tsx @@ -4,7 +4,6 @@ import { useTranslation } from 'react-i18next'; import { classNames } from '@/shared/lib/classNames'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; import { useAppDispatch } from '@/shared/lib/hooks/useAppDispatch/useAppDispatch'; import { getUserAuthData } from '@/entities/User'; import { HStack } from '@/shared/ui/Stack'; @@ -17,6 +16,7 @@ import { updateProfileData } from '../../model/services/updateProfileData/update import { getProfileData, getProfileReadonly, } from '../../model/selectors'; +import { AppRoutes } from '@/shared/const/router'; interface EditableProfileCardHeaderProps { className?: string; diff --git a/src/index.tsx b/src/index.tsx index 669b9f93..a831546a 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -27,3 +27,5 @@ root.render( , ); +export { RoutePath } from '@/shared/const/router'; +export { AppRoutes } from '@/shared/const/router'; diff --git a/src/pages/ArticleDetailsPage/ui/ArticleDetailsPageHeader/ArticleDetailsPageHeader.tsx b/src/pages/ArticleDetailsPage/ui/ArticleDetailsPageHeader/ArticleDetailsPageHeader.tsx index a44d5d53..c1615d00 100644 --- a/src/pages/ArticleDetailsPage/ui/ArticleDetailsPageHeader/ArticleDetailsPageHeader.tsx +++ b/src/pages/ArticleDetailsPage/ui/ArticleDetailsPageHeader/ArticleDetailsPageHeader.tsx @@ -5,11 +5,11 @@ import { useNavigate } from 'react-router-dom'; import { Button } from '@/shared/ui'; import { classNames } from '@/shared/lib/classNames'; -import { AppRoutes, RoutePath } from '@/shared/config/routerConfig/routerConfig'; import { getArticleDetails } from '@/entities/Article'; import { HStack } from '@/shared/ui/Stack'; import { getCanEditArticle } from '../../model/selectors/article'; +import { AppRoutes, RoutePath } from '@/shared/const/router'; interface ArticleDetailsPageHeaderProps { className?: string; diff --git a/src/pages/ProfilePage/ui/ProfilePage.tsx b/src/pages/ProfilePage/ui/ProfilePage.tsx index f96b319e..7ec1269a 100644 --- a/src/pages/ProfilePage/ui/ProfilePage.tsx +++ b/src/pages/ProfilePage/ui/ProfilePage.tsx @@ -6,7 +6,7 @@ import { Text } from '@/shared/ui/Text'; import { Page } from '@/widgets/Page'; import { VStack } from '@/shared/ui/Stack'; import { EditableProfileCard } from '@/features/editableProfileCard'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; +import { AppRoutes } from '@/shared/const/router'; interface ProfilePageProps { className?: string; diff --git a/src/shared/const/router.ts b/src/shared/const/router.ts new file mode 100644 index 00000000..892d1c77 --- /dev/null +++ b/src/shared/const/router.ts @@ -0,0 +1,29 @@ +export enum AppRoutes { + MAIN = 'main', + ABOUT = 'about', + PROFILE = 'profile', + ARTICLES = 'articles', + ARTICLE_DETAILS = 'article_details', + ARTICLE_CREATE = 'article_create', + ARTICLE_EDIT = 'article_edit', + ADMIN_PANEL = 'admin_panel', + FORBIDDEN = 'forbidden', + + // last + NOT_FOUND = 'not_found', +} + +export const RoutePath: Record = { + [AppRoutes.MAIN]: '/', + [AppRoutes.ABOUT]: '/about', + [AppRoutes.PROFILE]: '/profile/', // + :id + [AppRoutes.ARTICLES]: '/articles', + [AppRoutes.ARTICLE_DETAILS]: '/articles/', // + :id + [AppRoutes.ARTICLE_CREATE]: '/articles/create', + [AppRoutes.ARTICLE_EDIT]: '/articles/:id/edit', + [AppRoutes.ADMIN_PANEL]: '/admin_panel', + [AppRoutes.FORBIDDEN]: '/forbidden', + + // last + [AppRoutes.NOT_FOUND]: '*', +}; diff --git a/src/widgets/Navbar/ui/Navbar.tsx b/src/widgets/Navbar/ui/Navbar.tsx index e04b250e..80179aa1 100644 --- a/src/widgets/Navbar/ui/Navbar.tsx +++ b/src/widgets/Navbar/ui/Navbar.tsx @@ -8,13 +8,13 @@ import { Text, TextTheme } from '@/shared/ui/Text'; import { ButtonTheme } from '@/shared/ui/Button/ui/Button'; import { LoginModal } from '@/features/authByUsername'; import { getUserAuthData } from '@/entities/User'; -import { AppRoutes, RoutePath } from '@/shared/config/routerConfig/routerConfig'; import { AppLinkTheme } from '@/shared/ui/AppLink/ui/AppLink'; import { HStack } from '@/shared/ui/Stack'; import { NotificationButton } from '@/features/notificationButton'; import { AvatarDropdown } from '@/features/avatarDropdown'; import cls from './Navbar.module.scss'; +import { AppRoutes, RoutePath } from '@/shared/const/router'; interface NavbarProps { className?: string; diff --git a/src/widgets/Sidebar/model/selectors/getSidebarItems.ts b/src/widgets/Sidebar/model/selectors/getSidebarItems.ts index c334ed2d..92526317 100644 --- a/src/widgets/Sidebar/model/selectors/getSidebarItems.ts +++ b/src/widgets/Sidebar/model/selectors/getSidebarItems.ts @@ -1,13 +1,13 @@ import { createSelector } from '@reduxjs/toolkit'; import { getUserAuthData } from '@/entities/User'; -import { AppRoutes, RoutePath } from '@/shared/config/routerConfig/routerConfig'; import MainIcon from '@/shared/assets/icons/main-20-20.svg'; import AboutIcon from '@/shared/assets/icons/about-20-20.svg'; import ProfileIcon from '@/shared/assets/icons/profile-20-20.svg'; import ArticlesIcon from '@/shared/assets/icons/article-20-20.svg'; import { SidebarItemType } from '../types/sidebar'; +import { AppRoutes, RoutePath } from '@/shared/const/router'; export const getSidebarItems = createSelector( getUserAuthData, diff --git a/src/widgets/Sidebar/model/types/sidebar.ts b/src/widgets/Sidebar/model/types/sidebar.ts index 5743f229..f94dfeee 100644 --- a/src/widgets/Sidebar/model/types/sidebar.ts +++ b/src/widgets/Sidebar/model/types/sidebar.ts @@ -1,6 +1,6 @@ import { SVGProps, VFC } from 'react'; -import { AppRoutes } from '@/shared/config/routerConfig/routerConfig'; +import { AppRoutes } from '@/shared/const/router'; export interface SidebarItemType { path: string;