swarm-ui: one polled-resource hook for the refreshing pages
Each polling page repeated its own fetch-and-set code on a fixed timer, so a slow answer could be overtaken by the next tick, an older response could overwrite a newer one, and nothing aborted a request when the page went away. usePolled skips a tick while a request is in flight, aborts on unmount or refresh, ignores answers from dropped requests, and keeps the last good data under an error. The alerts, hives, agents, schedules, builds, review runs and broadcast pages and the subagent list use it.
This commit is contained in:
parent
9338496e24
commit
8917ba27b6
1 changed files with 274 additions and 160 deletions
|
|
@ -6,15 +6,14 @@
|
|||
// posts nothing, and shows no token counts, cache counts or cost.
|
||||
import { useState } from "preact/hooks";
|
||||
import { ApiErrorPanel } from "@hive/shared/api-error-panel.js";
|
||||
import { readApiError, type ProblemDetails } from "@hive/shared/api-error.js";
|
||||
import { Badge } from "@hive/shared/badge.js";
|
||||
import { Card } from "../../ui/card/Card.js";
|
||||
import { Panel } from "../../ui/panel/Panel.js";
|
||||
import {
|
||||
RefreshIntervalPicker,
|
||||
useRefreshInterval,
|
||||
type RefreshIntervalMs,
|
||||
} from "../../ui/refresh-interval/RefreshInterval.js";
|
||||
import { fetchJson, usePolled } from "../../ui/polled/usePolled.js";
|
||||
import { RelativeTime } from "../../ui/relative-time/RelativeTime.js";
|
||||
import { TryOutResult } from "../review-tryout/TryOutResult.js";
|
||||
import {
|
||||
|
|
@ -94,28 +93,13 @@ function RunCard({
|
|||
export function ReviewRuns() {
|
||||
const [intervalMs, setIntervalMs] =
|
||||
useState<RefreshIntervalMs>(DEFAULT_INTERVAL_MS);
|
||||
const [runs, setRuns] = useState<ClassifierRun[] | null>(null);
|
||||
const [error, setError] = useState<ProblemDetails | null>(null);
|
||||
const { data: runs, error } = usePolled(intervalMs, (signal) =>
|
||||
fetchJson<ClassifierRun[]>(RUNS, signal),
|
||||
);
|
||||
// Which cards are expanded. Survives a refresh, so a list that updates
|
||||
// under you does not fold the card you are reading.
|
||||
const [open, setOpen] = useState<ReadonlySet<string>>(new Set());
|
||||
|
||||
async function load() {
|
||||
try {
|
||||
const res = await fetch(RUNS);
|
||||
if (!res.ok) {
|
||||
setError(await readApiError(res));
|
||||
return;
|
||||
}
|
||||
setRuns((await res.json()) as ClassifierRun[]);
|
||||
setError(null);
|
||||
} catch (e: unknown) {
|
||||
setError({ detail: String(e) });
|
||||
}
|
||||
}
|
||||
|
||||
useRefreshInterval(intervalMs, () => void load());
|
||||
|
||||
function toggle(id: string) {
|
||||
setOpen((cur) => {
|
||||
const next = new Set(cur);
|
||||
|
|
|
|||
Loading…
Reference in a new issue