feat(ui): unify filter bars on mounted list pages [SPRINT-015]

Migrate audit-log, evidence-pack, release-list, secret-detection,
certificate-inventory, and trust-audit-log to shared FilterBarComponent
with consistent FilterOption/ActiveFilter interfaces.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
master
2026-03-08 19:24:56 +02:00
parent 44cd1827c2
commit 646fccd641
11 changed files with 996 additions and 550 deletions

View File

@@ -0,0 +1,65 @@
# Filter Bar Unification
Sprint: `SPRINT_20260308_015_FE_orphan_filter_bar_unification.md`
Feature IDs: FE-OFB-001 through FE-OFB-004
Status: Shipped
## What shipped
The dormant shared `FilterBarComponent` (`src/Web/StellaOps.Web/src/app/shared/ui/filter-bar/filter-bar.component.ts`) has been adopted across all seven eligible mounted list pages. Each page's bespoke filter toolbar markup has been replaced by a single `<app-filter-bar>` element that renders search input, single-select filter dropdowns, active-filter chips, and a clear-all button through the shared component's existing API.
## Shared contract (unchanged)
The `FilterBarComponent` API was sufficient without extension:
- `@Input() searchPlaceholder: string` -- placeholder text for the search input.
- `@Input() filters: FilterOption[]` -- array of single-select dropdown definitions.
- `@Input() activeFilters: ActiveFilter[]` -- currently applied filters shown as chips.
- `@Output() searchChange` -- emits the new search string.
- `@Output() filterChange` -- emits a new `ActiveFilter` when a dropdown value is selected.
- `@Output() filterRemove` -- emits the `ActiveFilter` when a chip is dismissed.
- `@Output() filtersCleared` -- emits when the clear-all button is clicked.
## Adopted pages
### Security and audit family (FE-OFB-002)
| Page | File | Filter options exposed |
| --- | --- | --- |
| Audit Log Table | `features/audit-log/audit-log-table.component.ts` | module, action, severity, dateRange |
| Secret Findings List | `features/secret-detection/secret-findings-list.component.ts` | severity, status, category |
| Console Admin Audit Log | `features/console-admin/audit/audit-log.component.ts` | eventType (16 event types) |
### Release, evidence, and trust family (FE-OFB-003)
| Page | File | Filter options exposed |
| --- | --- | --- |
| Release List | `features/release-orchestrator/releases/release-list/release-list.component.ts` | type, stage, gate, risk, blocked, needsApproval, hotfixLane, replayMismatch |
| Evidence Pack List | `features/evidence-pack/evidence-pack-list.component.ts` | (search only, no dropdowns) |
| Trust Audit Log | `features/trust-admin/trust-audit-log.component.ts` | resourceType, severity |
| Certificate Inventory | `features/trust-admin/certificate-inventory.component.ts` | status, type |
## Exclusions
- `vex-statement-search` -- excluded because it is a dedicated search page with a tightly coupled search UX, not a list-filter toolbar.
- Console-admin CRUD pages (users, clients, roles, tenants, tokens) -- excluded because they have no bespoke filter toolbar to replace.
## Design decisions
- Multi-select dropdowns on the audit-log-table were simplified to single-select to match the shared bar's existing contract. The underlying filter arrays still work but now hold at most one value.
- Date-range inputs on the audit-log-table were mapped to preset dropdown options (24h, 7d, 30d, 90d).
- Date inputs on trust-admin pages were removed from the filter bar; dates remain in component state for API queries but are not exposed through the shared bar.
- Query-state persistence on the release-list via `buildQueryParams()` and route subscription remains intact.
## Test coverage
- `shared/ui/filter-bar/filter-bar.component.spec.ts` -- 10 focused unit tests for the shared component.
- `features/audit-log/audit-log-table.component.spec.ts` -- 12 focused unit tests for filter-bar adoption on the audit-log-table (security/audit family representative).
- `features/trust-admin/certificate-inventory.component.spec.ts` -- 16 focused unit tests for filter-bar adoption on the certificate-inventory (release/evidence/trust family representative).
## Source paths
- Shared component: `src/Web/StellaOps.Web/src/app/shared/ui/filter-bar/filter-bar.component.ts`
- Shared spec: `src/Web/StellaOps.Web/src/app/shared/ui/filter-bar/filter-bar.component.spec.ts`
- Audit-log spec: `src/Web/StellaOps.Web/src/app/features/audit-log/audit-log-table.component.spec.ts`
- Certificate-inventory spec: `src/Web/StellaOps.Web/src/app/features/trust-admin/certificate-inventory.component.spec.ts`