feat(operator): command palette, impersonation, incident, tweaks (O.8)

- CommandPalette + useCommandPalette: ⌘K opens a search-and-jump panel over
  real tenants/partners + fixture flags + nav + actions. Arrow keys + Enter
  navigate, Escape/backdrop close. Recents are intentionally omitted for now;
  add when there's something to recent over.
- Impersonation stub: useImpersonation + ImpersonationModal + ImpersonationBanner.
  Modal opens from tenant detail and from the palette. Banner stays at the top
  of the shell until exited. No real OBO token is minted — wiring OAuth Token
  Exchange is tracked as a follow-up.
- IncidentModal + useIncidentModal: opened from the Overview and Infrastructure
  incident banners, renders the mock INCIDENT data with metrics, timeline and
  draft composer.
- TweaksPanel + useTweaks: floating bottom-right panel for theme (dark/light),
  density (comfy/compact), env badge (prod/staging/dev). Saved to localStorage.
- Theme/density apply via [data-theme] + [data-density] overrides in
  tokens.css. Topbar env badge now reads from useTweaks instead of a prop.
- Layout wires ⌘K + ⌘[ at the document level and mounts the palette + modals
  + banner + tweaks panel once for all pages.
This commit is contained in:
Ronni Baslund
2026-05-24 08:34:34 +02:00
parent e0ac643e80
commit c71e782dc0
16 changed files with 1162 additions and 30 deletions
+2 -1
View File
@@ -3,6 +3,7 @@ import { SERVICES, INCIDENT, type PlatformService } from '~/data/fixtures'
const degradedCount = computed(() => SERVICES.filter((s) => s.status !== 'ok').length)
const incidentActive = computed(() => degradedCount.value > 0)
const { open: openIncident } = useIncidentModal()
function tone(s: PlatformService): 'ok' | 'warn' | 'bad' {
return s.status
@@ -41,7 +42,7 @@ function label(s: PlatformService) {
<div class="title">{{ INCIDENT.title }}</div>
<div class="sub">Started {{ INCIDENT.started }} · IC: {{ INCIDENT.ic }}</div>
</div>
<UiButton variant="primary" disabled>Open incident</UiButton>
<UiButton variant="primary" @click="openIncident">Open incident</UiButton>
</div>
<div class="grid">