From 73c6a7a0a41119dd7a7504531110fc26a97e3323 Mon Sep 17 00:00:00 2001
From: Jordan Doyle <jordan@doyle.la>
Date: Tue, 09 Nov 2021 23:25:49 +0000
Subject: [PATCH] Add 404 page to chartered-frontend

---
 chartered-frontend/src/index.tsx          |  4 ++++
 chartered-frontend/src/pages/NotFound.tsx | 32 ++++++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+)

diff --git a/chartered-frontend/src/index.tsx b/chartered-frontend/src/index.tsx
index 9cf29b5..0d755e4 100644
--- a/chartered-frontend/src/index.tsx
+++ a/chartered-frontend/src/index.tsx
@@ -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>
diff --git a/chartered-frontend/src/pages/NotFound.tsx b/chartered-frontend/src/pages/NotFound.tsx
new file mode 100644
index 0000000..43fa46f 100644
--- /dev/null
+++ a/chartered-frontend/src/pages/NotFound.tsx
@@ -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 />;
+}
--
rgit 0.1.3