refactor: refactor router config

src/shared/config/routerConfig/routerConfig.tsx → 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, string> = {
-  [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, AppRoutesProps> = {
   [AppRoutes.MAIN]: {

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(() => {

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;

src/entities/Article/ui/ArticleListItem/ArticleListItem.tsx

@@ -9,14 +9,14 @@ 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 {
   Article, ArticleTextBlock,
 } 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;

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;

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;

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;

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;

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;

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;

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;

src/index.tsx

@@ -27,3 +27,5 @@ root.render(
     </StoreProvider>
   </BrowserRouter>,
 );
+export { RoutePath } from '@/shared/const/router';
+export { AppRoutes } from '@/shared/const/router';

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;

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;

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, string> = {
+  [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]: '*',
+};

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;

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,

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;