Commit Graph

4 Commits

Author SHA1 Message Date
Anso 6cc66faa8c feat(mobile): standardize secondary pages and the stack list on the status masthead (#1374)
* feat(security): reflow the node Security page for mobile

Below the md breakpoint the Security page now reads as a phone surface
instead of a squeezed desktop, with no change to the desktop layout.

- Masthead stat cluster moves into a full-width 3-cell strip
  (critical / high / last scan) below the tab strip, since the masthead
  hides its inline cluster on a phone.
- The eight-section tab strip becomes a horizontally scrollable mono row
  with an edge mask-fade and a cyan underline on the active tab; every
  section stays reachable by scroll.
- The six totals render as a 3x2 hairline-divided grid instead of the
  640px-wide rail that forced a horizontal scroll.
- The Images tab becomes a filterable, scrollable list (severity dot,
  truncated ref, freshness, critical/high count tags) with a chip row,
  in place of the desktop table.
- A freshness footer band states scan recency and scanner version.

All mobile treatment is gated by useIsMobile() or max-md: utilities, so
the desktop view is byte-identical. Charts are reused full-width.

* feat(security): make the mobile Security page a bespoke masthead-led screen

On a phone the Security page now drops the global top bar and leads with
its masthead (the notifications + more-menu cluster moves into the
masthead's right slot), matching Home and Fleet so the mobile shell is
continuous across pages. The view is reclassified bespoke and rendered
through the masthead-led path; the desktop layout is unchanged.

The mobile "more" menu now lists every destination instead of omitting
the bottom-tab views, so the same menu opens the same set on every
screen rather than changing contents from page to page.

* refactor(mobile): extract shared PageHead, sub-tabs, and chip-row primitives

Add PageHead (the header for a pushed full-screen secondary view),
MobileSubTabs (the mono tab scroller with the cyan active underline), and
MobileChipRow (the cyan-filled filter chips) to the shared mobile-ui kit,
and rewire the Security page's tab strip and Images filter to consume
them. No visual change; this is the shared chrome the remaining mobile
pages reuse.

* feat(updates): make the mobile Updates page a bespoke masthead-led screen

Below the md breakpoint the Auto-Update Readiness page becomes a pushed
full-screen view: a PageHead (back chip, the rehomed notifications +
more-menu, a "fleet readiness" crumb, and a Recheck action) leads, then a
brand-tinted readiness hero, per-node sections, and one-up readiness
cards that reuse the same risk badge, version delta, and apply/disabled
logic as the desktop board. The desktop layout is unchanged.

Reclassifies auto-updates as bespoke and renders it through
renderMobileBespoke behind the same hub-only + capability gates as the
desktop content path. Also lifts the PageHead, sub-tabs, and chip-row
primitives' right-slot to host the rehomed global chrome.

* feat(app-store): make the mobile App Store a bespoke masthead-led screen

Below the md breakpoint the App Store becomes a pushed full-screen view:
a PageHead (back chip, the rehomed notifications + more-menu, and an
app-count crumb) leads, the category sidebar collapses into a horizontal
chip scroller, and the featured hero plus the tile grid (already
single-column on a phone) stack below. The featured hero, tile grid, and
deploy sheet are shared with the desktop layout, which is unchanged.

Reclassifies templates as bespoke and renders it through
renderMobileBespoke. Adds tests for the shared chip row and sub-tabs.

* feat(audit): make the mobile Audit Log a bespoke masthead-led screen

Below the md breakpoint the Audit Log becomes a pushed full-screen view:
a PageHead (back chip, the rehomed notifications + more-menu, an
entry-count crumb, and Refresh) leads, then the Stream/Table sub-tabs and
the stream view, where the signal-rail tiles fold to a 2x2 grid and the
day-banded activity stream reflows. The columnar table reads best on a
larger screen, so the Table tab points there on a phone. Desktop is
unchanged.

Reclassifies audit-log as bespoke behind the same hub-only + capability
gates as the desktop content path.

* feat(app-store): drop the featured hero and category chips on mobile

On a phone the App Store is now search plus a single-column list of
every matching app. The featured hero and the category chip row are
removed; the would-be-featured app is folded into the list so nothing is
dropped. Desktop keeps the featured hero, category sidebar, and grid.

* feat(resources): make the mobile Resources page a bespoke masthead-led screen

Below the md breakpoint Resources becomes a pushed full-screen view: a
PageHead (back chip, the rehomed notifications + more-menu, a docker
crumb) leads, then the reclaim hero, the disk-footprint segments, the
2x2 quick-clean grid, and the resource tabs. The raw resource tables
scroll horizontally to fit; the detail sheets stay full-screen. The main
content and the dialog/sheet overlays are shared with the desktop layout,
which is unchanged.

* chore(mobile): correct shared-primitive comments and dedupe the lazy fallback

Fix the "shared by" consumer lists on the mobile-ui primitives, point the
headerActions doc comments at the PageHead (not a masthead), drop the
stale "all eight sections" count on the Security tab strip, rename a
readiness-card test to match what it asserts, and extract a single
Suspense fallback for the four bespoke phone-screen lazy imports. No
behavior change.

* feat(mobile): codify the fade+arrow tab scroller and fix the Resources tab clip

Extract the horizontal tab scroller (edge fade + clickable chevron +
wheel-to-horizontal) out of the stack anatomy panel into a shared
ScrollableTabRow primitive, and adopt it in the stack anatomy tabs, the
mobile sub-tabs (Security / Audit), and the Resources resource tabs. On a
phone the Resources tabs now scroll horizontally, so the "Unmanaged" tab
and its count no longer clip out of the frame. Desktop is unchanged.

* feat(logs): make the mobile Logs page a bespoke masthead-led screen

Below the md breakpoint the global Logs view drops the TopBar for a
PageHead, hides the metrics rail, collapses the stream and level filters
into a single Filters dropdown, turns the search into an icon that
expands to an input, and folds the pause / clear / download controls into
an expanding floating action button that retracts after each action.
Desktop is unchanged.

Reclassifies global-observability as bespoke behind the same hub-only
gate as the desktop content path.

* feat(mobile): standardize secondary pages on the status masthead

Adopt the Home/Fleet/Security status masthead (cyan rail, kicker, serif-
italic state word + tone dot, meta line, notifications + more-menu in the
right slot) on every bespoke secondary page (Resources, App Store,
Updates, Audit, Logs), replacing the title-led PageHead, which is
removed. Each page derives a status word: Updates "Up to date" /
"N pending", Logs Streaming / Idle / Offline, Audit Healthy / Review /
Alerts, Resources Reclaimable / Tidy, App Store the app count.

The "< Stacks" back chip is dropped (the bottom tab bar and more-menu own
navigation), the page actions (Recheck, Refresh) move into the body, and
the Updates readiness hero folds into the masthead. Also make the
Resources tab tables scroll horizontally instead of clipping on the
right. Desktop is unchanged.

* feat(stacks): lead the mobile stack list with the status masthead

On phones the stack list now opens with the shared status masthead instead
of the global top bar plus an in-sidebar node row. The node switcher renders
as a compact kicker chip in the masthead, the serif word summarizes stack
health (down, updates, or all running), and notifications plus the more-menu
sit in the right slot. This matches the Home, Fleet, and Security pages.

The dropped top bar hosted global search, so the more-menu gains a Search
item that opens the command palette. The masthead kicker now accepts either
a styled kicker or a raw slot, enforced as a discriminated union so exactly
one source is supplied. Desktop is unchanged: the new chrome is gated to the
mobile shell and the sidebar rows hide via max-md only.

* fix(stacks): only call the list "All running" when every stack is up

The mobile stack masthead derived its health word from filterCounts, where
up counts running stacks and down counts exited ones. Any other status, and
the window before statuses load, counts as neither, so a list with no exited
stacks but some not yet running fell through to "All running" even though it
was not. Gate that label on up equal to all, and otherwise show the running
count out of the total so the headline stays honest while statuses settle.
2026-06-14 22:21:46 -04:00
Anso 2a4955f56d feat: add dedicated Security page and policy-pack foundation (#1362)
* feat: add dedicated Security page and policy-pack foundation

Bring vulnerability scanning, scan history, suppressions, Compose risks,
secrets, policy packs, and scanner setup into one node-scoped Security
command center instead of scattering them across Resources and Settings.

- New top-level Security view with Overview, Images, Compose risks,
  Secrets, Policies, Suppressions, History, and Scanner setup tabs
  (status masthead + signal rail; controlled tabs with deep-link support).
- Backend: GET /security/overview rollup and GET /security/policy-packs
  static catalog (auth-only, Community). DatabaseService gains an uncapped
  scan-status count and a node-eligible block-policy count, and
  getImageScanSummaries now projects secret and misconfig counts.
- Reuse existing surfaces: the scan-history sheet, the control-governed
  suppression and acknowledgement panels, and the scan-detail sheet (now
  with an initial-tab prop so it opens on the matching finding type).
- Extract a shared SeverityBadge (from Resources) and a TrivyManager
  (from Settings) so both surfaces render identical controls.
- Resources "Scan history" now links into the Security page History tab.
- Docs for the new Security surface and tests for the new endpoints,
  helpers, nav wiring, and tabs.

* refactor: consolidate scanner and policy management onto the Security page

Remove the Settings "Vulnerability Scanning" section now that the Security
page covers the same ground, with every option preserved:

- Scanner install / update / uninstall / auto-update live on the Scanner setup
  tab (TrivyManager).
- Scan policies, the honor-suppressions toggle, and the replica
  managed-by-control / demote controls move into a new ScanPolicyManager on the
  Policies tab (paid; Community sees only the policy-pack catalog).
- CVE suppressions and acknowledgements remain on the Suppressions tab.

Wiring removed: the registry section and the now-empty Security settings group,
the SectionId, the SettingsSectionContent case and the isPaid prop it was the
sole consumer of, and SecuritySection itself. The dashboard configuration-status
"Vulnerability scanning" row now navigates to the Security page Policies tab.

Docs that pointed at "Settings -> Security -> Vulnerability Scanning" are swept
to the relevant Security page tabs.

* fix: harden Security page scanner refresh, policy-load errors, and secret-only badges

Address independent-review findings on the Security page:

- Scanner setup now refreshes Trivy state when the active node changes, so the
  displayed scanner status matches the node TrivyManager's actions target (both
  follow x-node-id). Previously, switching nodes on the tab left stale state.
- ScanPolicyManager surfaces an explicit error state on a failed policy fetch
  instead of falling through to a false "No scan policies configured".
- The shared SeverityBadge and the Images findings column no longer label a scan
  "clean" when it has secrets or misconfigurations but no CVE severity
  (highest_severity is derived from vulnerabilities only); they show a "Findings"
  state and the secret/misconfig counts instead.
- The Overview enforcement note points to the Policies tab, not the removed
  Settings section.
- The History tab auto-opens the scan-history sheet only on a deep-link (mount
  with the History tab active), not on every manual tab selection.

Adds tests for the badge secret/misconfig state and the policy-load error state.
2026-06-12 10:41:39 -04:00
Anso 8e4a09f44a chore: drop stale prototype path from mobile-ui comment (#1342)
The mobile primitives comment pointed at a design prototype folder that
no longer exists. Remove the dead path reference; the comment still
describes where the primitives came from.
2026-06-09 19:01:32 -04:00
Anso 928a3a8343 feat(mobile): bespoke phone layouts for dashboard, fleet, schedules, and settings (#1330)
* feat(mobile): masthead-led dashboard and 5-tab bottom nav on phones

On phones (below the md breakpoint) the dashboard now renders a bespoke,
masthead-led layout instead of the reflowed desktop workspace:

- A status masthead leads with the overall system-health verdict, the node,
  and a live summary (stack counts, last sync, a "metrics stale" marker when
  polling stops).
- A CPU hero card with a sparkline, then a memory / disk / network strip with
  threshold-colored bars, then a tappable stack-health list.
- The bottom tab bar gains a Home tab (Home / Stacks / Fleet / Sched /
  Settings); the global top bar is dropped on this screen, with notifications
  and a "more" menu rehomed into the masthead.

The health-verdict logic is extracted into a shared helper so the phone
masthead and the desktop health bar read from one source, with unit tests.

All changes are scoped below the md breakpoint or rendered only on the mobile
shell; desktop layout is unchanged (verified against the desktop snapshot gate).

* feat(mobile): bespoke fleet glance and node detail on phones

On phones (below the md breakpoint) the Fleet view now renders a bespoke,
masthead-led layout instead of the reflowed desktop workspace:

- A fleet masthead leads with the overall fleet-health verdict and a running /
  cpu / mem summary band, then a list of node cards. The local node is marked
  with a cyan rail and a "you are here" tag; offline nodes are dimmed.
- Tapping a node opens a full-screen node detail: state pill, resource bars
  (cpu / mem / disk), the stacks running on that node, and an Inspect action
  that switches to the node. Operators with the right permissions also get a
  Drain (cordon) action.
- The screen polls the fleet overview every 30 seconds; the global top bar is
  dropped here, with notifications and a "more" menu in the masthead.

All changes are scoped below the md breakpoint or rendered only on the mobile
shell; desktop layout is unchanged.

* feat(mobile): bespoke schedules and settings screens on phones

On phones (below the md breakpoint) Schedules and Settings now render bespoke,
masthead-led layouts instead of the reflowed desktop workspace:

- Schedules: a "next up" glance leading with the next run time and countdown,
  then upcoming runs grouped by day with a per-action status dot and target.
  It is read-only on mobile; creating and editing schedules stays on desktop.
- Settings: a grouped-card list of every reachable section; tapping one opens
  it full-screen with a back affordance and a section masthead. The section
  content itself is the same as on desktop.

The settings section switch, lazy-loaded section chunks, and tier gating are
moved into a shared component so the desktop and mobile screens render the same
section content from one place. The global top bar is dropped on both screens,
with notifications and a "more" menu in the masthead.

All changes are scoped below the md breakpoint or rendered only on the mobile
shell; desktop layout is unchanged.

* fix(mobile): show notifications and more-menu on the stack detail header

The full-screen stack detail on phones drops the global top bar, but its
header was missing the notifications bell and the "more" navigation menu that
the other mobile screens carry in their masthead, leaving no way to reach
notifications or other destinations while viewing a stack. Render the same
header-actions cluster in the detail header (and the loading placeholder),
next to the back affordance. Desktop is unaffected.
2026-06-07 01:15:16 -04:00