fix(frontend): align types + UI to backend contract (docs/api.md @ dd5c508)

Backend pushed the authoritative contract in docs/api.md and tightened
the error envelope via a global HTTPException handler (dd5c508). This
commit folds the frontend onto that contract — every drift flagged by
the code-reviewer MAJOR is closed.

Types (src/types/api.ts)
- User: `id` → `user_id`; `display_name` is `string | null`; add
  `permissions: string[]` and `groups: string[]`; drop `engagement_id`
  and `engagement_name` (not part of CurrentUser).
- Engagement: drop `name`, `client_name` is non-null `string`; status
  enum aligned to `draft | active | closed | archived`; `c2_type` is
  non-null `C2Type`; drop `created_at` (not in EngagementRead v1).
- EngagementCreate body: `client_name` required, plus optional
  `description`, `c2_type`, `start_date`, `end_date`. No `name`.
- Replace ApiError + ApiValidationError with a single uniform envelope:
  `{ error: string, message: string, details?: PydanticErrorItem[] }`,
  matching the new HTTPException handler. PydanticErrorItem is the
  per-field shape on 422 (`{ loc, msg, type }`).

Fetch client (src/lib/api.ts)
- `bodyAsApiError` now recognizes the uniform envelope by shape
  (error+message strings). Anything else returns null so callers fall
  back to a generic message — keeps us robust if the backend ever
  emits a non-JSON response.

Engagements API (src/screens/engagements/engagementsApi.ts)
- Drop the `{ items: [] }` envelope tolerance — backend serves a bare
  `Engagement[]`.
- Hit `/engagements/` with trailing slash explicitly; backend now sets
  `strict_slashes=False` but staying consistent with docs/api.md.

EngagementsPage
- Status tone map switched to the new enum (`draft → pending`,
  `closed → soc`).
- Drop "Name" column. `client_name` is the primary identifier; the
  description column replaces the now-meaningless name field.
- `c2_type` is non-null, so no nullable rendering path.

EngagementCreateDialog
- Drop `name` field. New required field is `client_name`; add a
  `c2_type` select (default `mythic`); brief textarea stays optional.
- `mapValidationErrors` now reads `body.details[*].loc` (last segment
  matches the form field) — direct alignment with the backend's new
  shape after dd5c508.
- 401 still surfaces "Session expirée"; 403 gains a dedicated message;
  other errors fall back to a capitalized backend `message` when
  available, then to a generic French string.

Sidebar
- Display fallback: `user.display_name ?? user.username` (now nullable).
- Drop the `ENG · {engagement_name}` line; show `user.username` (the
  email) as the secondary identity instead.

LoginPage
- Field label "Username" → "Email or username" so RT users with email
  accounts find the field semantically obvious (per docs/api.md note
  on the username/email mapping).

Tests (Vitest, 14 cases, all green)
- Refreshed fixtures to the new shapes (no more `name`, no
  `created_at`, status `draft`, envelopes carry `error`+`message`).
- New 422 test exercises the `details[*].loc` mapping shape.
- New 401 test on the dialog covers the top-of-form alert path.

frontend/src/screens/engagements/EngagementCreateDialog.test.tsx

@@ -10,23 +10,25 @@ describe('EngagementCreateDialog', () => {
     fetchMock?.restore();
   });
 
-  it('rejects empty name client-side without calling the backend', () => {
+  it('rejects empty client name client-side without calling the backend', () => {
     fetchMock = installFetchMock([]);
     renderWithProviders(<EngagementCreateDialog onClose={vi.fn()} />);
     fireEvent.click(screen.getByRole('button', { name: /arm engagement/i }));
-    expect(screen.getByText(/nom requis/i)).toBeInTheDocument();
+    expect(screen.getByText(/client requis/i)).toBeInTheDocument();
     expect(fetchMock.calls).toHaveLength(0);
   });
 
-  it('maps 422 Pydantic errors to per-field messages', async () => {
+  it('maps 422 backend errors (details[].loc) to per-field messages', async () => {
     fetchMock = installFetchMock([
       {
         status: 422,
         body: {
-          detail: [
+          error: 'validation_error',
+          message: 'request failed',
+          details: [
             {
-              loc: ['body', 'name'],
-              msg: 'String should have at least 3 characters',
+              loc: ['client_name'],
+              msg: 'String should have at least 1 character',
               type: 'string_too_short',
             },
           ],
@@ -35,11 +37,11 @@ describe('EngagementCreateDialog', () => {
     ]);
     renderWithProviders(<EngagementCreateDialog onClose={vi.fn()} />);
 
-    fireEvent.change(screen.getByLabelText(/engagement name/i), { target: { value: 'AB' } });
+    fireEvent.change(screen.getByLabelText(/client name/i), { target: { value: 'x' } });
     fireEvent.click(screen.getByRole('button', { name: /arm engagement/i }));
 
     await waitFor(() => {
-      expect(screen.getByText(/at least 3 characters/i)).toBeInTheDocument();
+      expect(screen.getByText(/at least 1 character/i)).toBeInTheDocument();
     });
   });
 
@@ -50,20 +52,18 @@ describe('EngagementCreateDialog', () => {
         status: 201,
         body: {
           id: 'eng_new',
-          name: 'OPERATION ZETA',
-          client_name: null,
+          client_name: 'OPERATION ZETA',
           description: null,
-          status: 'planning',
-          c2_type: null,
+          status: 'draft',
+          c2_type: 'mythic',
           start_date: null,
           end_date: null,
-          created_at: '2026-05-23T08:00:00Z',
         },
       },
     ]);
     renderWithProviders(<EngagementCreateDialog onClose={onClose} />);
 
-    fireEvent.change(screen.getByLabelText(/engagement name/i), {
+    fireEvent.change(screen.getByLabelText(/client name/i), {
       target: { value: 'OPERATION ZETA' },
     });
     fireEvent.click(screen.getByRole('button', { name: /arm engagement/i }));
@@ -71,7 +71,23 @@ describe('EngagementCreateDialog', () => {
     await waitFor(() => {
       expect(onClose).toHaveBeenCalledTimes(1);
     });
-    expect(fetchMock.calls[0]?.url).toBe('/api/v1/engagements');
+    expect(fetchMock.calls[0]?.url).toBe('/api/v1/engagements/');
     expect(fetchMock.calls[0]?.init?.method).toBe('POST');
   });
+
+  it('surfaces a generic top-of-form error on 401', async () => {
+    fetchMock = installFetchMock([
+      {
+        status: 401,
+        body: { error: 'not_authenticated', message: 'no active session' },
+      },
+    ]);
+    renderWithProviders(<EngagementCreateDialog onClose={vi.fn()} />);
+    fireEvent.change(screen.getByLabelText(/client name/i), {
+      target: { value: 'Anyone' },
+    });
+    fireEvent.click(screen.getByRole('button', { name: /arm engagement/i }));
+    const alert = await screen.findByRole('alert');
+    expect(alert.textContent).toMatch(/session expirée/i);
+  });
 });