Use full-width workloads filter deck

This commit is contained in:
rcourtman
2026-04-30 14:02:33 +01:00
parent c7164c2906
commit fc0bcd3204
7 changed files with 110 additions and 46 deletions
@@ -369,7 +369,11 @@ work extends shared components instead of creating new local variants.
filter surfaces may opt into the `PageControls` stacked action layout so
display, chart, column, and reset actions occupy their own compact grouped
row instead of splitting the filter row into left/right zones or creating a
full-width form-like divider. Narrow consumers such as
full-width form-like divider. When a dense surface would otherwise read as a
small form floating in a mostly empty full-width panel, it should route the
filter rows and trailing actions through `PageControls` `controlDeckClass`
so the controls read as one compact command deck instead of unrelated
left-aligned fragments. Narrow consumers such as
`ColumnPicker` must opt into their panel width through that primitive rather
than layering competing width classes page by page.
4. Add guardrail tests when a new shared pattern is introduced.
@@ -200,10 +200,11 @@ regression protection.
17. Extend workload control defaults, persistent view preferences, keyboard reset behavior, column-visibility ownership, and tag-search flow through `frontend-modern/src/components/Workloads/useWorkloadsControlsState.ts` and `frontend-modern/src/components/Workloads/workloadsFilterModel.ts` rather than rebuilding sort/search/grouping state, reset drift, or column-toggle plumbing inside `frontend-modern/src/components/Workloads/useWorkloadsState.ts`
18. Extend workload filter active-count, reset semantics, and mobile toolbar state through `frontend-modern/src/components/Workloads/workloadsFilterModel.ts` and `frontend-modern/src/components/Workloads/useWorkloadsFilterState.ts`, rather than rebuilding filter-local state inside `frontend-modern/src/components/Workloads/WorkloadsFilter.tsx`
Workloads filter presentation may consume frontend-primitives responsive
toggle controls, but the workload-owned state model must remain the source
of truth for active filter counting, reset behavior, and mobile collapse so
changing between wide toggle and narrow select presentation does not add a
second filter state path.
toggle controls and the shared compact control-deck wrapper, but the
workload-owned state model must remain the source of truth for active
filter counting, reset behavior, and mobile collapse so changing between
wide toggle and narrow select presentation does not add a second filter
state path or layout-measurement path on the workload hot path.
19. Extend threshold-slider value-position math, title/label derivation, and drag scroll-lock runtime through `frontend-modern/src/components/Workloads/thresholdSliderModel.ts` and `frontend-modern/src/components/Workloads/useThresholdSliderState.ts` rather than rebuilding slider-local state and pointer lifecycle inside `frontend-modern/src/components/Workloads/ThresholdSlider.tsx`
20. Extend stacked disk-bar capacity math, segment/tooltip derivation, and resize-observer runtime through `frontend-modern/src/components/Workloads/stackedDiskBarModel.ts` and `frontend-modern/src/components/Workloads/useStackedDiskBarState.ts` rather than rebuilding disk-bar-local state, mode branching, and tooltip shaping inside `frontend-modern/src/components/Workloads/StackedDiskBar.tsx`
21. Extend stacked memory-bar capacity math, balloon/swap derivation, and resize-observer runtime through `frontend-modern/src/components/Workloads/stackedMemoryBarModel.ts` and `frontend-modern/src/components/Workloads/useStackedMemoryBarState.ts` rather than rebuilding memory-bar-local state, tooltip shaping, and label-fit logic inside `frontend-modern/src/components/Workloads/StackedMemoryBar.tsx`