479894446a
5 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
saravanakumardb1
|
e89f5ce8e6 |
feat(web/ui): migrate IntakeUrlBar input to common Input primitive
The IntakeUrlBar URL field was a raw <input> with ~10 lines of inline
styling carrying its own border/radius/background/font-size. This was
the last component on the dashboard surface still using a raw input
after UI5\u2013UI7, so the ratchet caught it as remaining drift.
Migrated:
- Raw <input> + inline style block \u2192 common <Input> primitive.
- Preserved the absolute-positioned content-type badge overlay by
keeping the wrapper <div style={{ position: 'relative' }}> and
using Input's style prop to right-pad when a badge is present.
- All attributes (type=url, value, onChange, onKeyDown, placeholder,
aria-label) preserved as-is so no behavioral change.
Ratchet impact:
raw interactive controls: 14 \u2192 13 (\u20131)
Lowered scripts/ui-drift-baseline.json from 14 to 13 with this commit
so the CI gate now enforces that bound. The remaining 13 raw controls
are intentional and tracked:
- NoteEditor toolbar buttons (9) \u2014 icon-tight, deliberately raw
- ArtifactPanel hidden file input (1) \u2014 must remain <input hidden>
- Search-mode radios (2) \u2014 would change UX to migrate to Radix RadioGroup
- NoteVersionsPanel disclosure button (1) \u2014 tight inline styling
Verified:
- pnpm --filter @notelett/web run typecheck \u2014 ok
- pnpm --filter @notelett/web run test \u2014 96/96 pass
- bash scripts/ui-drift-ratchet.sh \u2014 all categories at new baseline
|
||
|
saravanakumardb1
|
0c982de7e6 |
feat(web/ui8): remove legacy global classes + tighten audit regex + lock CI gate
UI8 closes the migration cycle started by UI0. The four legacy global
classes (.surface-card, .surface-muted, .badge, .input-shell) are
removed from web/src/app/globals.css and the CI ratchet now enforces
zero new occurrences across three of the four drift categories.
Changes:
1. Audit regex precision (scripts/ui-drift-audit.sh, scripts/ui-drift-ratchet.sh)
The previous pattern 'className="[^"]*(badge|surface-card|surface-muted|input-shell)'
matched the literal token anywhere inside className, which caused 21
false positives against Tailwind arbitrary values like
'bg-[color:var(--nl-surface-muted)]' where the legacy name appears
inside a 'var(--nl-...)' reference.
New pattern requires the legacy class to be a whole class token —
either at the start of className, or preceded by a space, and
followed by a space or closing quote. Result: 21 false positives
eliminated; the ratchet now reports an honest 0 for the legacy
category.
2. globals.css cleanup (web/src/app/globals.css)
Removed .surface-card, .surface-muted, .badge, .input-shell rules.
Only truly global utilities remain (typography, focus-visible,
sr-only, skip-link, motion preferences, layout grids). A header
comment documents that re-introductions should be solved at the
call-site with a primitive, not by restoring the global rule.
3. Ratchet baseline (scripts/ui-drift-baseline.json)
Final counts after UI5–UI8 across the session:
raw interactive controls 14 (was 38 at start)
legacy global surface classes 0 (was 92 at start)
hardcoded color literals 0 (no change, was already 0)
direct @bytelyst/ui imports 0 (no change, was already 0)
The 14 remaining raw controls are intentional and tracked:
NoteEditor toolbar buttons (10)
ArtifactPanel hidden file input (1)
search/page radio inputs (2)
NoteVersionsPanel disclosure button (1)
4. CI gate (.github/workflows/ci.yml release-guards job)
Documented that the ratchet is the canonical gate post-UI8: because
legacy/colors/imports baselines are 0, any new occurrence in those
three categories now fails CI. The strict-audit script is kept as
a local diagnostic tool but not wired as a gate (would fail on the
14 intentional raw controls).
5. Roadmap (docs/UI_UX_PLATFORM_CORE_ROADMAP.md)
Marked UI5, UI6, UI7, UI8 all complete with per-phase commit hashes
and explicit deliverables.
Cumulative migration impact (from initial baseline):
raw interactive controls 38 → 14 (-24, -63%)
legacy global surface classes 92 → 0 (-92, -100%)
Verified:
- pnpm run verify: backend 380/380, web 96/96, mobile 97/97
- bash scripts/ui-drift-ratchet.sh: all four categories at baseline
- bash scripts/ui-drift-audit.sh: only "Raw interactive controls"
category has matches (intentional, tracked above)
- Live Docker stack at http://localhost:3050 still serves 200,
backend health 200
|
||
|
saravanakumardb1
|
3288e28f5c |
feat(web/ui7): migrate note detail, palace, gaps/prompts pages, broadcast banner
Phase UI7 — completes the note detail surface, the Palace knowledge
exploration page + its panels, the knowledge-gaps page, the prompts
page empty states, and the broadcast banner. Brings the ratchet down
to 14 raw controls / 21 legacy class matches — both genuine remaining
intentional items (NoteEditor toolbar, hidden file input, audit false
positives matching Tailwind arbitrary values).
notes/[noteId]/page.tsx:
- 'Loading' badge → Badge variant=neutral.
- Loading/error sections → Card.
- Review-state link → Link wrapping Badge.
palace/page.tsx:
- Wing <select> → Select with options=[{value,label}].
palace components:
- PalacePanel.tsx — search input → Input, hall chip → Badge.
- MemoryTimeline.tsx — hall chip → Badge.
- KnowledgeGraphView.tsx — entity query input → Input.
workspaces/[id]/gaps/page.tsx:
- Topic Coverage section → Card, chip → Badge.
- Empty-state + per-gap items → Card.
prompts/page.tsx:
- Loading + empty-state divs → Card.
landing page (/):
- section.surface-card → Card.
- 'Backend-backed web surface' badge → Badge.
- 'Open dashboard'/'Browse workspaces' links → utility classes.
share/[token]/page.tsx:
- Read-only public share badge → Badge.
- Main content surface-card + input-shell body wrapper → Card with
bordered body container.
BroadcastBanner.tsx:
- CTA + Dismiss raw <button> → Button (ghost variant, size sm).
Cumulative ratchet impact since session start:
raw interactive controls 38 → 14 (-24)
legacy global surface classes 92 → 21 (-71)
hardcoded color literals 0 (clean)
direct @bytelyst/ui imports 0 (clean)
Verified: pnpm typecheck, test (96/96), ratchet at new baseline.
|
||
|
saravanakumardb1
|
2408f43426 |
feat(web/ui5+ui7): migrate 12 components to @bytelyst/ui primitives
Finishes UI5 and kicks off UI7 by migrating the remaining form-heavy components plus the note-detail right-rail panels. Drops legacy class matches from 92 → 67 (-25) and raw interactive controls from 38 → 25 (-13). Ratchet baseline updated to the new floor. Components migrated: UI5 finish: - NoteEditor.tsx — surface-card wrapper → Card, title input → Input, Tiptap editor className updated to use border + bg classes instead of input-shell. Toolbar buttons left as raw (intentional, tightly styled icon controls). - SmartActionsPanel.tsx — result panel surface-muted → Tailwind bg-[var(--nl-surface-muted)] utility. - ArtifactPanel.tsx — section→Card, badge→Badge, all three input-shell inputs/selects/textareas→Input/Select/Textarea, surface-muted form shell + per-artifact row → Tailwind bg-utility, raw <button> Open → Button. - CommandPalette.tsx — surface-card command sheet → Tailwind layered classes, search input → Input (now ref-forwarded), kind badge → Badge. UI7 component pass: - MetadataPanel.tsx — section→Card, tag badge→Badge. - LinkedNotesPanel.tsx — section→Card, surface-muted link row → Tailwind bg-utility with hover state. - PalaceStats.tsx — section→Card, inline styles → Tailwind utilities. - ExtractedTasksPanel.tsx — surface-muted row → Tailwind. - NoteVersionsPanel.tsx — all three section/surface-card variants → Card + raw button → preserved (interactive disclosure). - Pagination.tsx — raw <button> Previous/Next → Button, surface-muted → built-in secondary variant. - TaskReviewPanel.tsx — full migration: section→Card, badge→Badge, input-shell + textarea + raw button → Input/Textarea/Button. - SurveyBanner.tsx — survey answer input-shell → Input. Adapter changes: - web/src/components/ui/Primitives.tsx — Input and Textarea now use React.forwardRef so callers like CommandPalette can attach refs. Verified: - pnpm --filter @notelett/web run typecheck: passes - pnpm --filter @notelett/web test: 96/96 still pass - pnpm run audit:ui:ratchet: at new baseline (25/67/0/0) - pnpm run audit:ui: legacy class matches now in dashboard / search / workspaces / notes-detail / palace / chat pages (UI6/UI7 page targets) |
||
|
saravanakumardb1
|
78433b0e45 |
feat(ci): one-way UI drift ratchet to prevent regressions
UI8 deferred deleting the legacy global classes (.surface-card, .surface-muted, .input-shell, .badge) because 69+ call sites in UI6/UI7 territory (dashboard, search, workspaces, notes detail, chat, palace) still depend on them. Removing the globals before those screens migrate would visually break the app. Instead, ship a one-way ratchet that solves the actually-important problem: prevent NEW legacy usage from creeping in while existing sites get migrated. - scripts/ui-drift-ratchet.sh — reads scripts/ui-drift-baseline.json and FAILS if any of the four UI drift categories regress above the tracked baseline. Pure bash, no jq required, works with grep or ripgrep. Uses the same patterns as scripts/ui-drift-audit.sh. - scripts/ui-drift-baseline.json — checked-in baseline captured today: raw controls 38, legacy classes 92, hardcoded colors 0, direct imports 0. - package.json — adds pnpm run audit:ui:ratchet and audit:ui:ratchet:update scripts. - .github/workflows/ci.yml release-guards job — runs the ratchet as a required step plus the existing audit in report mode. - docs/UI_UX_PLATFORM_CORE_ROADMAP.md — marks the CI-guard checklist item complete, documents the path to fully strict mode (drive baseline to zero, then delete globals.css legacy classes, then flip audit:ui:strict from advisory to required). Verified: - Ratchet at baseline: exits 0 - Synthetic regression (added a file with surface-card + raw <input>): ratchet correctly exits 1, reporting +1 in each affected category - pnpm run verify: backend 380/380, web 96/96, mobile 97/97 (no behavior change) |