Skip to content

fix(xr): move Enter XR into View menu, drop iwer overlay#173

Merged
ecto merged 1 commit intomainfrom
xr-menu-bar
May 3, 2026
Merged

fix(xr): move Enter XR into View menu, drop iwer overlay#173
ecto merged 1 commit intomainfrom
xr-menu-bar

Conversation

@ecto
Copy link
Copy Markdown
Owner

@ecto ecto commented May 3, 2026

Summary

  • The floating Enter XR pill on desktop was @pmndrs/xr's bundled iwer device emulator, which auto-injects on localhost via the default emulate: 'metaQuest3'. Disabled it (emulate: false) on the shared xrStore.
  • Moved XR entry/exit into the View menu as Enter VR / Enter AR / Exit XR, paralleling the RayTracingSubmenu pattern. Always rendered; disabled when the browser reports the mode unsupported, so users can see the capability exists.
  • Dropped the orphaned EnterXRButton.tsx + its Viewport overlay slot.

Why

Desktop users hit XR features can only be used inside the <XR> component because the previous floating EnterXRButton called useXR() from @react-three/xr while rendered in a DOM overlay outside the <XR> provider tree. The new menu component reads from useXRSupportStore + useXRPresenting (both safe outside the tree), and lives in the same DOM hierarchy as the rest of the menubar.

Test plan

  • Desktop (no WebXR support): no floating button; View menu shows Enter VR and Enter AR grayed out.
  • Mocked support (useXRSupportStore.setState({ vr: true, ar: true, checked: true }) + skip module-load refresh()): both items render enabled and clickable in the View menu.
  • Real headset (Quest / Vision Pro): tapping the menu items should launch the corresponding session, and Exit XR should appear while presenting.

The floating Enter XR pill on desktop was actually @pmndrs/xr's bundled
iwer device emulator, which auto-injects on localhost via the default
`emulate: 'metaQuest3'`. It overlapped the toolbar and looked like ours.

- Disable the iwer emulator (`emulate: false`) on the shared xrStore so
  no DOM button is injected.
- Move XR entry/exit into the View menu as Enter VR / Enter AR / Exit XR,
  parallelling the RayTracingSubmenu pattern. Always rendered; disabled
  when the browser's `navigator.xr.isSessionSupported` says the mode is
  unavailable, so users can see the capability exists.
- Drop the now-orphan EnterXRButton.tsx + its Viewport overlay slot.

Side fix: the previous floating button used `useXR()` from
@react-three/xr, which only works inside the <XR> provider tree — that's
the "XR features can only be used inside the <XR> component" error
desktop users were hitting. The new menu component reads from the
support store + `useXRPresenting` hook, both safe outside the tree.
@vercel
Copy link
Copy Markdown

vercel Bot commented May 3, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
mecheval Ready Ready Preview, Comment May 3, 2026 1:56pm
vcad Ready Ready Preview, Comment May 3, 2026 1:56pm
vcad-docs Ready Ready Preview, Comment May 3, 2026 1:56pm
vcad-mcp Ready Ready Preview, Comment May 3, 2026 1:56pm

Request Review

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