97 lines
3.2 KiB
TypeScript
97 lines
3.2 KiB
TypeScript
import * as React from 'react';
|
|
import './App.css';
|
|
import {Faro} from "@grafana/faro-web-sdk";
|
|
import {createBrowserRouter, redirect, RouterProvider} from "react-router-dom";
|
|
import CreateCharacter from "./first-edition/pages/CreateCharacter";
|
|
import CharacterList from "./first-edition/pages/CharacterList";
|
|
import ErrorBoundary from "./shared/ErrorBoundary";
|
|
import Header from "./shared/Header";
|
|
import Footer from "./shared/Footer";
|
|
import {useState} from "react";
|
|
import {UserContext, userDefaults} from './shared/contexts/UserContext';
|
|
import CreateCharacter2E from "./second-edition/pages/CreateCharacter2E";
|
|
|
|
function App(props: {faro?: Faro}) {
|
|
|
|
const [fetchedUser, setFetchedUser] = useState(userDefaults)
|
|
|
|
if (fetchedUser.state === "not-started") {
|
|
setFetchedUser({...fetchedUser, state: "loading"})
|
|
fetch(`${window.location.origin}/api/User/me`)
|
|
.then(response => {
|
|
if (response.ok) {
|
|
return response.text();
|
|
}
|
|
console.log(response)
|
|
})
|
|
.then(userNameResponse => {
|
|
const userName = userNameResponse && userNameResponse.length > 0 ? userNameResponse : null;
|
|
setFetchedUser({
|
|
data: userName,
|
|
state: "finished"
|
|
});
|
|
})
|
|
.catch(() => {
|
|
setFetchedUser({
|
|
data: null,
|
|
state: "finished"
|
|
})
|
|
})
|
|
}
|
|
|
|
const router = createBrowserRouter([
|
|
{
|
|
path: "/",
|
|
loader: () => fetchedUser.data == null ? redirect("/1e/karakter") : redirect("/karaktereim")
|
|
},
|
|
{
|
|
path: "/karaktereim",
|
|
element: <CharacterList />,
|
|
loader: () => fetch(`${window.location.origin}/api/Character`),
|
|
ErrorBoundary: ErrorBoundary,
|
|
},
|
|
{
|
|
path: "/1e",
|
|
loader: () => redirect("/1e/karakter")
|
|
},
|
|
{
|
|
path: "/1e/karakter",
|
|
element: <CreateCharacter faro={props.faro} />,
|
|
ErrorBoundary: ErrorBoundary,
|
|
},
|
|
{
|
|
path: "/1e/karakter/:id",
|
|
element: <CreateCharacter faro={props.faro}/>,
|
|
loader: args => fetch(`${window.location.origin}/api/Character/${args.params.id}`),
|
|
ErrorBoundary: ErrorBoundary,
|
|
},
|
|
{
|
|
path: "/2e",
|
|
loader: () => redirect("/2e/karakter")
|
|
},
|
|
{
|
|
path: "/2e/karakter",
|
|
element: <CreateCharacter2E />,
|
|
ErrorBoundary: ErrorBoundary,
|
|
},
|
|
{
|
|
path: "/2e/karakter/:id",
|
|
element: <CreateCharacter faro={props.faro}/>,
|
|
loader: args => fetch(`${window.location.origin}/api/Character/${args.params.id}`),
|
|
ErrorBoundary: ErrorBoundary,
|
|
},
|
|
]);
|
|
|
|
return (
|
|
<UserContext.Provider value={fetchedUser}>
|
|
<Header/>
|
|
<div className='container'>
|
|
<RouterProvider router={router}/>
|
|
</div>
|
|
<Footer />
|
|
</UserContext.Provider>
|
|
);
|
|
}
|
|
|
|
export default App;
|