Mobile experience overhaul: list-default, slim chrome, no Neo4j surface, clean sign-in - #77
Merged
Merged
Conversation
…ce, clean sign-in
Phones now land on a readable card list instead of the cramped graph, the
chrome no longer eats most of the screen, and Neo4j-specific strings/errors
are gone from the user surface (the app is D1-first / store-agnostic).
Workspace
- Default to the card list on phone-width screens (matchMedia, persisted to
localStorage); desktop still defaults to the graph.
- View-tab strip is horizontally scrollable on mobile so all eight tabs stay
reachable instead of clipping; tabs are more compact on small screens.
- Re-key the status chip and the in-graph connection banner off the GraphQL
data layer (the real signal) instead of Neo4j; genericize the copy
("Connected"/"Offline", "Connection Lost") so an unused Neo4j never shows
a scary "Database Connection Lost / Neo4j is not available".
- Hide the mini-map on mobile (it covered ~18% of a phone screen).
- Node inspector renders as a bottom sheet on mobile instead of being hidden.
- Slimmer header padding on small screens.
Layout / shell
- Mobile drawer is full-width with labels (Workspace, Ontology, …) instead of
unlabeled icons; guest indicator shows in the drawer.
- Dynamic viewport height (dvh) + safe-area insets (viewport-fit=cover) so the
app fills the visible area under collapsing mobile browser bars / notches.
View components
- CardView / ViewManager toolbar use tighter mobile padding.
- Project Health floating panel (320px) is desktop-only; it covered phones.
- Remove a per-row console.log spamming the table render.
Sign-in / sign-up
- Hide the OAuth block entirely when no provider is configured, so the dev
hint "Run: ./scripts/setup-oauth.sh" never reaches end users; neutral label
otherwise. Responsive header/form padding for narrow screens.
Tests
- tests/e2e/mobile-experience.spec.ts: phone lands on a list (no graph
canvas), no Neo4j/DB-down strings, no horizontal overflow, all eight tabs
reachable, mobile graph view is mini-map-free with no connection banner.
Verified: web typecheck + prod build clean; new mobile spec green; smoke gate
4/5 (the grow-flow case fails identically on clean develop against this local
DB — a pre-existing data-state issue, not from these changes; touches no
graph-canvas code).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
🧪 Comprehensive Test Suite
Full-stack smoke gate runs in the CI workflow. |
mvalancy
added a commit
that referenced
this pull request
Jun 16, 2026
…th-config log (#78) Follow-up sweep of the non-workspace pages at phone widths (concrete overflow / squeeze fixes found by a mobile audit): - Ontology: search/filter rows stack on mobile (flex-col → row at sm) instead of crushing the search input next to the count. - Admin: database-stats grid is 2-up on phones (was 1 tiny column), quick-actions and the TLS legend collapse responsively (sm:grid-cols-2) instead of overflowing. - Agents: header stacks title over actions on mobile and the action buttons wrap. - Sign-in/up: the optional OAuth-config fetch failing (expected on the D1-first cloud with no OAuth backend) now logs at debug, not as a red console error. Web typecheck clean. Workspace/Layout/sign-in mobile work shipped separately in #77. Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
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
1 participant
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.
Why
Phones wasted most of the screen on chrome built for desktop, landed on the cramped graph view, surfaced scary Neo4j-specific errors even though the app is D1-first / store-agnostic, and the sign-in page leaked a dev hint (
Run: ./scripts/setup-oauth.sh). This makes mobile a real "check in on the go" surface.What
Workspace
Shell / Layout
dvhheight + safe-area insets (viewport-fit=cover).Views
console.login TableView.Sign-in / Sign-up
Tests
tests/e2e/mobile-experience.spec.ts: list-default, no Neo4j/DB-down strings, no horizontal overflow at 390px, all 8 tabs reachable, mobile graph view mini-map-free with no banner.