§22 M3 frontend: /p/<project>/ routing, runtime branding, directory, 308s (v0.35.0)

Implements the M3-frontend slice of the §22 multi-project track, per docs/superpowers/specs/2026-06-03-m3-frontend-design.md (design merged in #10). Completes the runtime-config cut 0.33.0 (M3-backend Plan A) began. Frontend: - DeploymentProvider boots GET /api/deployment → {name, tagline, defaultProjectId, projects}; brandTitle() neutral 'RFC' pre-fetch fallback. - /p/:projectId/* routing with generic /e/<slug> segment. ProjectLayout fetches /api/projects/:id, applies per-project theme (reset on switch), provides ProjectContext, guards the corpus (served only for the default; others get NotServedPlaceholder — decouples this slice from Plan B). - Directory at / (2+ projects) with N=1 redirect into the single project; ProjectSwitcher in deployment chrome; entry-noun by project type. - VITE_APP_NAME hard cut: removed from vite.config + index.html; the 6 brand reads now use deployment.name via context; static <title>RFC</title> + JS document.title. Internal /rfc·/proposals links → /p/<project>/e|proposals via lib/entryPaths. Backend: - GET /api/deployment returns default_project_id (the guard contract). - Server-side 308s: /rfc/<slug>, /rfc/<slug>/pr/<n>, /proposals/<n> → /p/<default>/… . nginx (testing + prod) routes /rfc/ and /proposals/ to the backend. Tests: 3 new backend redirect/deployment tests (438 pass); Vitest unit for DeploymentProvider, ProjectLayout (theme/guard/404), Directory (11 pass); clean build with no VITE_APP_NAME. Playwright e2e deferred until Tier-1 seeds a registry (see CHANGELOG 0.35.0 step 5). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-04 05:58:59 -07:00
parent 0252e40527
commit 999c4b65ef
39 changed files with 798 additions and 99 deletions
@@ -0,0 +1,62 @@
+// §22.9 (M3) — runtime deployment config, replacing the build-time
+// VITE_APP_NAME. Fetches GET /api/deployment once on boot and provides it to
+// the whole tree:
+//
+//   { name, tagline, defaultProjectId, projects[], loading }
+//
+// `projects` is the per-caller-visible set (§22.5: public + member-gated;
+// unlisted omitted). `defaultProjectId` is the corpus-served project the
+// M3-frontend guard keys on. During the pre-fetch paint, consumers fall back
+// to the neutral brandTitle() default ('RFC') — never a hardcoded deployment
+// name.
+import { createContext, useContext, useEffect, useState } from 'react'
+import { getDeployment } from '../api'
+
+const DeploymentContext = createContext({
+  name: '',
+  tagline: '',
+  defaultProjectId: null,
+  projects: [],
+  loading: true,
+})
+
+export function useDeployment() {
+  return useContext(DeploymentContext)
+}
+
+export function DeploymentProvider({ children }) {
+  const [state, setState] = useState({
+    name: '',
+    tagline: '',
+    defaultProjectId: null,
+    projects: [],
+    loading: true,
+  })
+
+  useEffect(() => {
+    let cancelled = false
+    getDeployment()
+      .then(d => {
+        if (cancelled) return
+        setState({
+          name: d.name || '',
+          tagline: d.tagline || '',
+          defaultProjectId: d.default_project_id || null,
+          projects: Array.isArray(d.projects) ? d.projects : [],
+          loading: false,
+        })
+      })
+      .catch(() => {
+        // A failed deployment fetch must not wedge the app: fall back to the
+        // neutral brand and an empty directory so the shell still paints.
+        if (!cancelled) setState(s => ({ ...s, loading: false }))
+      })
+    return () => { cancelled = true }
+  }, [])
+
+  return (
+    <DeploymentContext.Provider value={state}>
+      {children}
+    </DeploymentContext.Provider>
+  )
+}
@@ -0,0 +1,45 @@
+import React from 'react'
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render, screen, waitFor } from '@testing-library/react'
+import { DeploymentProvider, useDeployment } from './DeploymentProvider'
+
+vi.mock('../api', () => ({ getDeployment: vi.fn() }))
+import { getDeployment } from '../api'
+
+function Probe() {
+  const { name, defaultProjectId, projects, loading } = useDeployment()
+  return (
+    <div>
+      <span data-testid="loading">{String(loading)}</span>
+      <span data-testid="name">{name}</span>
+      <span data-testid="default">{defaultProjectId || ''}</span>
+      <span data-testid="count">{projects.length}</span>
+    </div>
+  )
+}
+
+describe('DeploymentProvider', () => {
+  beforeEach(() => vi.clearAllMocks())
+
+  it('provides fetched deployment config', async () => {
+    getDeployment.mockResolvedValue({
+      name: 'Wiggleverse',
+      tagline: 'a directory',
+      default_project_id: 'ohm',
+      projects: [{ id: 'ohm', name: 'OHM', type: 'document', visibility: 'public' }],
+    })
+    render(<DeploymentProvider><Probe /></DeploymentProvider>)
+    await waitFor(() => expect(screen.getByTestId('loading').textContent).toBe('false'))
+    expect(screen.getByTestId('name').textContent).toBe('Wiggleverse')
+    expect(screen.getByTestId('default').textContent).toBe('ohm')
+    expect(screen.getByTestId('count').textContent).toBe('1')
+  })
+
+  it('falls back gracefully when the fetch fails (empty, not wedged)', async () => {
+    getDeployment.mockRejectedValue(new Error('boom'))
+    render(<DeploymentProvider><Probe /></DeploymentProvider>)
+    await waitFor(() => expect(screen.getByTestId('loading').textContent).toBe('false'))
+    expect(screen.getByTestId('name').textContent).toBe('')
+    expect(screen.getByTestId('count').textContent).toBe('0')
+  })
+})