feat(frontend): /admin dashboard with users/mangas/system views (0.41.0)
Adds the SvelteKit /admin route tree backed by the admin endpoints landed in PR 1-4. Pages: Overview (alerts + summary cards), Users (list / promote-demote / delete), Mangas (list with sync state + expandable per-chapter state), System (live disk/mem/cpu bars, refreshing every 5s). Security model: the backend's RequireAdmin extractor is the actual boundary. /admin/+layout.ts calls getSystemStats() at load and translates the response — 401 → redirect to /login, 403 → throw SvelteKit error(403) which renders the framework error page. The header's "Admin" link is hidden unless `session.user?.is_admin`, but that's UX only. Carries `is_admin: boolean` through to the frontend User TS type so the header check works and so admin tables can show role per row. Vitest covers lib/api/admin.ts (10 tests: list/delete/PATCH for users, sync-state filter for mangas, nested chapter route, system disk-nullable case). Playwright is intentionally deferred until the routes stabilise — admin UI is operator-only and changes shape often in v0.
This commit is contained in:
144
frontend/src/lib/api/admin.ts
Normal file
144
frontend/src/lib/api/admin.ts
Normal file
@@ -0,0 +1,144 @@
|
||||
// Admin-only API client. Every endpoint here is guarded by
|
||||
// RequireAdmin on the backend (session cookie only — bearer tokens
|
||||
// won't reach these routes). 403s thrown here propagate up to the
|
||||
// /admin layout, which renders the framework error page.
|
||||
|
||||
import { request, type Page } from './client';
|
||||
import type { User } from './auth';
|
||||
|
||||
// ---- users -----------------------------------------------------------------
|
||||
|
||||
export type AdminUsersPage = {
|
||||
items: User[];
|
||||
page: Page;
|
||||
};
|
||||
|
||||
export type ListAdminUsersOptions = {
|
||||
search?: string;
|
||||
limit?: number;
|
||||
offset?: number;
|
||||
};
|
||||
|
||||
export async function listAdminUsers(
|
||||
opts: ListAdminUsersOptions = {}
|
||||
): Promise<AdminUsersPage> {
|
||||
const params = new URLSearchParams();
|
||||
if (opts.search) params.set('search', opts.search);
|
||||
if (opts.limit != null) params.set('limit', String(opts.limit));
|
||||
if (opts.offset != null) params.set('offset', String(opts.offset));
|
||||
const qs = params.toString();
|
||||
return request<AdminUsersPage>(`/v1/admin/users${qs ? `?${qs}` : ''}`);
|
||||
}
|
||||
|
||||
export async function deleteAdminUser(id: string): Promise<void> {
|
||||
await request<void>(`/v1/admin/users/${encodeURIComponent(id)}`, {
|
||||
method: 'DELETE'
|
||||
});
|
||||
}
|
||||
|
||||
export async function setUserAdmin(id: string, isAdmin: boolean): Promise<User> {
|
||||
return request<User>(`/v1/admin/users/${encodeURIComponent(id)}`, {
|
||||
method: 'PATCH',
|
||||
headers: { 'content-type': 'application/json' },
|
||||
body: JSON.stringify({ is_admin: isAdmin })
|
||||
});
|
||||
}
|
||||
|
||||
// ---- mangas / chapters with sync state -------------------------------------
|
||||
|
||||
export type MangaSyncState = 'in_progress' | 'dropped' | 'synced';
|
||||
|
||||
export type AdminMangaRow = {
|
||||
id: string;
|
||||
title: string;
|
||||
status: string;
|
||||
cover_image_path: string | null;
|
||||
created_at: string;
|
||||
updated_at: string;
|
||||
sync_state: MangaSyncState;
|
||||
chapter_count: number;
|
||||
latest_seen_at: string | null;
|
||||
};
|
||||
|
||||
export type AdminMangasPage = {
|
||||
items: AdminMangaRow[];
|
||||
page: Page;
|
||||
};
|
||||
|
||||
export type ListAdminMangasOptions = {
|
||||
search?: string;
|
||||
syncState?: MangaSyncState;
|
||||
limit?: number;
|
||||
offset?: number;
|
||||
};
|
||||
|
||||
export async function listAdminMangas(
|
||||
opts: ListAdminMangasOptions = {}
|
||||
): Promise<AdminMangasPage> {
|
||||
const params = new URLSearchParams();
|
||||
if (opts.search) params.set('search', opts.search);
|
||||
if (opts.syncState) params.set('sync_state', opts.syncState);
|
||||
if (opts.limit != null) params.set('limit', String(opts.limit));
|
||||
if (opts.offset != null) params.set('offset', String(opts.offset));
|
||||
const qs = params.toString();
|
||||
return request<AdminMangasPage>(`/v1/admin/mangas${qs ? `?${qs}` : ''}`);
|
||||
}
|
||||
|
||||
export type ChapterSyncState =
|
||||
| 'downloading'
|
||||
| 'dropped'
|
||||
| 'failed'
|
||||
| 'not_downloaded'
|
||||
| 'synced';
|
||||
|
||||
export type AdminChapterRow = {
|
||||
id: string;
|
||||
manga_id: string;
|
||||
number: number;
|
||||
title: string | null;
|
||||
page_count: number;
|
||||
created_at: string;
|
||||
sync_state: ChapterSyncState;
|
||||
latest_seen_at: string | null;
|
||||
};
|
||||
|
||||
export async function listAdminChapters(mangaId: string): Promise<AdminChapterRow[]> {
|
||||
return request<AdminChapterRow[]>(
|
||||
`/v1/admin/mangas/${encodeURIComponent(mangaId)}/chapters`
|
||||
);
|
||||
}
|
||||
|
||||
// ---- system ----------------------------------------------------------------
|
||||
|
||||
export type DiskStats = {
|
||||
total_bytes: number;
|
||||
used_bytes: number;
|
||||
free_bytes: number;
|
||||
percent_used: number;
|
||||
};
|
||||
|
||||
export type MemoryStats = {
|
||||
total_bytes: number;
|
||||
used_bytes: number;
|
||||
percent_used: number;
|
||||
};
|
||||
|
||||
export type CpuStats = {
|
||||
percent_used: number;
|
||||
};
|
||||
|
||||
export type Alert = {
|
||||
level: 'warning';
|
||||
message: string;
|
||||
};
|
||||
|
||||
export type SystemStats = {
|
||||
disk: DiskStats | null;
|
||||
memory: MemoryStats;
|
||||
cpu: CpuStats;
|
||||
alerts: Alert[];
|
||||
};
|
||||
|
||||
export async function getSystemStats(): Promise<SystemStats> {
|
||||
return request<SystemStats>('/v1/admin/system');
|
||||
}
|
||||
Reference in New Issue
Block a user