Import, Suggestions, and Trash are unreachable on mobile #89

New issue

Closed

opened 2026-07-15 19:49:58 +00:00 by claude-bot · 1 comment

claude-bot commented

2026-07-15 19:49:58 +00:00

Contributor

Severity: High · Confidence: High · Effort: S · Category: ui

Evidence

app/src/components/layout/BottomNav.tsx:3-59 - mobile tabs: Entries, Motifs, Timeline, Insights, Search, Settings only.
app/src/components/layout/Shell.tsx:137-146,167 - /import and /suggestions links live only in the hidden . md:block desktop header; 191-203 - /trash link also desktop-only.
No to="/import"|"/trash"|"/suggestions" reference exists outside that desktop header block.

Problem
On a phone (<768px) there is no tab, button, or link anywhere that navigates to Import, Suggestions, or Trash. They exist only as directly-typed URLs.

Impact
Three shipped features - data import, AI-suggested connections, and the trash/undo safety net - are invisible and unusable on the app's stated primary device.

Fix
Add a "More" overflow tab (or hamburger) on mobile surfacing the same items as the desktop nav.

Acceptance criteria

Import, Suggestions, and Trash are reachable via on-screen controls at <768px width.

Filed from the 2026-07-15 codebase audit. Full report: docs/.internal/report-2026-07-15.md (gitignored).

**Severity:** High · **Confidence:** High · **Effort:** S · Category: ui **Evidence** - `app/src/components/layout/BottomNav.tsx:3-59` - mobile tabs: Entries, Motifs, Timeline, Insights, Search, Settings only. - `app/src/components/layout/Shell.tsx:137-146,167` - `/import` and `/suggestions` links live only in the `hidden . md:block` desktop header; `191-203` - `/trash` link also desktop-only. - No `to="/import"|"/trash"|"/suggestions"` reference exists outside that desktop header block. **Problem** On a phone (<768px) there is no tab, button, or link anywhere that navigates to Import, Suggestions, or Trash. They exist only as directly-typed URLs. **Impact** Three shipped features - data import, AI-suggested connections, and the trash/undo safety net - are invisible and unusable on the app's stated primary device. **Fix** Add a "More" overflow tab (or hamburger) on mobile surfacing the same items as the desktop nav. **Acceptance criteria** - [ ] Import, Suggestions, and Trash are reachable via on-screen controls at <768px width. --- _Filed from the 2026-07-15 codebase audit. Full report: `docs/.internal/report-2026-07-15.md` (gitignored)._

claude-bot added this to the v7.1.0 - Core hardening & security milestone

2026-07-15 19:49:58 +00:00

claude-bot added the

bug

label

2026-07-15 19:49:58 +00:00

rbrooks referenced this issue from a commit

2026-07-16 21:58:55 +00:00

fix(v7.1): wave 4 — mobile daily-use (#90, #89, #91)

claude-bot commented

2026-07-16 22:04:19 +00:00

Author

Contributor

Fixed in 4f8e0fe (v7.1.0 wave 4).

BottomNav now ends in a More tab (hamburger) that opens a bottom sheet with the routes that had no mobile entry point: Import, Suggestions, Trash, Settings — plus Admin and Federation when user.role === 'admin' (mirroring desktopNav). Shell passes isAdmin.

Design notes:

Settings moved into the sheet rather than adding a seventh tab — six tabs already fill a 375 px screen, and a seventh would have made every tab ~53 px wide (relevant to #112's 44 px target work).
The More tab shows as active when the current route is one of the overflow routes, so there's no "nothing is selected" state on /import etc.
Sheet items are min-h-12, dismiss on backdrop tap and on navigate, and carry role="menu"/aria-haspopup/aria-expanded.

Acceptance criteria:

Import, Suggestions, and Trash are reachable via on-screen controls at <768px width.

Verified on the dev server: app build clean, 63/63 app tests. CI green.

Not included: the Suggestions/Trash count badges (SuggestionsCountBadge / TrashCountBadge are local to Shell.tsx and aren't exported). Happy to surface them on the More tab as a follow-up if you want the unread signal on mobile.

Fixed in `4f8e0fe` (v7.1.0 wave 4). `BottomNav` now ends in a **More** tab (hamburger) that opens a bottom sheet with the routes that had no mobile entry point: **Import, Suggestions, Trash, Settings** — plus **Admin** and **Federation** when `user.role === 'admin'` (mirroring `desktopNav`). `Shell` passes `isAdmin`. Design notes: - Settings moved *into* the sheet rather than adding a seventh tab — six tabs already fill a 375 px screen, and a seventh would have made every tab ~53 px wide (relevant to #112's 44 px target work). - The More tab shows as active when the current route is one of the overflow routes, so there's no "nothing is selected" state on `/import` etc. - Sheet items are `min-h-12`, dismiss on backdrop tap and on navigate, and carry `role="menu"`/`aria-haspopup`/`aria-expanded`. **Acceptance criteria:** - [x] Import, Suggestions, and Trash are reachable via on-screen controls at <768px width. Verified on the dev server: app build clean, 63/63 app tests. CI green. Not included: the Suggestions/Trash count badges (`SuggestionsCountBadge` / `TrashCountBadge` are local to `Shell.tsx` and aren't exported). Happy to surface them on the More tab as a follow-up if you want the unread signal on mobile.

claude-bot closed this issue

2026-07-16 22:04:39 +00:00

claude-bot referenced this issue

2026-07-16 22:05:06 +00:00

Roadmap: sequence a core-hardening pass before v8 and test the v7 federation trust boundary #92