# WP1+WP2 — FE Antibiotics management screen + wiring

## Goal
A lab reference-data screen at `/lab/antibiotics` (and embedded `/core/lis/antibiotics`) to view/search the antibiotics catalog and add/edit/disable antibiotics — mirroring the existing `specimen-types` CRUD screen. The backend + FE service are already done; this is the screen + its route/nav/i18n wiring.

## Repo & branch
FE repo `/home/moonui/public_html/moon-erp`, branch `hazemdev`. Conventional commit `feat(lis-fe):`.

## Already exists (consume as-is — do NOT recreate)
- Service `src/app/core/services/lis-antibiotic.service.ts` — `list(page,perPage)`, `listAll()`, `create(data)`, `update(id,data)`, `delete(id)` all ready. Base `${apiUrl}/lis/antibiotics`.
- Model `src/app/core/models/lis-antibiotic.model.ts` — `LisAntibiotic { id, code, name, name_ar?, abbreviation?, drug_class?, is_active, sort_order }`.
- Backend CRUD + permissions `lis.antibiotics.view` / `lis.antibiotics.manage` (enforced server-side).

## Reference screen to MIRROR
`src/app/features/lis/specimen-types/lis-specimen-types.component.ts/.html/.scss` — copy its structure (PrimeNG table, search, add/edit dialog with a `signal` for the editing item, ConfirmationService for delete, MessageService toasts, `*appCan`/permission-gated action buttons). Match its conventions exactly (standalone component, imports, RTL, i18n via `| translate`).

## Files to CREATE
- `src/app/features/lis/antibiotics/lis-antibiotics.component.ts` + `.html` (+ `.scss` if the mirror uses one):
  - PrimeNG table columns: Code · Name (EN) · Name (AR) · Abbreviation · Drug class · Active (tag/toggle) · Actions (edit/delete).
  - **Search box** (filter by name/code, client-side over `listAll()` or server search if the service supports it — `listAll()` is fine for 312 rows).
  - **Active filter** (All / Active only / Inactive only).
  - **Add/Edit dialog** (PrimeNG `p-dialog` or the shared `form-dialog`): fields = `code` (required, max 20), `name` (required, max 255), `name_ar` (required, max 255), `abbreviation` (optional, max 10), `drug_class` (optional free-text, max 50), `sort_order` (integer ≥0, default 0), `is_active` (toggle, default true). Match the BE validation exactly.
  - **Delete** = soft-delete via `service.delete(id)` behind a ConfirmationService confirm; label it "Disable/Delete" per the disable-over-delete decision (a used antibiotic stays in old reports). After create/update/delete → reload + toast.
  - Action buttons gated by `lis.antibiotics.manage` (use the same `*appCan`/CanDirective pattern the mirror uses); the screen itself is permission-guarded by the route.

## Files to MODIFY (wiring = WP2)
- `src/app/features/lis/lis-standalone.routes.ts` — add a route `{ path: 'antibiotics', canActivate:[...], data:{ permissions:['lis.antibiotics'] }, loadComponent: () => import('./antibiotics/lis-antibiotics.component').then(m => m.LisAntibioticsComponent) }` mirroring the `specimen-types` route (~line 49). Use the SAME permission-prefix style the other lis routes use (`lis.antibiotics`).
- `src/app/app.routes.ts` — add the embedded `/core/lis/antibiotics` route mirroring how `specimen-types`/`sections` are embedded there (find the existing lis embedded routes and add one).
- `src/app/features/lis/config/lis-nav.config.ts` — add `{ label: 'NAV.LIS_ANTIBIOTICS', icon: 'pi pi-shield' (or a pill/capsule-ish icon), route: '/lab/antibiotics', permissions: ['lis.antibiotics'] }` near `LIS_SPECIMEN_TYPES` (~line 57), under the reference-data group.
- `src/assets/i18n/en.json` + `src/assets/i18n/ar.json` — add `NAV.LIS_ANTIBIOTICS` + a `LIS.ANTIBIOTICS.*` block (TITLE, ADD, EDIT, CODE, NAME, NAME_AR, ABBREVIATION, DRUG_CLASS, SORT_ORDER, ACTIVE, SEARCH_PLACEHOLDER, CONFIRM_DELETE, SAVED, DELETED, FILTER_ALL/ACTIVE/INACTIVE, etc.). English-first, Arabic translated. No raw KEY may render.

## Interfaces
Consumes only the existing service + model. Exposes nothing to later WPs. WP3 (BE unique-code) is independent.

## Acceptance criteria
- [ ] `/lab/antibiotics` renders the catalog (312 rows) in a searchable table with an active filter.
- [ ] Add creates an antibiotic (POST), Edit updates (PUT), Delete soft-deletes (DELETE) — each with a confirm/toast and a reload.
- [ ] Dialog validation matches the BE (required code/name/name_ar; sensible maxlengths).
- [ ] Nav item shows under the lab reference-data group and routes correctly; route is permission-gated (`lis.antibiotics`).
- [ ] i18n keys present in BOTH en.json and ar.json — no raw KEY shown.
- [ ] `npx ng build --base-href /app/` is GREEN.

## Tests
FE has no unit runner → proof = `ng build` green + describe a wiring sanity-check (component compiles/lazy-loads; endpoints correct).

## Out of scope
- BE changes (WP3: unique-code + role grant). The AST picker in the culture cell (already consumes the list). Bulk import.

## Flags
No [FIN], no migration. Pure FE.