bug: Исправлена проблема 404 ошибки при перезагрузке страницы на gh p…

…ages

.env.local

@@ -1,2 +1,2 @@
 VITE_RENDER_RADAR_URL=https://kaluga-astral.github.io/render-tech-radar
-VITE_BASE_PATH=''
+VITE_BASE_PATH='/technology-radar'

src/App.tsx

@@ -1,35 +1,35 @@
 import './App.css';
-import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import { HashRouter, Route, Routes } from 'react-router-dom';
 import { ThemeProvider, Typography } from '@astral/ui';
 import { DashboardLayout } from '@astral/ui';
 
 import { theme } from './theme';
 import { Header, Radar, SideBar } from './components';
-import { BASE_PATH, TEAMS } from './config';
+import { TEAMS } from './config';
 import { IntroScreen } from './screens';
 
 function App() {
   return (
     <ThemeProvider theme={theme}>
-      <BrowserRouter>
+      <HashRouter>
         <DashboardLayout>
           <Header />
           <SideBar />
           <DashboardLayout.Main>
             <Routes>
-              <Route path={BASE_PATH} element={<IntroScreen />} />
+              <Route path="/" element={<IntroScreen />} />
               {Object.entries(TEAMS).map(([id]) => (
                 <Route
                   key={id}
-                  path={`${BASE_PATH}/${id}`}
+                  path={`/${id}`}
                   element={<Radar jsonName={id} />}
                 />
               ))}
               <Route path="/*" element={<Typography>Не найдено</Typography>} />
             </Routes>
           </DashboardLayout.Main>
         </DashboardLayout>
-      </BrowserRouter>
+      </HashRouter>
     </ThemeProvider>
   );
 }

src/components/SideBar/SideBar.tsx

@@ -2,7 +2,7 @@ import { Link, LinkProps, useLocation } from 'react-router-dom';
 import { DashboardLayout, NavMenuProps } from '@astral/ui';
 import { forwardRef } from 'react';
 
-import { BASE_PATH, TEAMS } from '../../config';
+import { TEAMS } from '../../config';
 
 export const SideBar = () => {
   const { pathname } = useLocation();
@@ -14,10 +14,10 @@ export const SideBar = () => {
         {
           icon: <Icon />,
           text: name,
-          active: pathname === `${BASE_PATH}/${id}`,
+          active: pathname === `/${id}`,
           component: forwardRef<HTMLAnchorElement, LinkProps>(
             ({ children, ...props }, ref) => (
-              <Link key={id} ref={ref} {...props} to={`${BASE_PATH}/${id}`}>
+              <Link key={id} ref={ref} {...props} to={`/${id}`}>
                 {children}
               </Link>
             ),

src/screens/IntroScreen/IntroScreen.tsx

@@ -1,7 +1,7 @@
 import { Typography } from '@astral/ui';
 import { Link } from 'react-router-dom';
 
-import { BASE_PATH, TEAMS } from '../../config';
+import { TEAMS } from '../../config';
 
 import { IntroScreenDivider, IntroScreenPage } from './styles';
 
@@ -108,7 +108,7 @@ export const IntroScreen = () => {
         <ul>
           {Object.entries(TEAMS).map(([id, { name }]) => (
             <li>
-              <Link to={`${BASE_PATH}/${id}`}>
+              <Link to={`/${id}`}>
                 <Typography color="info">{name}</Typography>
               </Link>
             </li>