Skip to content

feat(mobile): dedicated mobile shell — bottom nav + create FAB + graph lock toggle#81

Merged
mvalancy merged 1 commit into
developfrom
feat/mobile-bottom-nav
Jun 16, 2026
Merged

feat(mobile): dedicated mobile shell — bottom nav + create FAB + graph lock toggle#81
mvalancy merged 1 commit into
developfrom
feat/mobile-bottom-nav

Conversation

@mvalancy

Copy link
Copy Markdown
Member

Why

Per feedback: don't just shrink the desktop UI — give phones a clear, consistent, app-like experience.

What

  • Bottom tab bar (phones): List · Graph · More. List first (default check-in view), Graph second; the rest (Dashboard/Table/Board/Gantt/Calendar/Activity) in a clean More bottom sheet. The desktop tab strip is now desktop/tablet-only.
  • Create FAB (+) bottom-right for non-guests (hidden in graph view — grow flow handles creation there).
  • Graph lock/unlock toggle (phones): defaults to Locked so touch-panning never accidentally drags a node/edge label; unlock to edit. Implemented as a d3.drag.filter() on both drag behaviors via a live ref. Desktop is a no-op (interactionLocked false), so existing behavior/grow-flow is unchanged.

Tests

  • mobile-experience: bottom nav present + drives views, More sheet lists secondary views, lock defaults to Locked.
  • mobile-views: navigates via bottom nav/More sheet; all views still need no sideways scroll.
  • 10/10 mobile, typecheck clean. Smoke 4/5 with grow-flow green on isolated re-run (known local-DB flake; the IGV change is desktop-noop). CI fresh-seed gate is authoritative.

…create FAB, graph lock toggle

Not just "make the desktop UI fit" — a phone-first navigation model.

- Bottom tab bar (phones): List · Graph · More. List first (the check-in-on-
  the-go default), Graph second; the rest (Dashboard/Table/Board/Gantt/Calendar/
  Activity) live in a tidy "More" bottom sheet. Replaces the squeezed desktop tab
  strip on phones (the strip is now hidden md:flex / desktop+tablet only).
- Create FAB (+) bottom-right on phones for non-guests (hidden in graph view,
  where the on-canvas grow flow creates nodes).
- Graph lock/unlock toggle (phones): defaults to Locked so a touch pans the
  canvas and never accidentally drags a node or edge label; unlock to edit.
  Implemented as a d3.drag .filter() on both the node and edge-label drag
  behaviors, reading a live ref (no handler re-bind on toggle). Desktop is a
  no-op (interactionLocked is false there), so the grow flow etc. are unchanged.
- Plumbed interactionLocked through SafeGraphVisualization → IGV.

Tests: mobile-experience now asserts the bottom nav drives views + the lock
defaults to Locked; mobile-views navigates via the bottom nav/More sheet.
mobile specs 10/10; web typecheck clean; smoke 4/5 with grow-flow passing on
isolated re-run (known local-DB flake; IGV change is desktop-noop).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@github-actions

Copy link
Copy Markdown

🧪 Comprehensive Test Suite

  • Unit suites (Node 18.x & 20.x) — core, web, server, mcp-server: ✅ passed
  • Installer & deploy config: ✅ passed

Full-stack smoke gate runs in the CI workflow.

@mvalancy mvalancy merged commit 76e6e49 into develop Jun 16, 2026
16 checks passed
@mvalancy mvalancy deleted the feat/mobile-bottom-nav branch June 16, 2026 21:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant