test(dashboard): fix useToast mocks + SettingsModal CSS token regex (shard 4)

packages/dashboard/app/components/__tests__/SettingsModal.workflow-model-lane-css.test.ts

@@ -19,6 +19,11 @@ describe("SettingsModal workflow model lane CSS contract", () => {
   it("keeps the workflow model action row usable at the mobile breakpoint", async () => {
     const css = await loadAllAppCss();
 
-    expect(css).toMatch(/@media[^{}]*\(max-width:\s*768px\)[\s\S]*?\.settings-model-lane-actions\s*\{[^}]*align-items\s*:\s*stretch;[^}]*flex-direction\s*:\s*column;[^}]*padding-inline\s*:\s*calc\(var\(--space-md\) \+ var\(--space-xs\) \/ 2\);[^}]*\}/);
+    // FNXC:SettingsModalMobile 2026-07-11-00:00: FN-7785 (commit 4d4e9ad5c, "reduce margin and padding across
+    // mobile Settings pages") replaced this rule's mobile padding-inline: calc(...) with a tokenized shorthand
+    // `padding: var(--space-sm) var(--space-sm) var(--space-md)`. The layout contract this test pins — the
+    // action row stacks vertically (flex-direction: column) and stretches items (align-items: stretch) — is
+    // unchanged; only the padding token changed. Sibling settings-mobile.test.tsx asserts the same new value.
+    expect(css).toMatch(/@media[^{}]*\(max-width:\s*768px\)[\s\S]*?\.settings-model-lane-actions\s*\{[^}]*align-items\s*:\s*stretch;[^}]*flex-direction\s*:\s*column;[^}]*padding\s*:\s*var\(--space-sm\)\s+var\(--space-sm\)\s+var\(--space-md\);[^}]*\}/);
   });
 });

packages/dashboard/app/components/__tests__/TaskCard-TaskChangesTab-parity.test.tsx

@@ -59,6 +59,19 @@ vi.mock("../../hooks/useBadgeWebSocket", () => ({
 vi.mock("../../hooks/useBatchBadgeFetch", () => ({ getFreshBatchData: vi.fn(() => null) }));
 vi.mock("../../utils/highlightDiff", () => ({ highlightDiff: (diff: string) => diff }));
 vi.mock("../../hooks/useConfirm", () => ({ useConfirm: () => ({ confirm: vi.fn() }) }));
+/*
+FNXC:RuntimeFallbackUI 2026-07-11-00:00:
+RuntimeFallbackBadge (commit 0bed997af / FUX-022) calls the shared useToast() hook directly. TaskCard
+embeds RuntimeFallbackBadge and this file renders <TaskCard> outside a ToastProvider, so mock the hook
+to avoid "useToast must be used within ToastProvider", matching the TaskCard.test.tsx pattern.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 function makeTask(overrides: Partial<Task>): Task {
   return {

packages/dashboard/app/components/__tests__/TaskCard.footer-alignment.test.tsx

@@ -49,6 +49,19 @@ vi.mock("../../api", () => ({
 vi.mock("../../hooks/useConfirm", () => ({
   useConfirm: () => ({ confirm: vi.fn(async () => true) }),
 }));
+/*
+FNXC:RuntimeFallbackUI 2026-07-11-00:00:
+RuntimeFallbackBadge (commit 0bed997af / FUX-022) calls the shared useToast() hook directly. TaskCard
+embeds RuntimeFallbackBadge and this file renders <TaskCard> outside a ToastProvider, so mock the hook
+to avoid "useToast must be used within ToastProvider", matching the TaskCard.test.tsx pattern.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 const noop = () => {};
 

packages/dashboard/app/components/__tests__/TaskCard.oversight.test.tsx

@@ -68,6 +68,19 @@ vi.mock("../../api", () => ({
 vi.mock("../../hooks/useConfirm", () => ({
   useConfirm: () => ({ confirm: vi.fn(), confirmWithChoice: vi.fn() }),
 }));
+/*
+FNXC:RuntimeFallbackUI 2026-07-11-00:00:
+RuntimeFallbackBadge (commit 0bed997af / FUX-022) calls the shared useToast() hook directly. TaskCard
+embeds RuntimeFallbackBadge and this file renders <TaskCard> outside a ToastProvider, so mock the hook
+to avoid "useToast must be used within ToastProvider", matching the TaskCard.test.tsx pattern.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 function makeTask(overrides: Partial<Task> = {}): Task {
   return {

packages/dashboard/app/components/__tests__/agents-view-mobile.test.tsx

@@ -49,6 +49,19 @@ vi.mock("../../api", () => ({
   fetchSettings: vi.fn(() => Promise.resolve({ heartbeatMultiplier: 1 })),
   updateSettings: vi.fn(() => Promise.resolve({})),
 }));
+/*
+FNXC:RuntimeFallbackUI 2026-07-11-00:00:
+RuntimeFallbackBadge (commit 0bed997af / FUX-022) calls the shared useToast() hook directly. AgentsView embeds
+RuntimeFallbackBadge per agent card, and this file renders <AgentsView> outside a ToastProvider. Without the mock
+the badge throw unmounts the tree (buttons/labels vanish), so mock the hook like TaskCard.test.tsx does.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 import {
   fetchAgents,

packages/dashboard/app/components/__tests__/step-number-alignment.test.tsx

@@ -36,6 +36,19 @@ vi.mock("../../api", () => ({
 vi.mock("../../hooks/useLiveTranscript", () => ({
   useLiveTranscript: () => ({ entries: [], isConnected: true }),
 }));
+/*
+FNXC:TaskStepNumbering 2026-07-11-00:00:
+RuntimeFallbackBadge (added in commit 0bed997af / FUX-022) calls the shared useToast() hook directly.
+This file renders <ActiveAgentsPanel> (which embeds RuntimeFallbackBadge) outside a ToastProvider, so
+mock the hook to avoid "useToast must be used within ToastProvider" failures, matching the TaskCard.test.tsx pattern.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 /**
  * Derives the Activity-tab's step number the way an operator would read it —

packages/dashboard/app/components/__tests__/utility-mobile.test.tsx

@@ -14,6 +14,19 @@ vi.mock("../../hooks/useLiveTranscript", () => ({
     isConnected: false,
   })),
 }));
+/*
+FNXC:RuntimeFallbackUI 2026-07-11-00:00:
+RuntimeFallbackBadge (commit 0bed997af / FUX-022) calls the shared useToast() hook directly.
+ActiveAgentsPanel embeds RuntimeFallbackBadge and this file renders it outside a ToastProvider, so mock
+the hook to avoid "useToast must be used within ToastProvider", matching the TaskCard.test.tsx pattern.
+*/
+vi.mock("../../hooks/useToast", () => ({
+  useToast: () => ({
+    addToast: vi.fn(),
+    removeToast: vi.fn(),
+    toasts: [],
+  }),
+}));
 
 import { useExecutorStats } from "../../hooks/useExecutorStats";
 import { BackgroundTasksIndicator } from "../BackgroundTasksIndicator";