Ronni Baslund
8e6f73a921
Operator portal now wears its real chrome instead of placeholder spans.
Sidebar + topbar + page header all rendered against the carbon palette
from tokens.css.
Components ported from the source design (operator-app.jsx,
platform-ui.jsx, operator-screens.jsx) as Vue 3 SFCs in
apps/operator/components/:
Foundation: NodeMark (copied from portal), UiIcon (expanded to 31 icons
covering sidebar/topbar/sort/arrows)
Primitives: Card (3 surface variants), UiButton (primary / secondary /
ghost / dark / danger × sm / md / lg), DataTable (header + rows),
Badge (7 tones), Avatar (deterministic palette by name hash), Mono,
Eyebrow, StatusDot, PageHeader (with actions slot)
Shell: OpSidebar (collapsible 232<->56px, 12 nav items in 4 sections,
active-row highlight from route, badge slot, brand + user footer);
OpTopbar (env badge with prod/staging/dev variants, palette trigger
stub for the ⌘K work in O.8, on-call pill, bell, avatar)
Layouts: layouts/default.vue wires sidebar + topbar + slot; layouts/blank.vue
is used by the login page (definePageMeta layout:'blank'). app.vue now
wraps NuxtPage in NuxtLayout (the missing piece — without it Nuxt warns
"Your project has layouts but the <NuxtLayout /> component has not been
used" and renders nothing chrome-wise).
Composable composables/useSidebar.ts holds the collapsed state shared
between OpSidebar's toggle button and layouts/default.vue's ⌘[ keyboard
shortcut.
Verified in the browser:
- Sidebar renders all 12 nav links with section dividers, env badge shows
PROD, PageHeader resolves to the user's display name from
useOidcAuth().user
- Collapse toggle flips sidebar width 232↔56; nav rows become icon-only
- Smoke test on the placeholder home still returns 409 for the seeded
test-partner (token forwarding survives the layout refactor)
Gotcha documented in the plan: Vite 7.3 added a strict
server.allowedHosts check that returns plaintext 403 for any host header
that isn't the dev origin. The customer portal pre-dates this Vite
version; operator needs allowedHosts: ['operator.dezky.local'] in
nuxt.config.ts under vite.server.
Pages/index.vue replaces the bare HTML placeholder from O.3 with the
new PageHeader + Card primitives — same smoke-test functionality, much
better visual fidelity.
Real screen content (Tenants, Partners, Infrastructure, etc.) lands in
O.5+. This commit is the chrome, the smoke test, and the verification
that the design system primitives compose correctly.
79 lines
2.5 KiB
TypeScript
79 lines
2.5 KiB
TypeScript
// Nuxt 3 configuration for the Dezky operator portal.
|
|
// Separate app from apps/portal — different OAuth client, different cookies,
|
|
// different domain, stricter authorization. See docs/OPERATOR-PLAN.md.
|
|
|
|
export default defineNuxtConfig({
|
|
compatibilityDate: '2026-01-01',
|
|
devtools: { enabled: true },
|
|
|
|
modules: ['nuxt-oidc-auth'],
|
|
|
|
css: ['~/assets/styles/tokens.css', '~/assets/styles/base.css'],
|
|
|
|
app: {
|
|
head: {
|
|
htmlAttrs: { 'data-theme': 'dark' },
|
|
link: [
|
|
{ rel: 'preconnect', href: 'https://fonts.googleapis.com' },
|
|
{ rel: 'preconnect', href: 'https://fonts.gstatic.com', crossorigin: '' },
|
|
{
|
|
rel: 'stylesheet',
|
|
href: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap',
|
|
},
|
|
],
|
|
},
|
|
},
|
|
|
|
oidc: {
|
|
defaultProvider: 'oidc',
|
|
session: {
|
|
expirationCheck: true,
|
|
automaticRefresh: true,
|
|
},
|
|
middleware: {
|
|
globalMiddlewareEnabled: true,
|
|
customLoginPage: true,
|
|
},
|
|
providers: {
|
|
// Generic OIDC against the dezky-operator Authentik client. Same shape
|
|
// as the customer portal's config but pointed at a different provider
|
|
// and a different audience.
|
|
oidc: {
|
|
clientId: process.env.NUXT_OIDC_CLIENT_ID || '',
|
|
clientSecret: process.env.NUXT_OIDC_CLIENT_SECRET || '',
|
|
redirectUri: process.env.NUXT_OIDC_REDIRECT_URI || '',
|
|
authorizationUrl: 'https://auth.dezky.local/application/o/authorize/',
|
|
tokenUrl: 'https://auth.dezky.local/application/o/token/',
|
|
userInfoUrl: 'https://auth.dezky.local/application/o/userinfo/',
|
|
logoutUrl: 'https://auth.dezky.local/application/o/dezky-operator/end-session/',
|
|
openIdConfiguration:
|
|
'https://auth.dezky.local/application/o/dezky-operator/.well-known/openid-configuration',
|
|
scope: ['openid', 'profile', 'email', 'groups'],
|
|
userNameClaim: 'preferred_username',
|
|
responseType: 'code',
|
|
grantType: 'authorization_code',
|
|
pkce: true,
|
|
skipAccessTokenParsing: true,
|
|
exposeAccessToken: true,
|
|
},
|
|
},
|
|
},
|
|
|
|
vite: {
|
|
server: {
|
|
// Vite 7 added a strict host check; allow Traefik-fronted hostnames in dev
|
|
allowedHosts: ['operator.dezky.local'],
|
|
hmr: {
|
|
protocol: 'wss',
|
|
clientPort: 443,
|
|
},
|
|
},
|
|
},
|
|
|
|
nitro: {
|
|
routeRules: {
|
|
'/api/**': { cors: true },
|
|
},
|
|
},
|
|
})
|