## Summary
Wire spec-driven auth into the frontend. Auth config (server URL, paths) is extracted from the served OpenAPI spec by `AppProvider`. `AuthProvider` receives the config as a prop. 401 responses from both the main API and the auth server dispatch an `auth:unauthorized` event that triggers redirect to `/login`. Fix `ProfileRoutes` URL duplication bug.
## Changes
### Auth config from spec
- **`main.jsx`** — `AppProvider` wraps everything, loads spec, exposes `authConfig`. `AuthProvider` receives `authConfig` from `useAppContext()`. `onUnauthorized` passed to both `AppProvider` and `AuthProvider` wires `navigate("/login")`.
### 401 handling
- **`AppProvider.tsx`** — remove `onUnauthorized` prop (handled by `AuthProvider`'s event listener instead, avoiding double-navigation).
- **`useApi.ts`** — 401 response interceptor dispatches `auth:unauthorized` CustomEvent on `window`.
### Profile routing fix
- **`Admin.tsx:ProfileRoutes`** — replace nested `<Routes>` (which caused `/profile/me/me` URL duplication with React Router v6) with `useLocation()`/`useNavigate()` conditional rendering. Only allows `/profile/me` and `/profile/me/edit`.
- **`Admin.tsx:ProfileComponentWrapper`** — replace `pushState() + reload()` with React Router `navigate()` for both `onEdit` and `handleSubmit`.
### Debug logging
- Temporary console logs at every navigation point for diagnosing remaining issues.
Reviewed-on: #12
Co-authored-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Co-committed-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
25 lines
776 B
TypeScript
25 lines
776 B
TypeScript
import { createContext, useContext } from "react";
|
|
import type { AuthConfig, ProfileComponents, ProfileOperation, ResourceConfig, SpecConfiguration, ValidationMessage } from "../types";
|
|
|
|
export interface AppContextValue {
|
|
config: SpecConfiguration;
|
|
resources: ResourceConfig[];
|
|
profileOperations: ProfileOperation[];
|
|
profileComponents: ProfileComponents;
|
|
authConfig: AuthConfig;
|
|
schemas: Record<string, any>;
|
|
loading: boolean;
|
|
errors: ValidationMessage[];
|
|
warnings: ValidationMessage[];
|
|
}
|
|
|
|
export const AppContext = createContext<AppContextValue | null>(null);
|
|
|
|
export function useAppContext(): AppContextValue {
|
|
const ctx = useContext(AppContext);
|
|
if (!ctx) {
|
|
throw new Error("useAppContext must be used within an AppProvider");
|
|
}
|
|
return ctx;
|
|
}
|