require auth

react-openapi/src/hooks/useApi.ts

@@ -1,4 +1,5 @@
 import axios, { AxiosInstance } from "axios";
+import { tokenStore } from "../../../react-auth/token";
 
 let apiClient: AxiosInstance | null = null;
 
@@ -26,7 +27,6 @@ export function initApi(baseUrl: string, getToken?: () => string | null): AxiosI
       if (error.response?.status === 401 && getToken) {
         const currentToken = getToken();
         if (currentToken) {
-          const tokenStore = { clear: () => localStorage.removeItem("token") };
           tokenStore.clear();
         }
       }

src/RequireAuth.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { useNavigate } from "react-router-dom";
+import { useAuth, AuthPage } from "../react-auth";
+
+export function RequireAuth({ children }: { children: React.ReactNode }) {
+  const { currentUser, loading, error, login, register } = useAuth();
+  const navigate = useNavigate();
+  const [mode, setMode] = React.useState<"login" | "register">("login");
+
+  if (currentUser) {
+    return <>{children}</>;
+  }
+
+  return (
+    <AuthPage
+      mode={mode}
+      onBack={() => navigate("/")}
+      onSwitchMode={() => setMode(mode === "login" ? "register" : "login")}
+      login={login}
+      register={register}
+      loading={loading}
+      error={error}
+      currentUser={currentUser}
+    />
+  );
+}

src/main.jsx

@@ -16,6 +16,7 @@ import Dashboard from './Dashboard';
 import FetchRequests from './FetchRequests';
 import FetchRequestDetail from './FetchRequestDetail';
 import ReportSnapshots from './ReportSnapshots';
+import { RequireAuth } from './RequireAuth';
 import { AppProvider, Admin } from '../react-openapi';
 import { Buffer } from 'buffer';
 import process from 'process';
@@ -64,7 +65,7 @@ root.render(
                   path={path}
                   element={
                     path.startsWith("/admin") ? (
-                      <Component basePath="/admin" />
+                      <RequireAuth><Component basePath="/admin" /></RequireAuth>
                     ) : (
                       <Component />
                     )