Files
roleplay-contract/gui/rpk-gui/src/App.tsx

106 lines
3.8 KiB
TypeScript

import { Authenticated, I18nProvider, Refine } from "@refinedev/core";
import { useTranslation } from "react-i18next";
import { RefineSnackbarProvider, useNotificationProvider } from "@refinedev/mui";
import CssBaseline from "@mui/material/CssBaseline";
import GlobalStyles from "@mui/material/GlobalStyles";
import HistoryEduIcon from '@mui/icons-material/HistoryEdu';
import routerBindings, {
CatchAllNavigate,
DocumentTitleHandler,
UnsavedChangesNotifier,
} from "@refinedev/react-router";
import { BrowserRouter, Outlet, Route, Routes } from "react-router";
import authProvider from "./providers/auth-provider";
import dataProvider from "./providers/data-provider";
import { ColorModeContextProvider } from "./contexts/color-mode";
import { Login } from "./components/auth/Login";
import { Register } from "./components/auth/Register";
import { ForgotPassword } from "./components/auth/ForgotPassword";
import { UpdatePassword } from "./components/auth/UpdatePassword";
import { Header } from "./components";
import { I18nTheme } from "./components/I18nTheme";
import { HubRoutes } from "./pages/hub";
import { FirmRoutes } from "./pages/firm";
function App() {
const { t, i18n } = useTranslation();
const i18nProvider: I18nProvider = {
translate: (key: string, options?: any) => t(key, options) as string,
changeLocale: (lang: string) => i18n.changeLanguage(lang),
getLocale: () => i18n.language,
};
return (
<BrowserRouter>
<ColorModeContextProvider>
<CssBaseline />
<GlobalStyles styles={{ html: { WebkitFontSmoothing: "auto" } }} />
<RefineSnackbarProvider>
<Refine
authProvider={authProvider}
dataProvider={dataProvider}
i18nProvider={i18nProvider}
notificationProvider={useNotificationProvider}
routerProvider={routerBindings}
options={{
title: {
text: "Roleplay Contracts",
icon: <HistoryEduIcon />
},
syncWithLocation: true,
warnWhenUnsavedChanges: true,
useNewQueryKeys: true,
disableTelemetry: true,
reactQuery: {
clientConfig: {
defaultOptions: {
queries: {
retry: (failureCount, error) => {
// @ts-ignore
if (error.statusCode >= 400 && error.statusCode <= 499) {
return false
}
return failureCount < 4
},
}
}
}
}
}}
>
<I18nTheme>
<Routes>
<Route
element={(
<Authenticated key="authenticated-routes" redirectOnFail="/login" fallback={<CatchAllNavigate to="/login"/>}>
<Outlet />
</Authenticated>
)}
>
<Route path="hub/*" element={<HubRoutes />} />
<Route path="firm/*" element={<FirmRoutes />} />
</Route>
<Route path="*" element={<Outlet />}>
<Route path="login" element={<Login />} />
<Route path="register" element={<Register />} />
<Route path="forgot-password" element={<ForgotPassword />} />
<Route path="update-password" element={<UpdatePassword />} />
</Route>
<Route index element={<><Header /><h1>{t("pages.home.title")}</h1></>} />
</Routes>
<UnsavedChangesNotifier />
<DocumentTitleHandler />
</I18nTheme>
</Refine>
</RefineSnackbarProvider>
</ColorModeContextProvider>
</BrowserRouter>
);
}
export default App;