feat(host): add LacoWiki migration wireframes browser - #125
Closed
antosubash wants to merge 7 commits into
Closed
Conversation
Port the LacoWiki design handoff (claude.ai/design) into a single Inertia page at /lacowiki/wireframes — three tabs (Overview, Design system, Wireframes) covering all eight migration modules and the focused single-sample validation layout. Self-contained under host/client_app/lib/lacowiki/* with all rules scoped to .lw-app so the wireframes' raw 1px-line aesthetic doesn't leak into the rest of the host UI. Adds a biome override for the same paths to permit the array-index keys, anchor-as-button, and untitled SVGs that are idiomatic in mid-fidelity wireframes. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
Deploying simple-module-python with
|
| Latest commit: |
d7ff15e
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://7858e937.simple-module-python.pages.dev |
| Branch Preview URL: | https://claude-implement-lacowiki-wi.simple-module-python.pages.dev |
Biome's formatter pushed wf/datasets.tsx to 325 lines after the initial commit, breaking the 300-line cap. Extract WfDatasetDetail into wf/dataset-detail.tsx (147 lines) and re-export from datasets.tsx. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
The earlier split kept the dataset list table (which uses Pill for status badges) in datasets.tsx but accidentally dropped Pill from the import after the formatter rewrote the import line. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
Move the LacoWiki UI out of the host into a real plugin module so the host is just a shell. - Shared lacowiki primitives, chrome, design-system blocks, and styles.css move from host/client_app/lib/lacowiki/* to packages/ui/src/lacowiki/* and are exposed via subpath exports (./lacowiki/*, ./lacowiki/wf/*, ./lacowiki/styles.css). - New modules/lacowiki/ plugin owns its own Inertia pages (Home/Datasets/Legends/Sampling/Validation/Reports/Account), view endpoints under /lacowiki/*, sidebar menu entries, and locale dir. Registered in host/pyproject.toml + root pyproject.toml. - Host loses the /lacowiki/wireframes route and the LacoWikiWireframes.tsx page; only the public landing remains. - Smoke test: each /lacowiki/* page returns 200 via the authenticated client. Plus all existing checks (file-size cap, biome, ruff, ty, vite build, tsc) still pass. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
The lacowiki module is registered as an npm workspace but the lockfile hadn't been refreshed yet, so 'npm ci' in CI was failing. Run 'npm install' to register it. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
Drop the new lacowiki module and instead update the existing modules' pages with the wireframe design language. Per user feedback: don't duplicate existing modules, restyle the pages we already have. - packages/ui/src/styles/globals.css — switch to Inter for UI / display, pin primary scale to teal-cyan (oklch hue 200) to match the LacoWiki accent, drop gradient backgrounds, soften shadow tokens, and tighten --radius. Charts now draw from the LacoWiki land-cover palette. - host/templates/index.html — load Inter + JetBrains Mono instead of DM Sans + Outfit so the new --font tokens resolve to real fonts. - packages/ui/src/layouts/AuthCardShell.tsx — replace the minimal centered card with a two-column shell: form on the left, quiet map placeholder on the right. Login/Register/ForgotPassword/ResetPassword/ AcceptInvite/VerifyEmail all drop their nested Card wrappers and render directly inside the shell so the brand mark and layout don't get duplicated. - modules/dashboard/dashboard/pages/Home.tsx — replace gradient stat cards with restrained 1px-bordered tiles, mono uppercase labels, tabular-num values, and split system info into a health checklist column plus a flat module-chip list. - modules/users/users/pages/Profile.tsx — section nav + avatar block + two-column field grid, modeled on the WfAccount frame. - host/client_app/pages/Landing.tsx — light hero with map preview + accuracy callout and a feature row, replacing the dark gradient hero. Keeps existing i18n keys. - modules/lacowiki — removed in full (the previous "single-module" approach is gone). biome.json scope trimmed accordingly. Existing pages benefit from the global token updates without further per-page rewrites. https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
antosubash
marked this pull request as ready for review
May 6, 2026 10:52
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Ports the LacoWiki design handoff bundle (from claude.ai/design) into this codebase as a single Inertia page at
/lacowiki/wireframes. The page reproduces the three-tab review tool from the originalLacoWiki Wireframes.htmlprototype:What landed
host/client_app/pages/LacoWikiWireframes.tsx— Inertia page entry, tabs + topbarhost/client_app/lib/lacowiki/— primitives, chrome, design system, overview, and wireframe screens (one file per module group, all under the 300-line cap)host/client_app/lib/lacowiki/styles.css— CSS tokens + components, all scoped under.lw-appso the wireframes' raw 1px-line aesthetic doesn't leak into the rest of the host UIhost/routes.py— adds theGET /lacowiki/wireframesroutebiome.json— adds an override forhost/client_app/lib/lacowiki/**and the page that disablesnoArrayIndexKey,useJsxKeyInIterable,noSvgWithoutTitle,useValidAnchor,noStaticElementInteractions, etc., which are idiomatic in mid-fidelity wireframesThe tweaks panel (sketchiness toggle, density, accent hue) from the original prototype was intentionally dropped — it's a design-tool affordance, not part of the deliverable. Defaults are normal density, teal accent.
Test plan
make ci-check-file-size— no files exceed 300 linesmake ci-python-lint/make ci-python-typecheck— greenmake ci-js-lint/make ci-js-typecheck— greennpx vite build— emitsLacoWikiWireframes-*.jschunk (~75 kB / 15 kB gzip)uv run pytest host/tests— existing host route tests still passmake devand open/lacowiki/wireframes, confirm all three tabs render (not exercised in this session — please spot-check before merging)https://claude.ai/code/session_01AnJvhmDHXftJPBCL29eyhC
Generated by Claude Code