Add 404 page to chartered-frontend
Diff
chartered-frontend/src/index.tsx | 4 ++++
chartered-frontend/src/pages/NotFound.tsx | 32 ++++++++++++++++++++++++++++++++
2 files changed, 36 insertions(+)
@@ -28,6 +28,7 @@
import { backgroundFix } from "./overscrollColourFixer";
import Register from "./pages/Register";
import ListSessions from "./pages/sessions/ListSessions";
import NotFound from "./pages/NotFound";
if (
window.matchMedia &&
@@ -76,6 +77,9 @@
<Route path="/sessions" element={<Private element={<Navigate to="/sessions/list" />} />} />
<Route path="/sessions/list" element={<Private element={<ListSessions />} />} />
<Route path="/404" element={<NotFound />} />
<Route path="*" element={<Navigate to="/404" />} />
</Routes>
</Router>
</ProvideAuth>
@@ -1,0 +1,32 @@
import Nav from "../sections/Nav";
import { useAuth } from "../useAuth";
export default function NotFound() {
return (
<>
<MaybeShowNav />
<div
className="d-flex justify-content-center align-items-center"
style={{ minHeight: "calc(100vh - 6rem)" }}
>
<div className="card border-0 shadow-sm text-black p-2 m-3">
<div className="card-body">
Seems you've taken a wrong turn! The page you requested couldn't be
found.
</div>
</div>
</div>
</>
);
}
function MaybeShowNav() {
const auth = useAuth();
if (!auth?.getAuthKey()) {
return <></>;
}
return <Nav />;
}