feat: re-parent onto template-docker v1.0.0; Track UI dependencies by crazyracer98 · Pull Request #3 · craftainer/template-react

crazyracer98 · 2026-10-21T18:34:45Z

Track UI wave PR. UI1-UI3 will be pushed to this same branch (integration/templates-sdks-ui) later, so this PR stays open until the wave is complete. Do not merge until then unless told otherwise.

What moved (UI0)

Re-parented onto template-docker v1.0.0: sync files (.github/template-sync-manifest.yml, template-sync-state.json at v1.0.0), Makefile, scripts/ (image-smoke.sh, image-scan.sh, skopeo.sh, runner-setup.sh, check-dockerfile-versions.sh), .devcontainer/Dockerfile + Dockerfile.dockerignore, workflows, .claude/ and docs/ replace-tier files. Replace-tier files verified byte-identical to template-docker v1.0.0 (git show v1.0.0:<path> | cmp).
app.Dockerfile (+ .dockerignore) -> Dockerfile; new image.mk with template-react's image values; ADR 0003 (linked from README.md).
Track UI dependencies in package.json / pnpm-lock.yaml: Fraunces + Instrument Sans fonts, @tanstack/react-query, motion, Storybook, Playwright, axe-core.
Nothing under src/ changed.

Decisions

nginx-unprivileged 1.30.6-alpine (Trivy clean); NODE_VERSION 24.22.0; motion 14.4.0 (minimumReleaseAge); pnpm-workspace.yaml allowBuilds: {esbuild: false}; Prettier-formatted lockfile; ADR 0003 linked from README.

Verification lane (craftainer-tc/template-react image, worktree mounted, docker socket)

prek run --all-files --hook-stage manual: all hooks passed (oxlint, prettier, tsc -b, vitest, template-sync-manifest, devcontainer-lock, hadolint, check-dockerfile-versions, image-scan/Trivy).
pnpm install --frozen-lockfile: lockfile up to date, supply-chain policies pass.
make build (RELEASE_ARCH=arm64): OCI tar built.
make release-check: unit tests 8/8 pass, image smoke answered 2xx.

After merge

The template-react devcontainer needs a rebuild (.devcontainer/Dockerfile, compose and feature versions changed). Only the user can trigger it.

Note: older open PR #2 (template-sync bootstrap v1.2.3) is unrelated and left untouched.

…cies - sync from craftainer/template-docker v1.0.0 (replace tier verbatim, merge tier hand-merged, manifest extended) - app.Dockerfile -> Dockerfile; devcontainer image now .devcontainer/Dockerfile; image.mk holds react's smoke values - nginx base 1.27.4 -> 1.30.6 (image-scan) - add storybook, playwright, axe, motion, fontsource Fraunces/Instrument Sans, TanStack Query; ADR 0003

- src/theme: MUI CSS-variable theme (light/dark, data selector), tokens, fonts, motion variants, ThemeProvider, useColorMode, contrast test - scripts/check-design-tokens.sh + design-tokens hook with self-test - docs/design principles, ADR 0004, manifest classification

crazyracer98 · 2026-10-21T20:09:54Z

UI1 landed (Field Ledger design system)

Merged wip/UI1 (25fa89c) plus a cleanup commit removing the unused @fontsource/roboto. Lane green: prek (manual stage), pnpm install --frozen-lockfile, pnpm build, make build, make release-check, design-token self-test.

Contents: src/theme/ (tokens, theme with colorSchemeSelector: "data" and system default mode, ThemeProvider, motion, useColorMode), scripts/check-design-tokens.sh and its hook, docs/design/, ADR 0004, manifest classification, main.tsx/App.tsx wiring. Known limit: one frame of the OS scheme can show on load (no pre-paint script).

Contrast (WCAG 2.2 AA, asserted at 4.5:1 by src/theme/contrast.test.ts):

Pair	Light	Dark
text.primary on paper	15.74	13.56
text.secondary on paper	7.11	7.29
text.secondary on default	6.65	7.92
primary on paper	5.68	5.80
primary contrastText on primary	5.75	6.30
secondary on paper	9.09	8.33
error on paper	7.45	6.85
warning on paper	5.92	7.88
info on paper	6.35	7.82
success on paper	5.97	8.52

Divider on paper is 1.47 (light) and 1.35 (dark); decoration only.

…nt axis, contrast pairs)

…lves)

crazyracer98 · 2026-10-22T06:45:20Z

UI2 landed: frontend-design and ui-verify skills (ui-verify uses a W3C-WebDriver helper, shoot.mjs, instead of the Playwright MCP), .mcp.json with @mui/mcp@0.1.8, .claude/README.md. No manifest change (react-added skills survive syncs). Also: ADR 0003 note that UI1 removed @fontsource/roboto; token lint now skips *.test.ts(x) but keeps stories, with self-test fixtures. Lane green: prek, frozen install, build, token self-test. Signed-out axe findings and mobile wrap are left for UI3.

…ate trailing slash

- Storybook 10 with light/dark toolbar, auth and API stubs, stories for App, HeroesPage and HealthStatus - Playwright toHaveScreenshot and axe suite in tests/visual/, run in the pinned Playwright image; arm64 baselines committed - visual.yml CI job (arm64 runner, report artifact on failure); ADR 0005; manifest tiers - Signed-out page: main landmark, h1, labelled spinners, no wrapping at 390px; matchMedia guard in useColorMode

- shoot.mjs fails on a null or mismatched scheme - SKILL.md, design README and ADRs 0004/0005 name the real attribute

- dot directories are not matched by a bare directory include, so list the globs

- run.sh and visual.yml use the multi-arch index digest - ADR 0005 documents bumping tag and digest together

- MuiDialog and MuiPopover paper: no shadow, 2px/1px text-color border - regenerate the Add-hero dialog baselines (only these two changed)

crazyracer98 · 2026-10-22T07:42:08Z

UI3 landed (merge of wip/UI3 into the integration branch) plus four follow-ups.

UI3: Storybook 10 with stories for App, HeroesPage and HealthStatus; tests/visual/ (Playwright toHaveScreenshot plus axe, run in the pinned Playwright image, arm64 baselines); .github/workflows/visual.yml on the arm64 runner; ADR 0005; signed-out page fixes, labelled spinners, matchMedia guard.

Follow-ups, one commit each:

ui-verify shoot.mjs now reads html[data-dark]/html[data-light] and fails on a null or mismatched scheme (verified with a real run: scheme=light/dark on all 6 shots); SKILL.md, design README and ADRs 0004/0005 name the real attribute.
.storybook/*.ts(x) is type-checked through tsconfig.app.json (verified: an injected type error fails tsc -b).
Playwright image pinned by tag and index digest (@sha256:7852dc5a...) in run.sh and visual.yml; ADR 0005 says to bump both together.
Dialog and popover paper: ink rule instead of drop shadow; only the two Add-hero dialog baselines changed.

Lane green: prek (manual stage), frozen install, build, storybook build, tests/visual/run.sh twice with 64/64 and zero diffs, design-token self-test.

- run.sh forces linux/arm64; stories fail unless the render phase is finished - serve.mjs: separator-safe traversal guard, 400 on malformed escapes - HealthStatus reads 'Backend checking…' (baselines regenerated) - shoot.mjs keeps the requested mode instead of parsing the file name - .dockerignore skips tests and Storybook/Playwright output

…hase check) - run.sh refuses non-arm64 hosts and no longer swallows a leading option - stories wait for phase finished with one expect.poll - .dockerignore skips .pnpm-store

- replace tier: Makefile, image scripts (smoke, scan, skopeo, runner-setup), test-image-scripts.sh, claude/plan docs - merge tier: .dockerignore, .pre-commit-config.yaml, manifest, READMEs, docs/TEMPLATE.md - state: v1.0.0 -> v1.2.0

crazyracer98 · 2026-10-22T11:51:05Z

Template sync v1.0.0 -> v1.2.0 (applied with template_sync.py apply; 0 conflicts, nothing removed upstream).

Syncs from v1.0.0 to v1.2.0 of craftainer/template-docker.

Files changed

replace: .claude/agents/plan-executor.md
replace: .claude/skills/plan-execution/SKILL.md
replace: CLAUDE.md
replace: Makefile
replace: docs/plans/README.md
replace: scripts/check-dockerfile-versions.sh
replace: scripts/develop.d/README.md
replace: scripts/image-scan.sh
replace: scripts/image-smoke.sh
replace: scripts/post-create.d/README.md
replace: scripts/runner-setup.d/README.md
replace: scripts/runner-setup.sh
replace: scripts/skopeo.sh
replace: scripts/test-image-scripts.sh
merge (clean): .claude/README.md
merge (clean): .dockerignore
merge (clean): .github/template-sync-manifest.yml
merge (clean): .github/workflows/README.md
merge (clean): .pre-commit-config.yaml
merge (clean): docs/TEMPLATE.md
merge (clean): scripts/README.md

React-owned files checked, no change needed: Dockerfile (no --chmod), image.mk (all values still valid; REPO derivation lives in the Makefile), nginx runner does not use runner-setup.sh (optional). Lane: prek manual, pnpm build, make build sbom release-assets, release-check, visual (64 passed, 0 diffs) all green.

crazyracer98 added 6 commits October 21, 2026 18:17

Merge wip/UI0

8898163

fix(image.mk): mark unit-tests .PHONY

80ce5b5

Merge wip/UI1

0e21d08

chore(deps): remove unused @fontsource/roboto

511109c

crazyracer98 added 6 commits October 22, 2026 06:04

fix(ui): review round 1 (token lint negative px, hex lengths, opsz fo…

9c7b147

…nt axis, contrast pairs)

feat(claude): frontend-design and ui-verify skills, @mui/mcp

8f18bcc

fix(ui): review round 2 (heading scale, color toggle before mode reso…

0649c1c

…lves)

Merge wip/UI2

e494200

docs(adr): note UI1 removed @fontsource/roboto

eb88a93

fix(lint): token lint skips test files, keeps stories

9d89663

crazyracer98 and others added 10 commits October 22, 2026 06:47

fix(ui-verify): read data-mui-color-scheme for the scheme check

023a24e

fix(ui-verify,lint): keep partial axe results, wait for scheme, toler…

dda6772

…ate trailing slash

fix(ui-verify): report HTTP status for non-JSON hub errors

6401755

Merge wip/UI3: Storybook, visual regression, ADR 0005

459b8e8

fix(ui-verify): read html[data-dark]/[data-light] for the scheme check

271952e

- shoot.mjs fails on a null or mismatched scheme - SKILL.md, design README and ADRs 0004/0005 name the real attribute

build(storybook): type-check .storybook through tsconfig.app.json

5bfe9fd

- dot directories are not matched by a bare directory include, so list the globs

build(visual): pin the Playwright image by digest as well as tag

2992301

- run.sh and visual.yml use the multi-arch index digest - ADR 0005 documents bumping tag and digest together

docs(adr): note the digest pin in ADR 0005

cabb9b5

fix(theme): ink rule instead of drop shadow on dialogs and popovers

7b32c79

- MuiDialog and MuiPopover paper: no shadow, 2px/1px text-color border - regenerate the Add-hero dialog baselines (only these two changed)

crazyracer98 added 3 commits October 22, 2026 07:47

fix: review round 2 (run.sh arch guard and argument parsing, single p…

19a198f

…hase check) - run.sh refuses non-arm64 hosts and no longer swallows a leading option - stories wait for phase finished with one expect.poll - .dockerignore skips .pnpm-store

chore(template-sync): sync to template-docker v1.2.0

3bacd8d

- replace tier: Makefile, image scripts (smoke, scan, skopeo, runner-setup), test-image-scripts.sh, claude/plan docs - merge tier: .dockerignore, .pre-commit-config.yaml, manifest, READMEs, docs/TEMPLATE.md - state: v1.0.0 -> v1.2.0

crazyracer98 self-assigned this Oct 22, 2026

crazyracer98 merged commit c97d65b into main Oct 22, 2026
3 checks passed

crazyracer98 deleted the integration/templates-sdks-ui branch October 22, 2026 13:10

Navigation Menu

Repository navigation

feat: re-parent onto template-docker v1.0.0; Track UI dependencies - #3

feat: re-parent onto template-docker v1.0.0; Track UI dependencies#3
crazyracer98 merged 25 commits into
mainfrom
integration/templates-sdks-ui

crazyracer98 commented Oct 21, 2026

Uh oh!

crazyracer98 commented Oct 21, 2026

Uh oh!

crazyracer98 commented Oct 22, 2026

Uh oh!

crazyracer98 commented Oct 22, 2026

Uh oh!

crazyracer98 commented Oct 22, 2026

Uh oh!

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

crazyracer98 commented Oct 21, 2026

What moved (UI0)

Decisions

Verification lane (craftainer-tc/template-react image, worktree mounted, docker socket)

After merge

Uh oh!

crazyracer98 commented Oct 21, 2026

UI1 landed (Field Ledger design system)

Uh oh!

crazyracer98 commented Oct 22, 2026

Uh oh!

crazyracer98 commented Oct 22, 2026

Uh oh!

crazyracer98 commented Oct 22, 2026

Files changed

Uh oh!

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant