feat(dashboard): extract 152+ hardcoded aria-labels to i18n (batch 3)

- Replace hardcoded aria-label strings with t('aria.keyName') across 70 files
- Add useT mock to test setup with English catalog resolution + param substitution
- Add missing catalog keys: aria.searchPipelines, pipelines.sortBy
- Fix PipelinesPage: use searchPipelines instead of searchSessions
- Fix test assertions: update static analysis patterns for i18n keys
- Update OverviewPage test mock to resolve from catalog
- TSC clean, 128 test files pass, build green

Refs: #3229

Author: OneStepAt4time

dashboard/src/__tests__/AuditPage.test.tsx

@@ -226,7 +226,7 @@ describe('AuditPage', () => {
       expect(screen.getByText('Page 1 of 2')).toBeDefined();
     });
 
-    await act(async () => { fireEvent.click(screen.getByLabelText('Next page')); });
+    await act(async () => { fireEvent.click(screen.getByLabelText('Go to next page')); });
 
     await waitFor(() => {
       expect(mockFetchAuditLogs).toHaveBeenLastCalledWith(expect.objectContaining({

dashboard/src/__tests__/LiveTerminal.test.tsx

@@ -13,7 +13,7 @@ const src = readFileSync(resolve(__dirname, '../components/session/LiveTerminal.
 
 describe('LiveTerminal — streaming failure UX (issue #2347)', () => {
   it('failure detail banner has accessible retry button', () => {
-    expect(src).toContain('aria-label="Retry terminal connection"');
+    expect(src).toContain('aria-label={t("aria.retryTerminal")}');
   });
 
   it('failure banner mentions transcript and metrics fallback', () => {

dashboard/src/__tests__/OverviewPage.test.tsx

@@ -29,10 +29,20 @@ vi.mock('../store/useStore', () => ({
   useStore: vi.fn((sel: (s: Record<string, unknown>) => unknown) => sel({ sseError: null })),
 }));
 
-// Mock i18n
-vi.mock('../i18n/context', () => ({
-  useT: () => (key: string) => key,
-}));
+// Mock i18n — resolves keys from the English catalog
+vi.mock('../i18n/context', async () => {
+  const { en } = await import('../i18n/en');
+  const catalog: Record<string, string> = {};
+  const flatten = (obj: any, prefix: string) => {
+    for (const [k, v] of Object.entries(obj)) {
+      const key = prefix ? prefix + '.' + k : k;
+      if (typeof v === 'string') catalog[key] = v;
+      else if (typeof v === 'object' && v !== null) flatten(v, key);
+    }
+  };
+  flatten(en, '');
+  return { useT: () => (key: string) => catalog[key] || key };
+});
 
 // Mock child components
 vi.mock('../components/overview/HomeStatusPanel', () => ({
@@ -58,7 +68,7 @@ describe('OverviewPage (CCMeter redesign)', () => {
 
   it('renders page title', () => {
     render(<OverviewPage />);
-    expect(screen.getByText('overview.title')).not.toBeNull();
+    expect(screen.getByText('Overview')).not.toBeNull();
   });
 
   it('renders New Session button', () => {

dashboard/src/__tests__/TerminalPassthrough.test.tsx

@@ -20,7 +20,7 @@ describe('TerminalPassthrough', () => {
 
   describe('streaming failure UX (issue #2347)', () => {
     it('failure detail banner has accessible retry button', () => {
-      expect(src).toContain('aria-label="Retry terminal connection"');
+      expect(src).toContain('aria.retryTerminal');
     });
 
     it('failure banner mentions transcript and metrics fallback', () => {

dashboard/src/__tests__/i18n-integration.test.tsx

@@ -3,6 +3,9 @@
  */
 
 import { describe, it, expect, vi, beforeEach } from 'vitest';
+// Needs real useT — override global mock
+vi.unmock("../i18n/context");
+
 vi.mock('../utils/logger', () => ({
   logger: { debug: vi.fn(), info: vi.fn(), warn: vi.fn(), error: vi.fn() },
 }));

dashboard/src/__tests__/setup.ts

@@ -64,3 +64,42 @@ vi.mock('../../api/resilient-websocket', () => ({
   }),
 }));
 
+
+// Safe useT mock: resolves i18n keys using the English catalog.
+// Returns a stable function reference to avoid re-render loops.
+vi.mock('../i18n/context', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('../i18n/context')>();
+  let enObj: any = {};
+  try {
+    const mod = await vi.importActual<typeof import('../i18n/en')>('../i18n/en');
+    enObj = (mod as any).en || (mod as any).default || mod;
+  } catch {
+    // Fallback: empty catalog
+  }
+
+  const catalog: Record<string, string> = {};
+  const flatten = (obj: any, prefix: string) => {
+    for (const [k, v] of Object.entries(obj)) {
+      const key = prefix ? prefix + '.' + k : k;
+      if (typeof v === 'string') catalog[key] = v;
+      else if (typeof v === 'object' && v !== null) flatten(v, key);
+    }
+  };
+  flatten(enObj, '');
+
+  const stableT = (key: string, params?: Record<string, string | number>): string => {
+    let val = catalog[key] || key;
+    if (params) {
+      Object.entries(params).forEach(([k, v]) => {
+        val = val.replace(new RegExp(`\\{${k}\\}`, 'g'), String(v));
+      });
+    }
+    return val;
+  };
+
+  return {
+    ...actual,
+    useT: () => stableT,
+    I18nProvider: actual.I18nProvider,
+  };
+});

dashboard/src/__tests__/touch-targets.test.ts

@@ -21,7 +21,7 @@ describe('Mobile touch targets (issue #2350)', () => {
     const lines = src.split('\n');
     let found = false;
     for (let i = 0; i < lines.length; i++) {
-      if (lines[i].includes("aria.newSession") || lines[i].includes('aria-label="New Session')) {
+      if (lines[i].includes('aria.newSessionCmd')) {
         // Search within 5 lines in both directions for className with min-h
         for (let j = Math.max(0, i - 5); j <= Math.min(lines.length - 1, i + 5); j++) {
           if (lines[j].includes('className="') && lines[j].includes('min-h-[44px]')) {

dashboard/src/components/ConfirmDialog.tsx

@@ -103,7 +103,7 @@ export function ConfirmDialog({
           <button
             type="button"
             onClick={onCancel}
-            className="flex-1 min-h-[44px] px-3 py-2 text-xs font-medium rounded bg-[var(--color-void)] border border-[var(--color-void-lighter)] text-[var(--color-text-primary)] hover:text-[var(--color-text-primary)] hover:border-[#333] transition-colors"
+            className="flex-1 min-h-[44px] px-3 py-2 text-xs font-medium rounded bg-[var(--color-void)] border border-[var(--color-void-lighter)] text-[var(--color-text-primary)] hover:text-[var(--color-text-primary)] hover:border-muted transition-colors"
           >
             {cancelLabel}
           </button>

dashboard/src/components/CreatePipelineModal.tsx

@@ -2,12 +2,12 @@
  * components/CreatePipelineModal.tsx — Modal dialog for creating new pipelines.
  */
 
-import { useState, useEffect, useRef, useCallback } from 'react'
-import { useT } from '../i18n/context';
+import { useState, useEffect, useRef, useCallback } from 'react';
 import { useFocusTrap } from '../hooks/useFocusTrap';
 import { useNavigate } from 'react-router-dom';
 import { X, Loader2, Plus, Trash2 } from 'lucide-react';
 import { createPipeline } from '../api/client';
+import { useT } from '../i18n/context';
 
 interface CreatePipelineModalProps {
   open: boolean;
@@ -120,11 +120,11 @@ export default function CreatePipelineModal({ open, onClose }: CreatePipelineMod
     <div className="fixed inset-0 z-50 flex items-center justify-center">
       <div className="absolute inset-0 bg-black/60 backdrop-blur-sm" onClick={handleClose} />
 
-      <div ref={trapRef} role="dialog" aria-modal="true" aria-label={t('aria.createNewPipeline')} className="relative w-full max-w-2xl mx-4 bg-[var(--color-surface)] border border-[var(--color-void-lighter)] rounded-lg shadow-2xl max-h-[90vh] overflow-y-auto">
+      <div ref={trapRef} role="dialog" aria-modal="true" aria-label={t("aria.createNewPipeline")} className="relative w-full max-w-2xl mx-4 bg-[var(--color-surface)] border border-[var(--color-void-lighter)] rounded-lg shadow-2xl max-h-[90vh] overflow-y-auto">
         {/* Header */}
         <div className="flex items-center justify-between px-4 sm:px-5 py-4 border-b border-[var(--color-void-lighter)]">
           <h2 className="text-sm font-semibold text-[var(--color-text-primary)]">New Pipeline</h2>
-          <button aria-label={t('aria.close')}
+          <button aria-label={t("aria.close")}
             onClick={handleClose}
             className="min-h-[44px] min-w-[44px] flex items-center justify-center text-[var(--color-text-muted)] hover:text-[var(--color-text-primary)] transition-colors"
           >
@@ -144,7 +144,7 @@ export default function CreatePipelineModal({ open, onClose }: CreatePipelineMod
               value={pipelineName}
               onChange={(e) => setPipelineName(e.target.value)}
               placeholder="my-pipeline"
-              aria-label={t('aria.pipelineName')}
+              aria-label={t("aria.pipelineName")}
               className="w-full min-h-[44px] px-3 py-2.5 text-sm bg-[var(--color-void)] border border-[var(--color-void-lighter)] rounded text-[var(--color-text-primary)] placeholder-[var(--color-text-muted)] focus:outline-none focus:border-[var(--color-accent)]"
             />
           </div>

dashboard/src/components/CreateSessionModal.tsx

@@ -2,13 +2,13 @@
  * components/CreateSessionModal.tsx — Modal dialog for creating new sessions.
  */
 
-import { useState, useEffect, useRef, useCallback } from 'react'
-import { useT } from '../i18n/context';
+import { useState, useEffect, useRef, useCallback } from 'react';
 import { useFocusTrap } from '../hooks/useFocusTrap';
 import { useNavigate } from 'react-router-dom';
 import { X, Loader2, Plus, Trash2 } from 'lucide-react';
 import { createSession, batchCreateSessions, getTemplates } from '../api/client';
 import type { SessionTemplate } from '../types';
+import { useT } from '../i18n/context';
 
 interface CreateSessionModalProps {
   open: boolean;
@@ -194,7 +194,7 @@ export default function CreateSessionModal({ open, onClose }: CreateSessionModal
       />
 
       {/* Modal */}
-      <div ref={trapRef} role="dialog" aria-modal="true" aria-label={t('aria.createNewSession')} className={`relative w-full ${mode === 'batch' ? 'max-w-2xl' : 'max-w-md'} mx-4 bg-[var(--color-surface)] border border-[var(--color-void-lighter)] rounded-lg shadow-2xl max-h-[90vh] overflow-y-auto`}>
+      <div ref={trapRef} role="dialog" aria-modal="true" aria-label={t("aria.createNewSession")} className={`relative w-full ${mode === 'batch' ? 'max-w-2xl' : 'max-w-md'} mx-4 bg-[var(--color-surface)] border border-[var(--color-void-lighter)] rounded-lg shadow-2xl max-h-[90vh] overflow-y-auto`}>
         {/* Header */}
         <div className="flex items-center justify-between px-4 sm:px-5 py-4 border-b border-[var(--color-void-lighter)]">
           <div className="flex items-center gap-4">
@@ -237,7 +237,7 @@ export default function CreateSessionModal({ open, onClose }: CreateSessionModal
               )}
             </div>
           </div>
-          <button aria-label={t('aria.close')}
+          <button aria-label={t("aria.close")}
             onClick={handleClose}
             className="min-h-[44px] min-w-[44px] flex items-center justify-center text-[var(--color-text-muted)] hover:text-[var(--color-text-primary)] transition-colors"
           >
@@ -390,7 +390,7 @@ export default function CreateSessionModal({ open, onClose }: CreateSessionModal
                 <button
                   type="button"
                   onClick={() => removeBatchRow(i)}
-                  aria-label={t('aria.removeRow')}
+                  aria-label={t("aria.removeRow")}
                   disabled={batchRows.length <= 1}
                   className="min-h-[44px] min-w-[44px] flex items-center justify-center text-[var(--color-text-muted)] hover:text-[var(--color-error)] transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
                 >