Gates / frontend (push) Successful in 1m57s
Gates / test (push) Successful in 2m34s
Gates / test-aarch64 (push) Successful in 8m9s
Gates / package (push) Successful in 7m14s
Gates / container (push) Successful in 17s
CI / gates (push) Successful in 18m17s
Release / guard (push) Successful in 33s
Gates / test-aarch64 (push) Successful in 7m22s
Gates / container (push) Successful in 11s
Release / gates (push) Successful in 10m35s
Gates / frontend (push) Successful in 2m8s
Gates / test (push) Successful in 2m16s
Gates / package (push) Successful in 44s
Release / publish (push) Successful in 10m4s
The Overview page takes the decided visual language (specs/ui-visual-redesign.md): four centred totals with their Activity links, a smoothed area chart of total and blocked queries with point hover and a tooltip centred beside the point, a stacked client chart in eight distinct hues plus one Other band that is always a series, and a card row with the cache hit rate, the query types as a single-hue ramp ring, and the upstream breakdown. The count axis grows its margin with the widest grouped tick and draws whole-number ticks only. GET /api/overview takes a client parameter; the scoped read uses idx_query_log_ts and the cache keeps scoped slots. The device selector beside the period selector is URL state, so a scoped view is a link, and the tile links carry the scope into Activity. The route reduces a pasted IPv6 scope to the RFC 5952 spelling the logger stores, mapped addresses included, and drops anything that is not an address. A failed device list says so under the selector with a retry. All measured quantities go through admin/src/lib/format.ts: grouped counts, two-decimal percentages, one-decimal rates, durations as the two largest nonzero units. Identifiers, configured values and preset labels render as written; the module header states that scope. A sweep test refuses toFixed, toLocaleString, Intl.NumberFormat and padStart anywhere else. Chrome: one 4px radius from the metrics constants, shared Card with a prominent title and a one-line description on every panel, the settings form sections on the same card with a floated legend, the sidebar grouped into Monitoring and System with a status block (protection, queries per minute on Overview, uptime), keyboard-focusable table scroll wrappers, and the accent darkened to 5.43:1 on its wash. Not built: the spec's ranked-list primitive, which has no consumer and no API rows. Codex reviewed sessions B to D over five rounds (thirty-three findings fixed, thirteen rejected as non-quantities); the owner skipped a sixth round. Claude-Session: https://claude.ai/code/session_01VTgx3a1zz1R78o4K55kkwR
35 lines
1.6 KiB
TypeScript
35 lines
1.6 KiB
TypeScript
/**
|
|
* One period, one request, one window.
|
|
*
|
|
* The five per-panel endpoints this replaces could each answer for a different
|
|
* span, so the page had to reconcile five window identities, retry the laggards
|
|
* and fail the ones that stayed behind. `GET /api/overview` answers every panel
|
|
* out of a single read transaction: the totals, both timelines and both
|
|
* breakdowns describe the same span and the same database state by construction,
|
|
* and none of that reconciliation has anything left to reconcile.
|
|
*
|
|
* The query key carries the period and the client, so the body the hook
|
|
* returns is always the body of the scope the toolbar names. A rescope shows
|
|
* the loading state until its own answer lands rather than the previous
|
|
* scope's charts under the new label: a complete, self-consistent body for the
|
|
* wrong device is still the wrong body.
|
|
*/
|
|
|
|
import { useCallback } from "react";
|
|
import { useQuery } from "@tanstack/react-query";
|
|
import { overviewQuery } from "@/lib/queries";
|
|
import type { Overview, Period } from "@/lib/types";
|
|
|
|
export type Panel<T> =
|
|
{ status: "loading" } | { status: "error"; error: unknown; retry: () => void } | { status: "ready"; data: T };
|
|
|
|
export function useOverviewWindow(period: Period, client: string | undefined): Panel<Overview> {
|
|
const query = useQuery(overviewQuery(period, client));
|
|
const { refetch } = query;
|
|
const retry = useCallback(() => void refetch(), [refetch]);
|
|
|
|
if (query.isError) return { status: "error", error: query.error, retry };
|
|
if (query.data !== undefined) return { status: "ready", data: query.data };
|
|
return { status: "loading" };
|
|
}
|