Files
LiquidCode_Frontend/src/pages/Home.tsx
Виталий Лавшонок aeab03d35c account and protected router
2025-11-05 00:08:51 +03:00

83 lines
3.4 KiB
TypeScript

// import React from "react";
import { Route, Routes } from 'react-router-dom';
import Login from '../views/home/auth/Login';
import Register from '../views/home/auth/Register';
import Menu from '../views/home/menu/Menu';
import { useAppDispatch, useAppSelector } from '../redux/hooks';
import { useEffect } from 'react';
import { fetchWhoAmI, logout } from '../redux/slices/auth';
import Missions from '../views/home/missions/Missions';
import Articles from '../views/home/articles/Articles';
import Groups from '../views/home/groups/Groups';
import Contests from '../views/home/contests/Contests';
import { PrimaryButton } from '../components/button/PrimaryButton';
import Group from '../views/home/groups/Group';
import Contest from '../views/home/contest/Contest';
import Account from '../views/home/account/Account';
import ProtectedRoute from '../components/router/ProtectedRoute';
const Home = () => {
const name = useAppSelector((state) => state.auth.username);
const jwt = useAppSelector((state) => state.auth.jwt);
const dispatch = useAppDispatch();
useEffect(() => {
dispatch(fetchWhoAmI());
}, [jwt]);
return (
<div className="w-full bg-liquid-background grid grid-cols-[250px,1fr,250px] divide-x-[1px] divide-liquid-lighter">
<div className="min-h-screen">
<Menu />
</div>
<div className="h-screen">
<Routes>
<Route element={<ProtectedRoute />}>
<Route path="account/*" element={<Account />} />
</Route>
<Route path="login" element={<Login />} />
<Route path="register" element={<Register />} />
<Route path="missions/*" element={<Missions />} />
<Route path="articles/*" element={<Articles />} />
<Route path="group/:groupId" element={<Group />} />
<Route path="groups/*" element={<Groups />} />
<Route path="contests/*" element={<Contests />} />
<Route path="contest/:contestId/*" element={<Contest />} />
<Route
path="*"
element={
<>
<p>{jwt}</p>
<PrimaryButton
onClick={() => {
if (jwt)
navigator.clipboard.writeText(jwt);
}}
text="скопировать токен"
className="pt-[20px]"
/>
<p className="py-[20px]">{name}</p>
<PrimaryButton
onClick={() => {
dispatch(logout());
}}
>
выйти
</PrimaryButton>
</>
}
/>
</Routes>
</div>
{
<Routes>
<Route path="articles/*" element={<div></div>} />
</Routes>
}
</div>
);
};
export default Home;