@prenta/admin 2.6.1 → 2.8.0

package/src/__tests__/views/document-edit-routes.render.test.tsx

@@ -0,0 +1,130 @@
+// @vitest-environment happy-dom
+import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+const docs: Record<string, Record<string, unknown>> = {
+  'doc-1': { id: 'doc-1', title: 'Shipping', status: 'DRAFT' },
+  'doc-42': { id: 'doc-42', title: 'Returns', status: 'DRAFT' },
+  'doc-43': { id: 'doc-43', title: 'Shipping (Copy)', status: 'DRAFT' },
+}
+const cmsApi = vi.fn(async (endpoint: string, options?: { method?: string; body?: string }) => {
+  const method = options?.method ?? 'GET'
+  if (method === 'POST' && endpoint === '/collections/faqs') {
+    const body = JSON.parse(options?.body ?? '{}')
+    return {
+      data: { id: String(body.title).includes('(Copy)') ? 'doc-43' : 'doc-42' },
+      status: 201,
+    }
+  }
+  const m = /^\/collections\/faqs\/(doc-\d+)$/.exec(endpoint)
+  if (m && method === 'GET') return { data: docs[m[1]!], status: 200 }
+  return { data: { docs: [] }, status: 200 }
+})
+vi.mock('../../lib/api.js', () => ({
+  cmsApi: (e: string, o?: unknown) => cmsApi(e, o as never),
+  ensureCsrfToken: vi.fn(async () => undefined),
+  setApiBase: vi.fn(),
+  getApiBase: () => '',
+}))
+
+const storage = new Map<string, string>()
+vi.stubGlobal('localStorage', {
+  getItem: (key: string) => storage.get(key) ?? null,
+  setItem: (key: string, value: string) => void storage.set(key, String(value)),
+  removeItem: (key: string) => void storage.delete(key),
+  clear: () => storage.clear(),
+})
+// PresenceIndicator opens a live stream for saved documents; happy-dom has none.
+vi.stubGlobal(
+  'EventSource',
+  class {
+    onerror: unknown = null
+    addEventListener() {}
+    close() {}
+  },
+)
+
+const { AdminRoot } = await import('../../AdminRoot.js')
+
+const config = {
+  collections: {
+    faqs: {
+      slug: 'faqs',
+      labels: { singular: 'FAQ', plural: 'FAQs' },
+      fields: [{ name: 'title', type: 'text', label: 'Title' }],
+    },
+  },
+}
+const session = { user: { id: 'u1', email: 'admin@example.com', role: 'ADMIN' } }
+
+function renderAt(path: string) {
+  window.history.replaceState({}, '', `/admin${path}`)
+  render(<AdminRoot config={config} session={session} initialPath={path} />)
+}
+
+// TextField's label isn't tied to its input, so find the input beside it.
+const titleInput = async () => {
+  // The first lazy load of the document view takes about 4-5s under full-suite load.
+  const label = await screen.findByText('Title', { selector: 'label span' }, { timeout: 15_000 })
+  return label.closest('div')!.querySelector('input') as HTMLInputElement
+}
+
+// happy-dom has no window.confirm; the router calls it for unsaved changes.
+const confirmSpy = vi.fn(() => false)
+beforeEach(() => {
+  Object.defineProperty(window, 'confirm', {
+    value: confirmSpy,
+    configurable: true,
+    writable: true,
+  })
+})
+afterEach(() => {
+  cleanup()
+  confirmSpy.mockClear()
+  cmsApi.mockClear()
+  window.history.replaceState({}, '', '/')
+})
+
+/**
+ * Collection documents through the real router (P-03 review A1, A2).
+ */
+describe('collection document routes', () => {
+  it('opens the created document without an unsaved-changes prompt, and loads it', async () => {
+    renderAt('/faqs/new')
+    fireEvent.change(await titleInput(), { target: { value: 'Returns' } })
+    fireEvent.click(screen.getByRole('button', { name: 'Create' }))
+
+    await waitFor(() => expect(window.location.pathname).toBe('/admin/faqs/doc-42'))
+    expect(confirmSpy).not.toHaveBeenCalled()
+    // A fresh editor loads the saved document.
+    await waitFor(() => expect(cmsApi).toHaveBeenCalledWith('/collections/faqs/doc-42', undefined))
+    expect((await titleInput()).value).toBe('Returns')
+    expect(
+      cmsApi.mock.calls.filter(
+        ([, o]) => (o as { method?: string } | undefined)?.method === 'POST',
+      ),
+    ).toHaveLength(1)
+  })
+
+  it('shows an empty form when going Back to /new after a create', async () => {
+    renderAt('/faqs/new')
+    fireEvent.change(await titleInput(), { target: { value: 'Returns' } })
+    fireEvent.click(screen.getByRole('button', { name: 'Create' }))
+    await waitFor(() => expect(window.location.pathname).toBe('/admin/faqs/doc-42'))
+
+    act(() => {
+      window.history.pushState({}, '', '/admin/faqs/new')
+      window.dispatchEvent(new PopStateEvent('popstate'))
+    })
+    await waitFor(async () => expect((await titleInput()).value).toBe(''))
+  })
+
+  it('loads the copy after Duplicate, so Save updates the copy with its own values', async () => {
+    renderAt('/faqs/doc-1')
+    await waitFor(async () => expect((await titleInput()).value).toBe('Shipping'))
+    fireEvent.click(screen.getByRole('button', { name: /Duplicate/ }))
+
+    await waitFor(() => expect(window.location.pathname).toBe('/admin/faqs/doc-43'))
+    await waitFor(async () => expect((await titleInput()).value).toBe('Shipping (Copy)'))
+  })
+})

package/src/__tests__/views/email-settings.render.test.tsx

@@ -100,7 +100,7 @@ describe('EmailSettingsTab', () => {
       target: { value: 'transactional' },
     })
 
-    fireEvent.click(screen.getByRole('button', { name: 'Save Changes' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Save changes' }))
 
     await waitFor(() => {
       const put = cmsApi.mock.calls.find(
@@ -145,7 +145,7 @@ describe('EmailSettingsTab', () => {
     expect(await screen.findByText(/ends in k3y9/)).toBeTruthy()
 
     fireEvent.change(from, { target: { value: 'new@example.com' } })
-    fireEvent.click(screen.getByRole('button', { name: 'Save Changes' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Save changes' }))
 
     await waitFor(() => {
       const put = cmsApi.mock.calls.find(

package/src/__tests__/views/form-entries.render.test.tsx

@@ -172,3 +172,25 @@ describe('FormEntries (All Entries)', () => {
     )
   })
 })
+
+/** TRACKING P-06: Inbox.html's count chips toggle their status filter. */
+describe('All Entries header chips', () => {
+  it('filters to unread from the unread chip, and back to all on a second click', async () => {
+    render(<FormEntries onNavigate={() => {}} />)
+    await screen.findByText('Jordan Avery')
+    const chip = await screen.findByRole('button', { name: /^\d+ unread$/, pressed: false })
+    expect(chip.className).toContain('rounded-pill')
+
+    fireEvent.click(chip)
+    await waitFor(() =>
+      expect(fetchEntries).toHaveBeenLastCalledWith(expect.objectContaining({ unread: true })),
+    )
+    expect(screen.getByRole('button', { name: 'Unread', pressed: true })).toBeTruthy()
+
+    fireEvent.click(screen.getByRole('button', { name: /^\d+ unread$/, pressed: true }))
+    await waitFor(() =>
+      expect(fetchEntries).toHaveBeenLastCalledWith(expect.not.objectContaining({ unread: true })),
+    )
+    expect(screen.getByRole('button', { name: 'All', pressed: true })).toBeTruthy()
+  })
+})

package/src/__tests__/views/form-submissions.render.test.tsx

@@ -156,3 +156,25 @@ describe('FormSubmissions table', () => {
     )
   })
 })
+
+/** TRACKING P-06: a form's entries are a second-level screen titled by the form. */
+describe('FormSubmissions header', () => {
+  it("titles the page with the form's sidebar label under a Forms breadcrumb", async () => {
+    render(<FormSubmissions formId="f1" onNavigate={() => {}} />)
+    expect(await screen.findByRole('heading', { level: 1, name: 'Contact Us' })).toBeTruthy()
+    const crumbs = screen.getByRole('navigation', { name: 'Breadcrumb' })
+    expect(crumbs.textContent).toBe('Dashboard/Forms/Contact Us')
+    expect(screen.getByRole('link', { name: 'Forms' }).getAttribute('href')).toContain('/forms')
+    expect(screen.queryByRole('button', { name: 'Back to Forms' })).toBeNull()
+  })
+
+  it('filters to starred from the starred chip', async () => {
+    render(<FormSubmissions formId="f1" onNavigate={() => {}} />)
+    await screen.findByText('Jordan Avery')
+    fireEvent.click(await screen.findByRole('button', { name: '0 starred', pressed: false }))
+    await waitFor(() =>
+      expect(fetchEntries).toHaveBeenLastCalledWith(expect.objectContaining({ starred: true })),
+    )
+    expect(screen.getByRole('button', { name: '0 starred', pressed: true })).toBeTruthy()
+  })
+})

package/src/__tests__/views/forms-list.render.test.tsx

@@ -169,3 +169,16 @@ describe('Forms list', () => {
     await waitFor(() => expect(screen.queryByRole('region', { name: 'Form schema' })).toBeNull())
   })
 })
+
+/** TRACKING P-06: Forms' header counts share the kit's count chip. */
+describe('Forms header chips', () => {
+  it('uses count chips: active in --suc, unread in --err while any are unread', async () => {
+    render(<Forms onNavigate={() => {}} />)
+    await screen.findByText('Contact Us')
+    for (const label of ['forms', 'active', 'total entries', 'unread']) {
+      expect(screen.getByText(label).className).toContain('rounded-pill')
+    }
+    expect(screen.getByText('active').querySelector('b')?.className).toContain('text-suc')
+    expect(screen.getByText('unread').className).toContain('text-err')
+  })
+})

package/src/__tests__/views/general-settings.render.test.tsx

@@ -63,6 +63,7 @@ const cmsApi = vi.fn(async (endpoint: string, options?: { method?: string }) =>
 vi.mock('../../lib/api.js', () => ({ cmsApi: (e: string, o?: unknown) => cmsApi(e, o as any) }))
 
 const { GeneralSettingsTab } = await import('../../views/settings/GeneralSettingsTab.js')
+const { Toaster } = await import('../../components/ui/Toaster.js')
 
 beforeEach(() => {
   cmsApi.mockClear()
@@ -70,7 +71,7 @@ beforeEach(() => {
 })
 
 describe('GeneralSettingsTab', () => {
-  it('renders the index status pill, loaded site info, and a clean (disabled) save bar', async () => {
+  it('renders the index status pill, loaded site info, and no save bar while clean', async () => {
     render(<GeneralSettingsTab role="ADMIN" />)
 
     await screen.findByLabelText('Site Title')
@@ -80,18 +81,22 @@ describe('GeneralSettingsTab', () => {
     expect((screen.getByLabelText('Site URL') as HTMLInputElement).value).toBe(
       'https://prentamedia.com',
     )
-    // Nothing dirty yet → Save disabled.
-    expect(
-      (screen.getByRole('button', { name: 'Save Changes' }) as HTMLButtonElement).disabled,
-    ).toBe(true)
+    // Nothing dirty yet → no save bar at all (save bars render only when dirty).
+    expect(screen.queryByRole('button', { name: 'Save changes' })).toBeNull()
+    expect(screen.queryByRole('button', { name: 'Reset' })).toBeNull()
   })
 
   it('enables Save when a field changes and persists site info to the settings global', async () => {
-    render(<GeneralSettingsTab role="ADMIN" />)
+    render(
+      <>
+        <GeneralSettingsTab role="ADMIN" />
+        <Toaster />
+      </>,
+    )
     const title = (await screen.findByLabelText('Site Title')) as HTMLInputElement
 
     fireEvent.change(title, { target: { value: 'Actuate Media Co' } })
-    const save = screen.getByRole('button', { name: 'Save Changes' }) as HTMLButtonElement
+    const save = screen.getByRole('button', { name: 'Save changes' }) as HTMLButtonElement
     expect(save.disabled).toBe(false)
 
     fireEvent.click(save)
@@ -102,6 +107,28 @@ describe('GeneralSettingsTab', () => {
         expect.objectContaining({ method: 'PUT' }),
       ),
     )
+    // The dirty-only bar is gone once saved; a toast confirms the save.
+    expect(await screen.findByText('Saved')).toBeTruthy()
+    await waitFor(() =>
+      expect(screen.queryByRole('region', { name: 'Unsaved changes' })).toBeNull(),
+    )
+  })
+
+  it('shows the save bar only once dirty, and Reset restores the saved values', async () => {
+    render(<GeneralSettingsTab role="ADMIN" />)
+    const title = (await screen.findByLabelText('Site Title')) as HTMLInputElement
+    expect(screen.queryByRole('button', { name: 'Save changes' })).toBeNull()
+
+    fireEvent.change(title, { target: { value: 'Actuate Media Co' } })
+    expect(screen.getByRole('region', { name: 'Unsaved changes' })).toBeTruthy()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Reset' }))
+    expect(title.value).toBe('Actuate Media')
+    expect(screen.queryByRole('button', { name: 'Save changes' })).toBeNull()
+    expect(cmsApi).not.toHaveBeenCalledWith(
+      '/globals/settings',
+      expect.objectContaining({ method: 'PUT' }),
+    )
   })
 
   it('blocks save and shows an error for an invalid Site URL', async () => {
@@ -113,7 +140,7 @@ describe('GeneralSettingsTab', () => {
 
     expect((await screen.findAllByText(/valid absolute URL/i)).length).toBeGreaterThan(0)
     expect(
-      (screen.getByRole('button', { name: 'Save Changes' }) as HTMLButtonElement).disabled,
+      (screen.getByRole('button', { name: 'Save changes' }) as HTMLButtonElement).disabled,
     ).toBe(true)
   })
 
@@ -133,12 +160,12 @@ describe('GeneralSettingsTab', () => {
     render(<GeneralSettingsTab role="ADMIN" />)
     await screen.findByLabelText('Site Title')
 
-    expect(screen.queryByText('Unsaved changes')).toBeNull()
+    expect(screen.queryByRole('region', { name: 'Unsaved changes' })).toBeNull()
     fireEvent.click(screen.getByRole('switch', { name: 'Default No Follow' }))
 
-    expect(await screen.findByText('Unsaved changes')).toBeTruthy()
+    expect(await screen.findByRole('region', { name: 'Unsaved changes' })).toBeTruthy()
     expect(
-      (screen.getByRole('button', { name: 'Save Changes' }) as HTMLButtonElement).disabled,
+      (screen.getByRole('button', { name: 'Save changes' }) as HTMLButtonElement).disabled,
     ).toBe(false)
   })
 

package/src/__tests__/views/header-footer-form.test.ts

@@ -0,0 +1,333 @@
+import { describe, expect, it } from 'vitest'
+import type { RegionSchema } from '@prenta/core'
+
+import {
+  announcementForm,
+  announcementProblem,
+  announcementSaveBody,
+  fieldProblem,
+  fromLocalInput,
+  humanizeKey,
+  menuListSlots,
+  overrideChips,
+  previewChrome,
+  regionForm,
+  regionSaveBody,
+  repoFileUrl,
+  timeAgo,
+  toLocalInput,
+} from '../../views/header-footer/chrome-form.js'
+import {
+  CODE_SAMPLES,
+  LOCAL_DEV_SAMPLE,
+  highlight,
+} from '../../views/header-footer/code-samples.js'
+
+const source = { repo: 'actuate/website', branch: 'main', commit: 'a41f9c2', readAt: '' }
+
+const header: RegionSchema = {
+  region: 'header',
+  component: './src/components/site/Header.astro',
+  variants: { default: 'Default', minimal: 'Logo + CTA' },
+  fields: {
+    logo: { type: 'brand', key: 'logo' },
+    menu: { type: 'menu', default: 'main' },
+    cols: { type: 'menu', list: true, max: 2 },
+    topMenu: { type: 'menu', optional: true },
+    cta: { type: 'link', optional: true },
+    contact: { type: 'link' },
+    phone: { type: 'text', optional: true, format: 'tel' },
+    email: { type: 'text', format: 'email' },
+    copy: { type: 'text', tokens: ['{year}'] },
+    tone: { type: 'select', options: ['dark', 'light'] },
+    sticky: { type: 'boolean', default: true },
+    social: { type: 'social' },
+  },
+  source,
+}
+
+describe('regionForm', () => {
+  it('fills every field with its default, in schema order, and skips brand fields', () => {
+    const form = regionForm(header, null)
+    expect(form.variant).toBe('default')
+    expect(Object.keys(form.fields)).toEqual([
+      'menu',
+      'cols',
+      'topMenu',
+      'cta',
+      'contact',
+      'phone',
+      'email',
+      'copy',
+      'tone',
+      'sticky',
+      'social',
+    ])
+    expect(form.fields).toMatchObject({
+      menu: 'main',
+      cols: [],
+      topMenu: { on: false, value: '' },
+      cta: { on: false, label: '', url: '' },
+      contact: { label: '', url: '' },
+      phone: { on: false, value: '' },
+      tone: 'dark',
+      sticky: true,
+      social: [],
+    })
+  })
+
+  it('keeps saved values that fit and falls back for those that do not', () => {
+    const form = regionForm(header, {
+      region: 'header',
+      variant: 'gone',
+      fields: { menu: 'other', tone: 'purple', sticky: false, phone: { on: true, value: '555' } },
+      orphans: [],
+      updatedBy: null,
+      updatedAt: null,
+    })
+    expect(form.variant).toBe('default')
+    expect(form.fields.menu).toBe('other')
+    expect(form.fields.tone).toBe('dark')
+    expect(form.fields.sticky).toBe(false)
+    expect(form.fields.phone).toEqual({ on: true, value: '555' })
+  })
+})
+
+describe('regionSaveBody', () => {
+  it('sends what PUT /chrome/:region accepts', () => {
+    const form = regionForm(header, null)
+    form.fields.menu = ''
+    form.fields.cols = ['company', '', 'company', 'legal']
+    form.fields.social = [
+      { platform: 'LinkedIn', url: 'https://linkedin.com/x' },
+      { platform: '', url: '' },
+    ]
+    const body = regionSaveBody(header, form)
+    expect(body.variant).toBe('default')
+    // An empty required menu or link is left out; brand fields never go.
+    expect('menu' in body.fields).toBe(false)
+    expect('contact' in body.fields).toBe(false)
+    expect('logo' in body.fields).toBe(false)
+    expect(body.fields.cols).toEqual(['company', 'legal'])
+    expect(body.fields.social).toEqual([{ platform: 'LinkedIn', url: 'https://linkedin.com/x' }])
+  })
+
+  it('leaves out untouched defaults, so the code keeps owning them', () => {
+    const form = regionForm(header, null)
+    form.fields.tone = 'light'
+    const body = regionSaveBody(header, form, {})
+    expect(body.fields).toEqual({ tone: 'light' })
+
+    // A saved value is sent back even when it equals the default.
+    const saved = { sticky: true, topMenu: { on: false, value: '' } }
+    const again = regionSaveBody(
+      header,
+      regionForm(header, {
+        region: 'header',
+        variant: 'default',
+        fields: saved,
+        orphans: [],
+        updatedBy: null,
+        updatedAt: null,
+      }),
+      saved,
+    )
+    expect(again.fields).toEqual(saved)
+  })
+})
+
+describe('menuListSlots', () => {
+  it('starts at three, grows as the list fills, and stops at max', () => {
+    expect(menuListSlots({ max: 3 }, 0)).toBe(3)
+    expect(menuListSlots({ max: 3 }, 3)).toBe(3)
+    expect(menuListSlots({ max: 2 }, 0)).toBe(2)
+    expect(menuListSlots({}, 0)).toBe(3)
+    expect(menuListSlots({}, 3)).toBe(4)
+    expect(menuListSlots({}, 20)).toBe(20)
+    // Never fewer than are saved, so each can be cleared.
+    expect(menuListSlots({ max: 2 }, 4)).toBe(4)
+  })
+})
+
+describe('fieldProblem', () => {
+  const fields = header.fields
+  it('mirrors the API checks', () => {
+    expect(fieldProblem(fields.topMenu!, { on: true, value: '' })).toBe(
+      'Pick a menu, or turn this off.',
+    )
+    expect(fieldProblem(fields.topMenu!, { on: false, value: '' })).toBeNull()
+    expect(fieldProblem(fields.cols!, ['a', 'b', 'c'])).toBe('Pick at most 2 menus.')
+    expect(fieldProblem({ type: 'menu', list: true }, ['a', 'b', 'c', 'd'])).toBeNull()
+    expect(fieldProblem(fields.cta!, { on: true, label: 'Go', url: '' })).toBe('Add the link URL.')
+    expect(fieldProblem(fields.cta!, { on: false, label: 'Go', url: '' })).toBeNull()
+    expect(fieldProblem(fields.cta!, { on: true, label: 'Go', url: 'javascript:x' })).toBe(
+      'Links can be a site path or an http(s), mailto or tel link.',
+    )
+    expect(fieldProblem(fields.contact!, { label: '', url: '' })).toBeNull()
+    expect(fieldProblem(fields.phone!, { on: true, value: 'call me' })).toBe(
+      'Enter a phone number.',
+    )
+    expect(fieldProblem(fields.email!, 'nope')).toBe('Enter an email address.')
+    expect(fieldProblem(fields.email!, 'a@b.co')).toBeNull()
+    expect(fieldProblem({ type: 'textarea', max: 3 }, 'abcd')).toBe('Keep it to 3 characters.')
+    expect(fieldProblem(fields.social!, [{ platform: '', url: 'https://x.com' }])).toBe(
+      'Pick a platform for each link.',
+    )
+  })
+})
+
+describe('announcement', () => {
+  const saved = {
+    id: 'ann_1',
+    on: true,
+    text: 'Hello',
+    link: null,
+    tone: 'brand' as const,
+    dismissible: true,
+    schedule: { startsAt: '2026-11-03T17:00:00.000Z', endsAt: null },
+  }
+
+  it('round-trips the schedule through datetime-local in the local zone', () => {
+    const form = announcementForm(saved)
+    expect(form.scheduled).toBe(true)
+    expect(form.startsAt).toBe(toLocalInput('2026-11-03T17:00:00.000Z'))
+    expect(fromLocalInput(form.startsAt)).toBe('2026-11-03T17:00:00.000Z')
+    expect(fromLocalInput('')).toBeNull()
+    expect(toLocalInput(null)).toBe('')
+    const body = announcementSaveBody(form)
+    expect(body).toEqual({
+      on: true,
+      text: 'Hello',
+      link: null,
+      tone: 'brand',
+      dismissible: true,
+      schedule: { startsAt: '2026-11-03T17:00:00.000Z', endsAt: null },
+    })
+    expect(announcementSaveBody({ ...form, scheduled: false }).schedule).toBeNull()
+  })
+
+  it('sends an untouched time back as saved, even in a repeated clock-change hour', () => {
+    // Each of these is the second of two equal local times somewhere: the
+    // fall-back hour in Los Angeles, New York and London.
+    for (const iso of [
+      '2026-11-01T09:30:00.000Z',
+      '2026-11-01T06:30:00.000Z',
+      '2026-10-25T01:30:00.000Z',
+    ]) {
+      const form = announcementForm({ ...saved, schedule: { startsAt: iso, endsAt: null } })
+      expect(announcementSaveBody(form).schedule?.startsAt).toBe(iso)
+    }
+  })
+
+  it('says what the API would refuse', () => {
+    const form = announcementForm(saved)
+    expect(announcementProblem(form)).toBeNull()
+    expect(announcementProblem({ ...form, text: ' ' })).toBe(
+      'Add a message before turning the bar on.',
+    )
+    expect(announcementProblem({ ...form, on: false, text: '' })).toBeNull()
+    expect(announcementProblem({ ...form, linkLabel: 'Book' })).toBe(
+      'Add the link URL, or clear the link text.',
+    )
+    expect(announcementProblem({ ...form, text: 'x'.repeat(111) })).toBe(
+      'Keep the message to 110 characters.',
+    )
+    expect(announcementProblem({ ...form, startsAt: '', endsAt: '' })).toBe(
+      'Pick when the bar starts or ends, or turn the schedule off.',
+    )
+  })
+})
+
+describe('overrideChips', () => {
+  const page = { id: 'p', collection: 'pages', title: 'T', path: '/t', locale: null }
+  it('writes the kit chips', () => {
+    expect(overrideChips({ ...page, header: { variant: 'minimal' } }, 'header')).toEqual([
+      'header:minimal',
+    ])
+    expect(
+      overrideChips({ ...page, header: { fields: { cta: { on: false }, menu: 'x' } } }, 'header'),
+    ).toEqual(['header.cta: off', 'header.menu'])
+    expect(overrideChips({ ...page, footer: null }, 'footer')).toEqual(['footer: none'])
+    expect(overrideChips({ ...page, footer: {} }, 'footer')).toEqual(['footer: inherits'])
+    expect(overrideChips({ ...page, footer: null }, 'header')).toEqual([])
+  })
+})
+
+describe('source card helpers', () => {
+  it('links the component in the repo', () => {
+    expect(repoFileUrl(source, './src/components/site/Header.astro')).toBe(
+      'https://github.com/actuate/website/blob/a41f9c2/src/components/site/Header.astro',
+    )
+    expect(
+      repoFileUrl({ ...source, repo: 'https://gitlab.com/acme/site.git' }, 'Header.astro'),
+    ).toBe('https://gitlab.com/acme/site/blob/a41f9c2/Header.astro')
+    expect(repoFileUrl({ ...source, repo: 'javascript:alert(1)' }, 'x')).toBeNull()
+    expect(repoFileUrl({ ...source, repo: '' }, 'x')).toBeNull()
+  })
+
+  it('says how long ago', () => {
+    const now = Date.parse('2026-10-21T12:00:00Z')
+    expect(timeAgo('2026-10-21T11:59:30Z', now)).toBe('just now')
+    expect(timeAgo('2026-10-21T11:59:00Z', now)).toBe('1 minute ago')
+    expect(timeAgo('2026-10-21T10:00:00Z', now)).toBe('2 hours ago')
+    expect(timeAgo('2026-10-18T12:00:00Z', now)).toBe('3 days ago')
+    expect(timeAgo(null, now)).toBe('never')
+  })
+
+  it('names keys', () => {
+    expect(humanizeKey('topMenu')).toBe('Top menu')
+    expect(humanizeKey('legal_menu')).toBe('Legal menu')
+  })
+})
+
+describe('previewChrome', () => {
+  it('sends the draft in the /public/chrome shape', () => {
+    const form = regionForm(header, null)
+    form.fields.cta = { on: false, label: 'Go', url: '/go' }
+    form.fields.copy = '© {year} Acme'
+    form.fields.cols = ['company']
+    const chrome = previewChrome({ header: { schema: header, form } }, null, {
+      menus: [
+        {
+          slug: 'company',
+          name: 'Company',
+          items: [{ id: '1', label: 'About', url: '/about', button: false, children: [] }],
+        },
+      ],
+      siteTitle: 'Acme',
+      now: new Date('2026-10-21T12:00:00Z'),
+    })
+    expect(chrome.announcement).toBeNull()
+    expect(chrome.header?.variant).toBe('default')
+    expect(chrome.header?.fields).toMatchObject({
+      logo: null,
+      cta: null,
+      copy: '© 2026 Acme',
+      cols: [{ id: 'company', name: 'Company', items: [{ label: 'About', url: '/about' }] }],
+      menu: null,
+      sticky: true,
+    })
+  })
+})
+
+describe('highlight', () => {
+  it('gives back each sample exactly, with comments, strings and keywords marked', () => {
+    for (const sample of [...CODE_SAMPLES.map((s) => s.src), LOCAL_DEV_SAMPLE]) {
+      expect(
+        highlight(sample)
+          .map((token) => token.text)
+          .join(''),
+      ).toBe(sample)
+    }
+    const tokens = highlight("import { a } from 'x'; // note")
+    expect(tokens).toEqual([
+      { kind: 'keyword', text: 'import' },
+      { kind: 'plain', text: ' { a } ' },
+      { kind: 'keyword', text: 'from' },
+      { kind: 'plain', text: ' ' },
+      { kind: 'string', text: "'x'" },
+      { kind: 'plain', text: '; ' },
+      { kind: 'comment', text: '// note' },
+    ])
+  })
+})