From 182c8fc1f3555b5180bb757a566996abdf18ef35 Mon Sep 17 00:00:00 2001
From: Bela Bohlender <bela@bohlender.email>
Date: Mon, 13 Jan 2025 18:46:14 +0100
Subject: [PATCH] hide background for AR

---
 examples/editor/app.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/examples/editor/app.tsx b/examples/editor/app.tsx
index 3079e77..26134ee 100644
--- a/examples/editor/app.tsx
+++ b/examples/editor/app.tsx
@@ -1,6 +1,7 @@
 import { Canvas, Color, extend, RootState, useFrame, useThree } from '@react-three/fiber'
 import {
   createXRStore,
+  IfInSessionMode,
   isXRInputSourceState,
   noEvents,
   NotInXR,
@@ -121,10 +122,12 @@ export function App() {
         style={{ width: '100%', flexGrow: 1 }}
       >
         <XR store={store}>
-          <mesh scale={1000}>
-            <meshBasicMaterial side={BackSide} color="black" />
-            <sphereGeometry />
-          </mesh>
+          <IfInSessionMode deny="immersive-ar">
+            <mesh scale={1000}>
+              <meshBasicMaterial side={BackSide} color="black" />
+              <sphereGeometry />
+            </mesh>
+          </IfInSessionMode>
           <group pointerEventsType={{ deny: 'touch' }}>
             <AudioEffects />
             <PointerEvents />