feat: the redesigned Event Clock

The new reader app replaces the old UI: Checklist with a rail (focus pills, Next to expire, today's dailies, pinned routines), Timeline in a new and a classic look, Routines, Archive and a Settings area, in a Structured (default) and a Relaxed interface. It follows the approved Round 6 B and Round 7 mockups, corrected screen by screen with the owner. Reader data moves to a v2 store (gacha-tracker:v2:*). Existing v1 data is migrated on first load, a recovery copy is written first, and the v1 keys are never removed, so a rollback finds them unchanged. Redeem codes for Genshin arrive as their own feed. Also: live's urgency ramp, editable per theme; completion and section-complete fireworks; a returning-user tour; the design mockups, specs, plans, reviews and handoff record. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-18 01:55:16 +02:00
parent ddd9673f86
commit 50c6e91b00
284 changed files with 45100 additions and 1628 deletions
@@ -0,0 +1,77 @@
+import { expect, test } from "bun:test";
+import { renderToStaticMarkup as render } from "react-dom/server";
+import {
+  AppNavigation,
+  mainViewPatch,
+} from "../src/client/components/redesign/AppNavigation.tsx";
+import { SettingsLayout } from "../src/client/components/redesign/SettingsLayout.tsx";
+import { ChangelogPage } from "../src/client/components/redesign/ChangelogPage.tsx";
+
+test("utility pages do not replace the reader's preferred main view", () => {
+  expect(mainViewPatch("settings")).toEqual({});
+  expect(mainViewPatch("archive")).toEqual({});
+  expect(mainViewPatch("timeline")).toEqual({ view: "timeline" });
+  const html = render(<AppNavigation page="settings" onPage={() => {}} />);
+  for (const label of [
+    "Checklist",
+    "Timeline",
+    "Routines",
+    "Archive",
+    "Settings",
+  ])
+    expect(html).toContain(label);
+  expect(html).toContain('aria-current="page"');
+});
+test("settings has named navigation and one content region", () => {
+  const html = render(
+    <SettingsLayout page="appearance" onPage={() => {}}>
+      <p>Appearance controls</p>
+    </SettingsLayout>,
+  );
+  expect(html).toContain('aria-label="Settings pages"');
+  expect(html).toContain("Appearance controls");
+  expect(html).toContain("Changelog");
+});
+test("changelog page has release content without a scrim or modal", () => {
+  const html = render(
+    <ChangelogPage
+      notes={[]}
+      entries={[
+        {
+          id: "test",
+          date: "2026-10-16",
+          title: "A real entry",
+          kind: "feature",
+          ref: "abcdef1",
+        },
+      ]}
+    />,
+  );
+  expect(html).toContain("A real entry");
+  expect(html).not.toContain('role="dialog"');
+  expect(html).not.toContain("Close changelog");
+});
+import { NextUp } from "../src/client/components/NextUp.tsx";
+import { clockFor } from "../src/shared/time.ts";
+import { sampleEvent } from "./helpers/reader.ts";
+test("headline identifies the server when accounts share an event title", () => {
+  const html = render(
+    <NextUp
+      rows={[
+        {
+          event: sampleEvent,
+          clock: clockFor(
+            sampleEvent,
+            "asia",
+            Date.parse("2026-10-16T12:00:00Z"),
+          ),
+          accountId: "account:asia",
+          region: "asia",
+        },
+      ]}
+      focused={null}
+      onOpen={() => {}}
+    />,
+  );
+  expect(html).toContain("Asia");
+});