chore(web): address Copilot review on #2127

- Move REPLAYABLE_PROTOCOL_METHODS / isReplayableProtocolMethod out of
  components/groups/protocolUtils.ts into utils/replayableProtocolMethods.ts.
  It is a pure predicate over a string set, so by the project's own lib-vs-utils
  rule it never belonged under components/ — and keeping it there was what made
  lib/protocolReplay.ts import 'up' into the component graph. Both consumers now
  import from utils/; the predicate keeps its own test.

- Give replayProtocolRequest an exported ReplayClient = Pick<InspectorClient, ...>
  naming the nine methods it calls, so a caller (and the test) can satisfy the
  real contract instead of casting a stub into a whole client.

- Rebuild the protocolReplay fixtures as plain typed MessageEntry values. The
  double cast had been hiding a real defect: MessageEntry.timestamp is a Date
  and the fixture passed a number, so the assertion confirmed a shape
  messagesToLogEntries cannot produce.

- Replace the window casts in authToken.test.ts with Reflect.set /
  Reflect.deleteProperty. No 'as unknown as' remains in either test.

- Drop the stale 'floats top-right' sentence on ReAuthBannerBar, which moved
  verbatim and arrived contradicting the paragraph below it.

Declined: re-homing ReAuthBannerBar's transform/zIndex as a theme variant.
'styles' is the Styles API rather than an inline style, Mantine exposes neither
property as a prop, and a styling change is out of scope for a phase whose
safety argument is that nothing was edited.

Signed-off-by: cliffhall <cliff@futurescale.com>

clients/web/src/lib/authToken.test.ts

@@ -44,9 +44,7 @@ describe("getAuthToken", () => {
   beforeEach(() => {
     setSearch("");
     window.sessionStorage.clear();
-    delete (window as unknown as Record<string, unknown>)[
-      INSPECTOR_API_TOKEN_GLOBAL
-    ];
+    Reflect.deleteProperty(window, INSPECTOR_API_TOKEN_GLOBAL);
   });
 
   afterEach(() => {
@@ -54,14 +52,11 @@ describe("getAuthToken", () => {
     restoreSessionStorage();
     setSearch("");
     window.sessionStorage.clear();
-    delete (window as unknown as Record<string, unknown>)[
-      INSPECTOR_API_TOKEN_GLOBAL
-    ];
+    Reflect.deleteProperty(window, INSPECTOR_API_TOKEN_GLOBAL);
   });
 
   it("prefers the injected global and persists it", () => {
-    (window as unknown as Record<string, unknown>)[INSPECTOR_API_TOKEN_GLOBAL] =
-      "from-global";
+    Reflect.set(window, INSPECTOR_API_TOKEN_GLOBAL, "from-global");
     setSearch(`?${KEY}=from-url`);
     window.sessionStorage.setItem(KEY, "from-storage");
 
@@ -70,14 +65,12 @@ describe("getAuthToken", () => {
   });
 
   it("ignores a non-string or empty global and falls through to the URL", () => {
-    (window as unknown as Record<string, unknown>)[INSPECTOR_API_TOKEN_GLOBAL] =
-      "";
+    Reflect.set(window, INSPECTOR_API_TOKEN_GLOBAL, "");
     setSearch(`?${KEY}=from-url`);
 
     expect(getAuthToken()).toBe("from-url");
 
-    (window as unknown as Record<string, unknown>)[INSPECTOR_API_TOKEN_GLOBAL] =
-      123;
+    Reflect.set(window, INSPECTOR_API_TOKEN_GLOBAL, 123);
     expect(getAuthToken()).toBe("from-url");
     expect(window.sessionStorage.getItem(KEY)).toBe("from-url");
   });
@@ -96,8 +89,7 @@ describe("getAuthToken", () => {
       throw new Error("blocked");
     });
     stubSessionStorage({ setItem });
-    (window as unknown as Record<string, unknown>)[INSPECTOR_API_TOKEN_GLOBAL] =
-      "from-global";
+    Reflect.set(window, INSPECTOR_API_TOKEN_GLOBAL, "from-global");
 
     expect(getAuthToken()).toBe("from-global");
     expect(setItem).toHaveBeenCalledWith(KEY, "from-global");

clients/web/src/lib/protocolReplay.test.ts

@@ -1,16 +1,24 @@
 import { describe, expect, it, vi } from "vitest";
 import type { Tool } from "@modelcontextprotocol/client";
-import type { InspectorClient } from "@inspector/core/mcp/index.js";
 import type { MessageEntry } from "@inspector/core/mcp/types.js";
-import { messagesToLogEntries, replayProtocolRequest } from "./protocolReplay";
+import {
+  messagesToLogEntries,
+  replayProtocolRequest,
+  type ReplayClient,
+} from "./protocolReplay";
 
 describe("messagesToLogEntries", () => {
-  const notification = (method: string, params: unknown): MessageEntry =>
-    ({
-      direction: "notification",
-      timestamp: 1000,
-      message: { jsonrpc: "2.0", method, params },
-    }) as unknown as MessageEntry;
+  const at = new Date("2026-01-01T00:00:00Z");
+
+  const notification = (
+    method: string,
+    params: Record<string, unknown>,
+  ): MessageEntry => ({
+    id: `n-${method}`,
+    timestamp: at,
+    direction: "notification",
+    message: { jsonrpc: "2.0", method, params },
+  });
 
   it("keeps only notifications/message and carries the timestamp", () => {
     const entries = messagesToLogEntries([
@@ -18,49 +26,62 @@ describe("messagesToLogEntries", () => {
       notification("notifications/progress", { progress: 1 }),
     ]);
     expect(entries).toEqual([
-      { receivedAt: 1000, params: { level: "info", data: "hello" } },
+      { receivedAt: at, params: { level: "info", data: "hello" } },
     ]);
   });
 
   it("skips requests and responses", () => {
-    const request = {
+    const request: MessageEntry = {
+      id: "r-1",
+      timestamp: at,
       direction: "request",
-      timestamp: 1,
+      // A request frame carrying the same method — only `direction` should
+      // decide, so this must still be skipped.
       message: { jsonrpc: "2.0", id: 1, method: "notifications/message" },
-    } as unknown as MessageEntry;
-    const response = {
+    };
+    const response: MessageEntry = {
+      id: "r-2",
+      timestamp: at,
       direction: "response",
-      timestamp: 2,
       message: { jsonrpc: "2.0", id: 1, result: {} },
-    } as unknown as MessageEntry;
+    };
     expect(messagesToLogEntries([request, response])).toEqual([]);
   });
 
-  it("skips a notification carrying no method", () => {
-    const malformed = {
+  it("skips a frame labelled a notification that carries no method", () => {
+    // `direction` and the frame shape can disagree — the log records what
+    // arrived, so the `"method" in message` guard has to hold on its own.
+    const malformed: MessageEntry = {
+      id: "m-1",
+      timestamp: at,
       direction: "notification",
-      timestamp: 3,
-      message: { jsonrpc: "2.0", result: {} },
-    } as unknown as MessageEntry;
+      message: { jsonrpc: "2.0", id: 1, result: {} },
+    };
     expect(messagesToLogEntries([malformed])).toEqual([]);
   });
 });
 
 describe("replayProtocolRequest", () => {
-  const tool = { name: "echo", inputSchema: { type: "object" } } as Tool;
+  const tool: Tool = { name: "echo", inputSchema: { type: "object" } };
 
+  // Typed against `ReplayClient`, so the mock has to satisfy the same contract
+  // the function declares rather than being cast into a whole InspectorClient.
+  // Each mock is typed against the real method signature, so a drift in
+  // `InspectorClient` surfaces here rather than being absorbed by a cast. None
+  // of them needs a resolved value: `replayProtocolRequest` awaits the call and
+  // discards the result, so what is asserted is the dispatch, not the payload.
   function makeClient() {
     return {
-      callTool: vi.fn().mockResolvedValue({}),
-      getPrompt: vi.fn().mockResolvedValue({}),
-      readResource: vi.fn().mockResolvedValue({}),
-      listTools: vi.fn().mockResolvedValue({}),
-      listPrompts: vi.fn().mockResolvedValue({}),
-      listResources: vi.fn().mockResolvedValue({}),
-      listResourceTemplates: vi.fn().mockResolvedValue({}),
-      listRequestorTasks: vi.fn().mockResolvedValue({}),
-      ping: vi.fn().mockResolvedValue({}),
-    };
+      callTool: vi.fn<ReplayClient["callTool"]>(),
+      getPrompt: vi.fn<ReplayClient["getPrompt"]>(),
+      readResource: vi.fn<ReplayClient["readResource"]>(),
+      listTools: vi.fn<ReplayClient["listTools"]>(),
+      listPrompts: vi.fn<ReplayClient["listPrompts"]>(),
+      listResources: vi.fn<ReplayClient["listResources"]>(),
+      listResourceTemplates: vi.fn<ReplayClient["listResourceTemplates"]>(),
+      listRequestorTasks: vi.fn<ReplayClient["listRequestorTasks"]>(),
+      ping: vi.fn<ReplayClient["ping"]>(),
+    } satisfies ReplayClient;
   }
 
   const replay = (
@@ -68,13 +89,7 @@ describe("replayProtocolRequest", () => {
     method: string,
     params?: Record<string, unknown>,
     tools: Tool[] = [tool],
-  ) =>
-    replayProtocolRequest(
-      client as unknown as InspectorClient,
-      method,
-      params,
-      tools,
-    );
+  ) => replayProtocolRequest(client, method, params, tools);
 
   it("refuses a method outside the shared replayable set", async () => {
     const client = makeClient();
@@ -153,7 +168,7 @@ describe("replayProtocolRequest", () => {
     expect(client[fn]).toHaveBeenCalledWith("page-2");
   });
 
-  it("passes no cursor when the entry carried none", async () => {
+  it("passes no cursor when the entry carried none, or carried a non-string", async () => {
     const client = makeClient();
     await expect(replay(client, "tools/list", undefined)).resolves.toBeNull();
     expect(client.listTools).toHaveBeenCalledWith(undefined);

clients/web/src/lib/protocolReplay.ts

@@ -5,8 +5,11 @@ import type {
 import type { InspectorClient } from "@inspector/core/mcp/index.js";
 import type { JsonValue } from "@inspector/core/mcp/index.js";
 import type { MessageEntry } from "@inspector/core/mcp/types.js";
+// Type-only, so this creates no runtime edge into `components/` and the
+// `components → lib → utils` direction still holds: `LogEntryData` is the shape
+// the Logs screen renders, and this module exists to produce exactly that.
 import type { LogEntryData } from "../components/elements/LogEntry/LogEntry";
-import { isReplayableProtocolMethod } from "../components/groups/protocolUtils.js";
+import { isReplayableProtocolMethod } from "../utils/replayableProtocolMethods";
 
 // Derive `LogEntryData[]` from the MessageLog by filtering for the
 // `notifications/message` notifications the server emits in response to
@@ -37,8 +40,26 @@ export function messagesToLogEntries(messages: MessageEntry[]): LogEntryData[] {
 // intentionally does NOT touch the Tools/Prompts/Resources panels. Returns a
 // human-readable reason when the entry can't be replayed (unsupported method,
 // or a tool that's no longer present), or null on a dispatched replay.
+/**
+ * The slice of `InspectorClient` a replay actually reaches. Naming it — rather
+ * than taking the whole client — is what lets a caller (and a test) supply a
+ * value that satisfies the real contract instead of casting one in.
+ */
+export type ReplayClient = Pick<
+  InspectorClient,
+  | "callTool"
+  | "getPrompt"
+  | "readResource"
+  | "listTools"
+  | "listPrompts"
+  | "listResources"
+  | "listResourceTemplates"
+  | "listRequestorTasks"
+  | "ping"
+>;
+
 export async function replayProtocolRequest(
-  client: InspectorClient,
+  client: ReplayClient,
   method: string,
   params: Record<string, unknown> | undefined,
   tools: Tool[],