# WP4 — Redesign the System Tests screen (groups + virtual scroll + drill-down + run buttons)

## Goal
Rebuild `/core/e2e-tests` so scenarios are shown in collapsible module groups, each test can be run individually or by group, clicking a test reveals its description + steps, and the list scales to hundreds via virtual scroll.

## Repo & branch
FE repo `/home/moonui/public_html/moon-erp`, branch `hazemdev`. Commit `feat(e2e-fe):`. Angular 21 standalone + PrimeNG 21, RTL, ngx-translate. `@angular/cdk` v21 is available (use `ScrollingModule` / `cdk-virtual-scroll-viewport`).

## Consume (from WP1+WP2)
- Scenario titles now carry `@lis @results`-style tags + a `description` annotation; `test.step(...)` titles exist. The run's `scenarios[]` come from `GET /api/e2e/runs/latest` as `{title,status,duration_ms}` — you will ALSO parse `group` (first module tag) + `description` (annotation) + `steps` (per-test steps) from the reporter JSON. **Check the actual `last-run.json` shape (WP1 verified where tags/description/steps land)** and extend the BE `latest()` mapping if needed to pass group/description/steps through (small BE tweak allowed here if the parser drops them — coordinate: if you need the BE to emit steps/description/group, note it; otherwise derive group from the title tag on the FE).
- `POST /api/e2e/run` accepts optional `{filter}` (WP2): `@lis` (group) or exact title (single) or none (all).

## Files to MODIFY
- `src/app/core/services/e2e-runner.service.ts` — `run(filter?: string)` sends `{filter}` when provided. Extend `E2eScenario` interface: add `group?: string`, `description?: string`, `steps?: {title:string; status?:string}[]` (steps optional — WP3 will populate live; for now derive what's available from the reporter).
- `src/app/features/e2e-tests/e2e-tests.component.ts/.html/.scss` — redesign:
  - **Grouping:** derive `group` per scenario (from a `@tag` in the title, fallback 'other'); build a `computed()` of `{group, label, scenarios[], counts}`. Collapsible group headers (signal set of expanded groups). A friendly module label map (lis→'المعمل / LIS', clinic→'العيادة / Clinic', etc.).
  - **Virtual scroll:** wrap the flat scenario rows in `cdk-virtual-scroll-viewport` (fixed item size) so hundreds render smoothly. Groups can stay as headers with their rows virtualized, OR virtualize a flattened [header,rows...] list — pick the simpler that scales.
  - **Run buttons (3 levels):** "Run all" (top, `run()`), "Run group" per group header (`run('@'+group)`), "Run" per test row (`run('<exact title>')`). While a run is in progress, disable run buttons (single-flight).
  - **Drill-down:** clicking a test row toggles a detail panel showing its `description` + step list (each step with a status dot when available). Keep a slot/placeholder where WP3 will later add the live per-step updates + a failure screenshot (leave the layout ready — e.g. an empty `@if (sc.screenshot)` block).
  - **Live-ish:** keep the existing polling; show per-scenario status as it updates (WP3 makes it truly live; for now the whole set updates each poll — that's fine).
  - i18n `E2E.*` additions (RUN_ALL, RUN_GROUP, RUN_TEST, GROUP_*, STEPS, DESCRIPTION, NO_STEPS, etc.) in en.json + ar.json.

## Acceptance criteria
- [ ] Scenarios shown grouped by module in collapsible sections with per-group pass/fail counts.
- [ ] Three run levels work: all / group / single — each triggers a run with the right filter (verify the POST body carries the filter; the run then shows only those scenarios or all).
- [ ] Clicking a test shows its description + steps.
- [ ] The list uses virtual scroll (works with 2 today; structured to handle hundreds).
- [ ] Run buttons disabled while running; 403 (runner disabled) still shows the friendly note.
- [ ] i18n both files; no raw KEY. `ng build` GREEN.

## Out of scope
- WP3: live streaming reporter, real per-step live updates, failure-screenshot capture/transfer/display, trace download. LEAVE ROOM in the model/layout but do NOT build them.

## Flags
No [FIN]. Small BE tweak to `latest()` mapping only IF needed to pass group/description/steps (note it in the report). No migration.