docs: enterprise refactor plan with ralph specs

frontend/src/__tests__/AnomalyList.test.tsx

@@ -0,0 +1,77 @@
+import { describe, it, expect } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { MemoryRouter } from 'react-router-dom';
+import { AnomalyList } from '../components/AnomalyList';
+import type { AnomalySummary } from '../types';
+
+function makeAnomaly(overrides: Partial<AnomalySummary> = {}): AnomalySummary {
+  return {
+    id: 'anom_1',
+    type: 'http_error',
+    severity: 'high',
+    description: 'HTTP 500 on form submit',
+    timestamp: 1000000,
+    ...overrides,
+  };
+}
+
+function renderList(anomalies: AnomalySummary[]) {
+  return render(
+    <MemoryRouter>
+      <AnomalyList anomalies={anomalies} title="Test Anomalies" />
+    </MemoryRouter>
+  );
+}
+
+describe('AnomalyList', () => {
+  it('renders title', () => {
+    renderList([]);
+    expect(screen.getByText('Test Anomalies')).toBeDefined();
+  });
+
+  it('shows empty state when no anomalies', () => {
+    renderList([]);
+    expect(screen.getByText(/no anomalies/i)).toBeDefined();
+  });
+
+  it('renders anomaly cards', () => {
+    renderList([makeAnomaly(), makeAnomaly({ id: 'anom_2', description: 'Another error' })]);
+    expect(screen.getByText('HTTP 500 on form submit')).toBeDefined();
+    expect(screen.getByText('Another error')).toBeDefined();
+  });
+
+  it('filters by severity when severity button is clicked', async () => {
+    const user = userEvent.setup();
+    renderList([
+      makeAnomaly({ id: 'a1', severity: 'high', description: 'High error' }),
+      makeAnomaly({ id: 'a2', severity: 'low', description: 'Low error' }),
+    ]);
+
+    // Both are visible initially (all severities selected)
+    expect(screen.getByText('High error')).toBeDefined();
+    expect(screen.getByText('Low error')).toBeDefined();
+
+    // Click "high" to deselect it
+    const highBtn = screen.getAllByRole('button').find((b) => b.textContent === 'HIGH');
+    if (highBtn) await user.click(highBtn);
+
+    // High error should now be hidden
+    expect(screen.queryByText('High error')).toBeNull();
+    expect(screen.getByText('Low error')).toBeDefined();
+  });
+
+  it('filters by description search', async () => {
+    const user = userEvent.setup();
+    renderList([
+      makeAnomaly({ id: 'a1', description: 'Server crashed unexpectedly' }),
+      makeAnomaly({ id: 'a2', description: 'Timeout on login' }),
+    ]);
+
+    const searchInput = screen.getByPlaceholderText(/search/i);
+    await user.type(searchInput, 'crashed');
+
+    expect(screen.getByText('Server crashed unexpectedly')).toBeDefined();
+    expect(screen.queryByText('Timeout on login')).toBeNull();
+  });
+});