Files
ApiCore/ApiCore-Frontend/src/lib/auth/api.ts
T
Nick SzaunigandClaude Sonnet 5 335c572dfc feat: RBAC Phase 5 - Rollenverwaltung im Frontend
Neue /settings/roles-Seite (Aktiv/Historie, Karten-Grid) zum Anlegen,
Bearbeiten, Deaktivieren und Reaktivieren von Rollen mit einer
Rechte-Matrix (nach Bereich gruppierte Checkboxen, Gruppen-Toggle,
Live-Zaehler), passend zum Backend aus Phase 1-3.

- AuthContext liest Rolle/Rechte jetzt ueber GET /auth/me statt aus
  dem JWT (das seit Phase 3 keinen role-Claim mehr traegt); neue
  hasPermission()-Hilfsfunktion ersetzt String-Vergleiche gegen "ADMIN".
- Sidebar zeigt Verwaltungs-Eintraege jetzt einzeln nach Berechtigung
  (statt Alles-oder-Nichts fuer ADMIN), inkl. neuem "Rollen & Rechte"-
  Eintrag.
- Settings-Layout blockt nur noch, wenn gar keine Verwaltungs-
  Berechtigung vorhanden ist, statt stur auf die ADMIN-Rolle zu pruefen.
- Benutzerseite: Rollen-Auswahl laedt jetzt aktive Rollen von
  GET /roles statt einer festen 5-Werte-Liste; sendet roleId statt
  role an POST/PATCH /users.
- Totes jwt.ts (Rolle wurde bislang aus dem Token dekodiert) entfernt.

Live im Browser getestet (Login, Sidebar, Rollen anlegen/bearbeiten/
deaktivieren/reaktivieren, Benutzer-Dialog): dabei einen echten a11y-
Bug gefunden und behoben - Gruppen-Checkboxen fuer mehrwortige
Bereichsnamen ("Wiederkehrende Aufgaben", "Rollen & Rechte") hatten
keinen zugaenglichen Namen, weil die HTML-id ein Leerzeichen enthielt;
jetzt ueber einen Slug erzeugt.

Verifiziert: tsc, lint, build, alle Unit-Tests (14/14) gruen.

Co-Authored-By: Claude Sonnet 5 <[email protected]>
2026-08-26 09:27:23 +02:00

71 lines
2.3 KiB
TypeScript

const API_URL = process.env.NEXT_PUBLIC_API_URL ?? 'http://localhost:3001/api/v1';
export interface AccessTokenResponse {
accessToken: string;
}
export async function loginRequest(email: string, password: string): Promise<AccessTokenResponse> {
const response = await fetch(`${API_URL}/auth/login`, {
method: 'POST',
credentials: 'include',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email, password }),
});
if (!response.ok) {
throw new Error('Login fehlgeschlagen. Bitte E-Mail und Passwort prüfen.');
}
return response.json() as Promise<AccessTokenResponse>;
}
// The refresh token is single-use and rotates on every call. If two callers
// (e.g. React StrictMode's dev double-invoke, or two components hitting a 401
// at once) both call refresh at the same time, the second one always fails
// because the first already rotated the cookie. Deduplicating into one
// shared in-flight request makes concurrent callers share the same result
// instead of racing each other.
let inFlightRefresh: Promise<AccessTokenResponse | null> | null = null;
async function performRefresh(): Promise<AccessTokenResponse | null> {
const response = await fetch(`${API_URL}/auth/refresh`, {
method: 'POST',
credentials: 'include',
});
if (!response.ok) {
return null;
}
return response.json() as Promise<AccessTokenResponse>;
}
export function refreshRequest(): Promise<AccessTokenResponse | null> {
if (!inFlightRefresh) {
inFlightRefresh = performRefresh().finally(() => {
inFlightRefresh = null;
});
}
return inFlightRefresh;
}
export async function logoutRequest(): Promise<void> {
await fetch(`${API_URL}/auth/logout`, { method: 'POST', credentials: 'include' });
}
export interface CurrentUserProfile {
id: string;
email: string;
name: string;
roleKey: string;
roleName: string;
permissions: string[];
}
export async function getCurrentUserRequest(accessToken: string): Promise<CurrentUserProfile> {
const response = await fetch(`${API_URL}/auth/me`, {
credentials: 'include',
headers: { Authorization: `Bearer ${accessToken}` },
});
if (!response.ok) {
throw new Error('Profil konnte nicht geladen werden.');
}
return response.json() as Promise<CurrentUserProfile>;
}