bytelyst/learning_ai_notes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
2340be157e
learning_ai_notes/docs/roadmaps/03_WEB_ROADMAP.md
saravanakumardb1 c3831176a6 feat(web): harden shell keyboard navigation
2026-03-10 09:14:33 -07:00

4.6 KiB
Raw Blame History

Web Roadmap

Status: In Progress Parent: docs/ROADMAP.md Stack: Next.js 16 + React 19 + TypeScript

Phase W0 — Scaffold

  • Create Next.js app structure
  • Wire @bytelyst/api-client
  • Wire @bytelyst/platform-client
  • Wire @bytelyst/react-auth
  • Wire @bytelyst/telemetry-client
  • Wire @bytelyst/diagnostics-client
  • Import shared tokens
  • Create app shell/layout
  • Define route structure

Phase W1 — Core Product Shell

  • Authenticated shell
  • Sidebar/navigation
  • Dashboard page
  • Workspace page
  • Note detail/editor page
  • Search page
  • Settings page
  • Empty/loading/error states

Phase W2 — Notes MVP UX

  • Full note editor experience
  • Note metadata panel
  • Linked notes UI
  • Artifact/attachment UI
  • Task extraction/review UI
  • Workspace filters and saved views
  • Keyboard navigation improvements
  • Dense knowledge UX polish

Phase W3 — Agent UX

  • Agent activity timeline
  • Approval queue UI
  • Before/after proposal review UI
  • Audit filters and review surfaces
  • Product-specific operator workflows

Phase W4 — Search / Retrieval UX

  • Advanced search UI
  • Smart views / saved searches if in scope
  • Relationship-aware navigation UI
  • Higher-density overview improvements

Phase W5 — Hardening

  • Performance pass
  • Accessibility pass
  • Token validation pass
  • Production build passes
  • UX polish pass

High-Collision Areas

  • top-level layout files
  • auth provider setup
  • navigation config
  • token/theme entrypoints

Progress Notes

  • 2026-03-10
    • Created a new web/ Next.js 16 scaffold from scratch because the repo started docs-only.
    • Added ByteLyst shared package wiring for auth, platform client, telemetry, diagnostics, and shared design tokens.
    • Implemented the first production-shaped route shells:
      • landing page
      • app shell layout
      • sidebar navigation
      • dashboard
      • workspaces
      • note detail/editor
      • search
      • settings
      • not-found
    • Used mock notes/workspaces and demo auth fallback so UI work can proceed before backend contracts are finalized.
    • Expanded W2/W3 surfaces with:
      • note metadata panel
      • linked notes panel
      • task review panel
      • artifact panel
      • workspace filter/saved-view shell
      • advanced search filter/explainability shell
      • review route with approval queue, before/after proposal card, and agent timeline
    • Installed web/ dependencies and verified:
      • npm run typecheck
      • npm run build
    • Fixed verification issues:
      • aligned ProductUser with shared @bytelyst/react-auth BaseUser
      • guarded demo auth init so server prerender does not touch localStorage
    • Expanded the operational shell with:
      • saved view data wired into dashboard, workspaces, and search
      • denser search result rows with status/owner/workspace metadata
      • operator workflow summary cards on dashboard and reviews
      • workspace owner visibility for denser knowledge navigation
    • Hardened shared accessibility/keyboard affordances with:
      • skip-to-content support in the shared shell
      • stronger focus-visible treatment for interactive controls
      • clearer active-nav semantics via aria-current
      • keyboard/accessibility guidance surfaced in navigation/settings

Open Questions

  • What are the final values for:
    • product name
    • productId
    • backend port
    • domain identifiers
  • What are the exact product-backend endpoints and response shapes for:
    • auth
    • notes CRUD
    • workspaces CRUD
    • search
  • Which operator review/audit surfaces should stay product-local vs shared-dashboard-owned?

Blockers

  • Product identity is still draft-level in the planning docs, so the scaffold currently uses provisional values:
    • ByteLyst Agentic Notes
    • agentic-notes
    • 4016 as a placeholder notes API port in .env.example
  • Backend contracts are not implemented yet, so the current shell relies on mock data and demo auth fallback behavior.

Deferred

  • Real backend integration for notes, workspaces, auth, and search
  • Real saved-view persistence and backend-backed workspace filters
  • Artifact upload/download UX
  • Extraction-backed task review flows
  • Backend-backed agent activity timeline, approval queue, proposal diff review, and audit filtering
  • Remaining dense/accessibility polish and performance hardening
  • Remaining verification:
    • run npm test

Done When

  • Web is the strongest authoring and operator surface
  • Dense knowledge workflows feel production-shaped
  • Agent review and approval flows are usable