feat: add contacts phase 2, advanced search, vacation responder, Docker & TOTP 2FA

- Contact groups/lists, vCard import/export (RFC 6350), bulk operations
- Advanced search with JMAP filter panel, search chips, cross-mailbox queries
- Vacation responder with JMAP VacationResponse, settings tab, sidebar indicator
- TOTP two-factor authentication support
- Docker multi-stage build with standalone output and docker-compose
- CSP Report-Only headers and security headers via proxy middleware
- Virtual scrolling for large email lists
- Structured server-side logger (text/JSON, configurable level)
- 450+ tests (contacts, vCard, threads, headers, identity, components)
- Playwright E2E framework setup
- Updated README and ROADMAP with all new features

components/ui/__tests__/avatar.test.tsx

@@ -0,0 +1,33 @@
+import { render } from '@testing-library/react';
+import { describe, it, expect } from 'vitest';
+import { Avatar } from '../avatar';
+
+describe('Avatar', () => {
+  it('renders initials from full name', () => {
+    const { container } = render(<Avatar name="Alice Smith" />);
+    expect(container.textContent).toBe('AS');
+  });
+
+  it('renders two letters from single-word name', () => {
+    const { container } = render(<Avatar name="Alice" />);
+    expect(container.textContent).toBe('AL');
+  });
+
+  it('renders single letter from email when no name', () => {
+    const { container } = render(<Avatar email="bob@example.com" />);
+    expect(container.textContent).toBe('B');
+  });
+
+  it('renders "?" when no name or email', () => {
+    const { container } = render(<Avatar />);
+    expect(container.textContent).toBe('?');
+  });
+
+  it('produces consistent background color for same input', () => {
+    const { container: a } = render(<Avatar name="Alice" />);
+    const { container: b } = render(<Avatar name="Alice" />);
+    const colorA = (a.firstChild as HTMLElement).style.backgroundColor;
+    const colorB = (b.firstChild as HTMLElement).style.backgroundColor;
+    expect(colorA).toBe(colorB);
+  });
+});

components/ui/__tests__/button.test.tsx

@@ -0,0 +1,36 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import { Button } from '../button';
+
+describe('Button', () => {
+  it('renders with children text', () => {
+    render(<Button>Click me</Button>);
+    expect(screen.getByText('Click me')).toBeInTheDocument();
+  });
+
+  it('handles click events', () => {
+    const onClick = vi.fn();
+    render(<Button onClick={onClick}>Click</Button>);
+    fireEvent.click(screen.getByText('Click'));
+    expect(onClick).toHaveBeenCalledOnce();
+  });
+
+  it('applies disabled state', () => {
+    render(<Button disabled>Disabled</Button>);
+    expect(screen.getByText('Disabled')).toBeDisabled();
+  });
+
+  it('renders different variants without errors', () => {
+    const { rerender } = render(<Button variant="default">Default</Button>);
+    expect(screen.getByText('Default')).toBeInTheDocument();
+
+    rerender(<Button variant="ghost">Ghost</Button>);
+    expect(screen.getByText('Ghost')).toBeInTheDocument();
+
+    rerender(<Button variant="outline">Outline</Button>);
+    expect(screen.getByText('Outline')).toBeInTheDocument();
+
+    rerender(<Button variant="destructive">Destructive</Button>);
+    expect(screen.getByText('Destructive')).toBeInTheDocument();
+  });
+});

components/ui/__tests__/input.test.tsx

@@ -0,0 +1,28 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import { Input } from '../input';
+
+describe('Input', () => {
+  it('renders with placeholder', () => {
+    render(<Input placeholder="Enter text" />);
+    expect(screen.getByPlaceholderText('Enter text')).toBeInTheDocument();
+  });
+
+  it('handles value changes', () => {
+    const onChange = vi.fn();
+    render(<Input onChange={onChange} />);
+    fireEvent.change(screen.getByRole('textbox'), { target: { value: 'hello' } });
+    expect(onChange).toHaveBeenCalledOnce();
+  });
+
+  it('applies disabled state', () => {
+    render(<Input disabled placeholder="Disabled" />);
+    expect(screen.getByPlaceholderText('Disabled')).toBeDisabled();
+  });
+
+  it('passes type prop', () => {
+    render(<Input type="password" placeholder="Password" />);
+    const input = screen.getByPlaceholderText('Password');
+    expect(input).toHaveAttribute('type', 'password');
+  });
+});