1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
import './App.css';
import './Fonts.css';
import Sidebar from './Emelents/Sidebar';
import { createBrowserRouter, RouterProvider } from 'react-router';
import IndexElement from './Emelents/IndexElement';
import ClassesList from './Emelents/ClassList';
import Topbar from './Emelents/Topbar';
import { AllowedLanguages, LanguageContext } from './Locales/Context';
import { useEffect, useState } from 'react';
import { ReadCurrentLocale, SaveCurrentLocale } from './Locales/Locales';
import LegalNote from './Emelents/LegalNote';
import WeaponsIndex from './Pages/Weapons';
import { AuthContext, GetUserInfo } from './Authentication/ContextProvider';
import { useCookies } from 'react-cookie';
import LoginPage from './Authentication/LoginPage';
import LogoutPage from './Authentication/LogoutPage';
import { User } from './Authentication/Models';
import RegisterPage from './Authentication/RegisterPage';
import { EditRangedWeaponPage, RangedWeaponPage } from './Pages/RangedWeapon';
import ErrorHandler from './ErrorHandler';
const router = createBrowserRouter([
{
index: true,
errorElement: (<ErrorHandler />),
element: (<IndexElement />),
},
{
path: "/classes",
element: (<ClassesList />),
},
{
path: "/weapons",
element: (<WeaponsIndex />),
},
{
path: "/weapons/:id",
element: (<RangedWeaponPage />),
},
{
path: "/weapons/:id/edit",
element: (<EditRangedWeaponPage />),
},
// auth
{
path: "/login",
element: (<LoginPage />),
},
{
path: "/register",
element: (<RegisterPage />),
},
{
path: "/logout",
element: (<LogoutPage />),
},
]);
function App() {
const [lang, setLang] = useState<AllowedLanguages>(ReadCurrentLocale());
function SetLanguage(newLang: AllowedLanguages) {
console.log(`Setting a new language ${newLang}...`);
SaveCurrentLocale(newLang);
setLang(newLang);
}
const [authCookie, ] = useCookies(['X-AUTH-TOKEN']);
const [auth, setAuth] = useState<User | null>(null);
useEffect(() => {
GetUserInfo(authCookie['X-AUTH-TOKEN']).then(v => setAuth(v));
}, []);
return (
<AuthContext.Provider value={auth}>
<LanguageContext.Provider value={lang}>
<div className='App'>
<Topbar />
<div className='AppContents'>
<Sidebar
setLang={SetLanguage}
/>
<RouterProvider router={router} />
</div>
<LegalNote />
</div>
</LanguageContext.Provider>
</AuthContext.Provider>
);
}
export default App;
|
