67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { useMemo, useState } from 'react';
|
|
// @ts-ignore
|
|
import { Content } from '@carbon/react';
|
|
|
|
import { BrowserRouter, Routes, Route } from 'react-router-dom';
|
|
import ErrorContext from './contexts/ErrorContext';
|
|
import NavigationBar from './components/NavigationBar';
|
|
|
|
import HomePageRoutes from './routes/HomePageRoutes';
|
|
import ErrorBoundary from './components/ErrorBoundary';
|
|
import AdminRoutes from './routes/AdminRoutes';
|
|
import { ErrorForDisplay } from './interfaces';
|
|
|
|
export default function App() {
|
|
const [errorMessage, setErrorMessage] = useState<ErrorForDisplay | null>(
|
|
null
|
|
);
|
|
|
|
const errorContextValueArray = useMemo(
|
|
() => [errorMessage, setErrorMessage],
|
|
[errorMessage]
|
|
);
|
|
|
|
let errorTag = null;
|
|
if (errorMessage) {
|
|
let sentryLinkTag = null;
|
|
if (errorMessage.sentry_link) {
|
|
sentryLinkTag = (
|
|
<span>
|
|
{
|
|
': Find details about this error here (it may take a moment to become available): '
|
|
}
|
|
<a href={errorMessage.sentry_link} target="_blank" rel="noreferrer">
|
|
{errorMessage.sentry_link}
|
|
</a>
|
|
</span>
|
|
);
|
|
}
|
|
errorTag = (
|
|
<div id="filter-errors" className="mt-4 alert alert-danger" role="alert">
|
|
{errorMessage.message}
|
|
{sentryLinkTag}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="cds--white">
|
|
<ErrorContext.Provider value={errorContextValueArray}>
|
|
<BrowserRouter>
|
|
<NavigationBar />
|
|
<Content>
|
|
{errorTag}
|
|
<ErrorBoundary>
|
|
<Routes>
|
|
<Route path="/" element={<HomePageRoutes />} />
|
|
<Route path="/tasks/*" element={<HomePageRoutes />} />
|
|
<Route path="/admin/*" element={<AdminRoutes />} />
|
|
</Routes>
|
|
</ErrorBoundary>
|
|
</Content>
|
|
</BrowserRouter>
|
|
</ErrorContext.Provider>
|
|
</div>
|
|
);
|
|
}
|