feat(scheduler): live admin Scheduler dashboard + reusable poll hook (HU/EN/DE)

New admin Scheduler page (left-nav entry) with a live, self-refreshing view of
job activity, queued work and quota. Polling is factored into a reusable
useLiveQuery hook (pauses when the tab is unfocused) that the notification bell
and future yt-dlp job queue will reuse instead of re-implementing.
This commit is contained in:
npeter83 2026-06-16 14:38:51 +02:00
parent a339a73bd6
commit 73b06b1fb6
13 changed files with 491 additions and 5 deletions

View file

@ -303,6 +303,39 @@ export interface ManagedChannel {
backfill_done: boolean;
}
export interface SchedulerJob {
id: string;
interval_minutes: number;
next_run: string | null;
running: boolean;
status: "ok" | "error" | "skipped" | null;
last_started: string | null;
last_finished: string | null;
last_result: string | null;
last_error: string | null;
}
export interface SchedulerStatus {
running_here: boolean;
enabled: boolean;
paused: boolean;
jobs: SchedulerJob[];
queue: {
channels_recent_pending: number;
channels_deep_pending: number;
deep_eta_seconds: number;
videos_pending_enrich: number;
videos_pending_shorts: number;
videos_live_refresh: number;
};
quota: {
used_today: number;
remaining_today: number;
daily_budget: number;
backfill_reserve: number;
};
}
export interface Account {
id: number;
email: string;
@ -400,6 +433,7 @@ export const api = {
// --- quota usage ---
myUsage: (): Promise<MyUsage> => req("/api/quota/my-usage"),
adminQuota: (days = 30): Promise<AdminQuota> => req(`/api/quota/admin?days=${days}`),
schedulerStatus: (): Promise<SchedulerStatus> => req("/api/admin/scheduler"),
// --- onboarding / admin ---
requestAccess: (email: string): Promise<{ status: string }> =>

View file

@ -78,11 +78,15 @@ export function hasFilterParams(params: URLSearchParams): boolean {
return KEYS.some((k) => params.has(k));
}
export type Page = "feed" | "channels" | "stats" | "playlists" | "settings";
export type Page = "feed" | "channels" | "stats" | "playlists" | "settings" | "scheduler";
export function readPage(): Page {
const p = new URLSearchParams(window.location.search).get("page");
return p === "channels" || p === "stats" || p === "playlists" || p === "settings"
return p === "channels" ||
p === "stats" ||
p === "playlists" ||
p === "settings" ||
p === "scheduler"
? p
: "feed";
}

View file

@ -0,0 +1,22 @@
import { useQuery, type QueryKey } from "@tanstack/react-query";
// Reusable "live" polling query: a thin wrapper over react-query that refetches on an
// interval and — by leaving refetchIntervalInBackground at its default false — pauses while
// the tab is unfocused, so it doesn't poll a server nobody's watching. This is the shared
// live-progress mechanism: the Scheduler dashboard uses it now; the notification bell and the
// future yt-dlp job queue reuse it rather than each re-implementing polling.
export function useLiveQuery<T>(
key: QueryKey,
queryFn: () => Promise<T>,
opts: { intervalMs?: number; enabled?: boolean } = {}
) {
const { intervalMs = 4000, enabled = true } = opts;
return useQuery({
queryKey: key,
queryFn,
enabled,
refetchInterval: enabled ? intervalMs : false,
refetchIntervalInBackground: false,
staleTime: 0,
});
}