Ben Stull
999c4b65ef
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>
58 lines
2.2 KiB
React
58 lines
2.2 KiB
React
import React from 'react'
|
|
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
|
import { render, screen, waitFor } from '@testing-library/react'
|
|
import { MemoryRouter, Routes, Route } from 'react-router-dom'
|
|
import ProjectLayout from './ProjectLayout.jsx'
|
|
|
|
vi.mock('../api', () => ({ getProject: vi.fn() }))
|
|
vi.mock('../context/DeploymentProvider', () => ({
|
|
useDeployment: () => ({ defaultProjectId: 'default', name: 'Dep', projects: [] }),
|
|
}))
|
|
import { getProject } from '../api'
|
|
|
|
function renderAt(path) {
|
|
return render(
|
|
<MemoryRouter initialEntries={[path]}>
|
|
<Routes>
|
|
<Route path="/p/:projectId/*" element={
|
|
<ProjectLayout><div data-testid="corpus">CORPUS</div></ProjectLayout>
|
|
} />
|
|
</Routes>
|
|
</MemoryRouter>,
|
|
)
|
|
}
|
|
|
|
describe('ProjectLayout', () => {
|
|
beforeEach(() => {
|
|
vi.clearAllMocks()
|
|
document.documentElement.style.removeProperty('--c-accent')
|
|
})
|
|
|
|
it('renders the corpus children for the corpus-served default project', async () => {
|
|
getProject.mockResolvedValue({ id: 'default', name: 'OHM', type: 'document', theme: {} })
|
|
renderAt('/p/default/')
|
|
expect(await screen.findByTestId('corpus')).toBeInTheDocument()
|
|
})
|
|
|
|
it('applies the project theme to :root and resets it on unmount', async () => {
|
|
getProject.mockResolvedValue({ id: 'default', name: 'OHM', type: 'document', theme: { accent: '#123456' } })
|
|
const { unmount } = renderAt('/p/default/')
|
|
await waitFor(() =>
|
|
expect(document.documentElement.style.getPropertyValue('--c-accent')).toBe('#123456'))
|
|
unmount()
|
|
expect(document.documentElement.style.getPropertyValue('--c-accent')).toBe('')
|
|
})
|
|
|
|
it('shows the not-served placeholder for a non-default (Plan-B) project', async () => {
|
|
getProject.mockResolvedValue({ id: 'other', name: 'Ecomm', type: 'bdd', theme: {} })
|
|
renderAt('/p/other/')
|
|
expect(await screen.findByText(/isn.t being served here yet/i)).toBeInTheDocument()
|
|
expect(screen.queryByTestId('corpus')).not.toBeInTheDocument()
|
|
})
|
|
|
|
it('shows a not-found message when the project 404s', async () => {
|
|
getProject.mockRejectedValue(Object.assign(new Error('nope'), { status: 404 }))
|
|
renderAt('/p/ghost/')
|
|
expect(await screen.findByText(/Not found/i)).toBeInTheDocument()
|
|
})
|
|
}) |