milestone 26: upstream health answers for the selected period

admin/src/features/dashboard/DashboardPage.test.tsx

@@ -5,6 +5,9 @@ import { AuthProvider } from "@/auth/store";
 import { createQueryClient } from "@/lib/queryClient";
 import { createAppRouter } from "@/routes";
 
+/** Wall clock at import; the upstream fixtures date their failures against it. */
+const NOW_S = Math.floor(Date.now() / 1000);
+
 const RESPONSES: Record<string, unknown> = {
 	"/api/stats?period=24h": {
 		period: "24h",
@@ -59,31 +62,65 @@ const RESPONSES: Record<string, unknown> = {
 		refreshes_gated: 0,
 		snapshot_generation: 3,
 	},
-	"/api/upstream/health": {
+	"/api/upstream/health?period=24h": {
+		period: "24h",
+		since: NOW_S - 86_400,
+		until: NOW_S,
+		available: 1,
+		total: 2,
+		complete: true,
 		upstreams: [
 			{
 				url: "https://dns.example/dns-query",
 				enabled: true,
 				available: false,
-				consecutive_failures: 4,
-				total_successes: 90,
-				total_failures: 10,
-				success_rate: 0.9,
-				last_error: "timeout",
+				period: {
+					attempts: 100,
+					successes: 90,
+					failures: 10,
+					success_rate: 0.9,
+					// 3h30m before the fixture's now, far from a unit boundary.
+					last_failure_at: NOW_S - 12_600,
+					last_failure_error: "timeout",
+				},
 			},
 			{
 				url: "udp://9.9.9.9:53",
 				enabled: true,
 				available: true,
-				consecutive_failures: 0,
-				total_successes: 100,
-				total_failures: 0,
-				success_rate: 1,
-				last_error: "",
+				period: {
+					attempts: 100,
+					successes: 100,
+					failures: 0,
+					success_rate: 1,
+					last_failure_at: null,
+					last_failure_error: null,
+				},
 			},
 		],
+	},
+	"/api/upstream/health?period=1h": {
+		period: "1h",
+		since: NOW_S - 3600,
+		until: NOW_S,
 		available: 1,
-		total: 2,
+		total: 1,
+		complete: true,
+		upstreams: [
+			{
+				url: "https://dns.example/dns-query",
+				enabled: true,
+				available: true,
+				period: {
+					attempts: 7,
+					successes: 6,
+					failures: 1,
+					success_rate: 6 / 7,
+					last_failure_at: NOW_S - 300,
+					last_failure_error: "timeout",
+				},
+			},
+		],
 	},
 	"/api/version": { version: "0.0.0-test", git_commit: "0000000", zig_version: "0.16.0", uptime_seconds: 1 },
 };
@@ -142,7 +179,7 @@ test("dashboard renders stats, chart, disk card, upstream table and health banne
 	expect(screen.getByRole("img", { name: /queries over time/i })).toBeTruthy();
 	expect(screen.getByText("Blocked", { selector: "li" })).toBeTruthy();
 
-	expect(screen.getByText("Disk")).toBeTruthy();
+	expect(screen.getByText("Storage now")).toBeTruthy();
 	expect(screen.getByText("warn")).toBeTruthy();
 	expect(screen.getAllByText("400.0 MiB").length).toBeGreaterThan(0);
 	expect(screen.getByText("12.0 MiB")).toBeTruthy();
@@ -155,10 +192,32 @@ test("dashboard renders stats, chart, disk card, upstream table and health banne
 	expect(screen.getByText("https://dns.example/dns-query")).toBeTruthy();
 	expect(screen.getByText("90.0%")).toBeTruthy();
 	expect(screen.getByText("100.0%")).toBeTruthy();
-	expect(screen.getByText("timeout")).toBeTruthy();
+	expect(screen.getByText("timeout · 3h ago")).toBeTruthy();
 	expect(screen.getByText("1/2 available")).toBeTruthy();
 });
 
+test("live state is labeled on its own card, not by a section that disowns the picker", async () => {
+	renderDashboard();
+	await screen.findByRole("heading", { name: "Dashboard" });
+
+	expect(screen.getByText("Storage now")).toBeTruthy();
+	expect(screen.queryByRole("region", { name: "Right now" })).toBeNull();
+	expect(screen.queryByText("Right now")).toBeNull();
+	expect(screen.queryByText("Snapshot state; the period above does not apply.")).toBeNull();
+});
+
+test("the period picker rescopes the upstream table", async () => {
+	renderDashboard();
+	await screen.findByRole("heading", { name: "Dashboard" });
+	await screen.findByText("90.0%");
+
+	fireEvent.click(screen.getByRole("button", { name: "1h" }));
+
+	await screen.findByText("85.7%");
+	expect(screen.getByRole("columnheader", { name: "Selected period · 1h" })).toBeTruthy();
+	expect(screen.queryByText("90.0%")).toBeNull();
+});
+
 test("period picker refetches stats and shows the empty chart state", async () => {
 	renderDashboard();
 	await screen.findByRole("heading", { name: "Dashboard" });
@@ -173,7 +232,7 @@ test("period picker refetches stats and shows the empty chart state", async () =
 });
 
 test("one failing endpoint degrades its own widget on cold navigation", async () => {
-	failing.add("/api/upstream/health");
+	failing.add("/api/upstream/health?period=24h");
 	renderDashboard();
 	await screen.findByRole("heading", { name: "Dashboard" });
 
@@ -184,6 +243,6 @@ test("one failing endpoint degrades its own widget on cold navigation", async ()
 
 	expect(screen.getByText("1,000")).toBeTruthy();
 	expect(screen.getByRole("img", { name: /queries over time/i })).toBeTruthy();
-	expect(screen.getByText("Disk")).toBeTruthy();
+	expect(screen.getByText("Storage now")).toBeTruthy();
 	expect(screen.queryByText("https://dns.example/dns-query")).toBeNull();
 });