Skip to content

Make element details a navigation screen instead of an in-tree modal#17

Merged
dfalling merged 1 commit into
mainfrom
fix-account-menu-overlap
Jun 1, 2026
Merged

Make element details a navigation screen instead of an in-tree modal#17
dfalling merged 1 commit into
mainfrom
fix-account-menu-overlap

Conversation

@dfalling
Copy link
Copy Markdown
Owner

@dfalling dfalling commented Jun 1, 2026

Summary

  • The account menu was a root-level sibling rendered after MapScreen, so it (and its sheet) always painted over the hand-rolled fullscreen detail Sheet — RN paint order follows tree order and there's no cross-tree z-index. Fixed by promoting element details to a real screen.
  • Added @react-navigation/native + native-stack (react-native-screens). Authed app now renders a NavigationContainer with Map and ElementDetail routes; the detail screen covers the whole map screen, account menu included.
  • Moved AccountMenu out of App.tsx into src/account/AccountMenu.tsx and rendered it inside MapScreen (it's map chrome) so pushed screens cover it.
  • ElementDetailModalElementDetailScreen (reads route.params.elementId, closes via goBack()); dropped the fullscreen Sheet variant, which is now dead.
  • MapScreen drops its detailElementId state; the preview card's expand and the location-less search branch navigate() instead. Map stays mounted underneath, so camera/viewport and the preview-card fallback survive push/pop.
  • MainActivity.kt: super.onCreate(null), required by react-native-screens.
  • Detail screen uses the default slide_from_right forward transition.

Notes

  • react-native-screens is native, so this needs a rebuild (bun install + npx react-native run-android) — not just a Metro reload.

Verification

  • tsc --noEmit, biome check, and jest (5/5) all pass.

The account menu (a root-level sibling rendered after MapScreen) always
painted over the hand-rolled fullscreen detail Sheet, since RN paint order
follows tree order and there is no cross-tree z-index. Promoting element
details to a real native-stack screen lets it cover the whole map screen,
account menu included, and sets up Trip/Place detail to follow the same path.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@dfalling dfalling merged commit 3338cd7 into main Jun 1, 2026
2 checks passed
@dfalling dfalling deleted the fix-account-menu-overlap branch June 1, 2026 21:39
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