e3mrah a894b54a2f

fix(wizard): pixel-port core/console (apps + app detail sections + jobs expand-in-place) (#197) ...

Replaces the invented AdminPage / AdminShell / ApplicationCard /
ApplicationPage / PhaseBanners with a 1:1 React port of the canonical
Svelte components in core/console/src/components/. Same chrome, same
tabs, same auto-fit card grid, same expand-in-place jobs rows, no
invented sections, no per-job route.

Routes (basepath=/sovereign):
  /provision/$deploymentId           → AppsPage    (Deployments|Catalog tabs)
  /provision/$deploymentId/app/$id   → AppDetail   (sections, NOT tabs)
  /provision/$deploymentId/jobs      → JobsPage    (expand-in-place rows)
  /provision/legacy/$deploymentId    → ProvisionPage (legacy DAG, sub-path)

NEW files (products/catalyst/bootstrap/ui/src/pages/sovereign/):
  PortalShell.tsx + .test.tsx (skipped — covered transitively)
  Sidebar.tsx + Sidebar.test.tsx
  AppsPage.tsx + AppsPage.test.tsx
  AppDetail.tsx + AppDetail.test.tsx
  JobsPage.tsx + JobsPage.test.tsx
  JobCard.tsx + JobCard.test.tsx
  jobs.ts + jobs.test.ts                (Job model + reducer adapter:
                                         4 Phase 0 tofu jobs +
                                         1 cluster-bootstrap job +
                                         per-bp-* HelmRelease jobs)

DELETED invented files:
  AdminPage.tsx + .test.tsx
  AdminShell.tsx
  ApplicationCard.tsx
  ApplicationPage.tsx + .test.tsx
  PhaseBanners.tsx

UNTOUCHED data layer (kept as-is per spec):
  applicationCatalog.ts + .test.ts
  eventReducer.ts + .test.ts
  useDeploymentEvents.ts
  StatusPill.tsx

CSS tokens: globals.css gains the canonical core/console --color-*
surface (--color-bg, --color-surface, --color-border, --color-accent,
--color-text-strong, --color-text-dim, --color-text-dimmer,
--color-success, --color-warn, --color-danger, --color-bg-2,
--color-surface-hover, --color-border-strong, --color-accent-hover).
Values copied verbatim from core/console/src/styles/global.css.

Gates:
  • tsc --noEmit clean
  • npm run build clean
  • vitest: 238 tests passing (was 185 pre-port; +53 new)

Playwright evidence (1440px, dark theme):
  .playwright-mcp/console-port-evidence/wizard-apps-1440-dark.png
  .playwright-mcp/console-port-evidence/wizard-apps-catalog-1440-dark.png
  .playwright-mcp/console-port-evidence/wizard-app-detail-cilium-1440-dark.png
  .playwright-mcp/console-port-evidence/wizard-jobs-1440-dark.png
  .playwright-mcp/console-port-evidence/wizard-apps-1440-light.png

Note: canonical https://console.openova.io/nova/* requires sign-in;
auth-gated reference screenshots are not capturable from this session.
The ports lock to the canonical Svelte source files at
core/console/src/components/{PortalShell,Sidebar,AppsPage,AppDetail,
JobsPage}.svelte — same class strings, same selectors, same DOM
structure. Visual conformance is asserted by tests on testid + class
membership.

Co-authored-by: hatiyildiz <hatice.yildiz@openova.io>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

2026-04-29 20:09:36 +02:00

575 KiB

1440x2303px

Raw Permalink History