fix: a pb with octree

src/components/three/interaction/InteractableObject.tsx

@@ -19,6 +19,7 @@ import type { Vector3Tuple } from "@/types/three/three";
 interface InteractableObjectBaseProps {
   label: string;
   position: Vector3Tuple;
+  radius?: number;
   bodyRef?: RefObject<RapierRigidBody | null>;
   onPress: () => void;
   children: React.ReactNode;
@@ -64,7 +65,15 @@ function createInteractableHandle(
 export function InteractableObject(
   props: InteractableObjectProps,
 ): React.JSX.Element {
-  const { kind, label, position, bodyRef, onPress, children } = props;
+  const {
+    kind,
+    label,
+    position,
+    radius = INTERACTION_RADIUS,
+    bodyRef,
+    onPress,
+    children,
+  } = props;
   const onRelease = props.kind === "grab" ? props.onRelease : null;
   const camera = useThree((state) => state.camera);
   const groupRef = useRef<THREE.Group>(null);
@@ -156,7 +165,7 @@ export function InteractableObject(
 
     camera.getWorldPosition(_cameraPos);
     const dist = _cameraPos.distanceTo(_objectPos);
-    const isNearby = dist <= INTERACTION_RADIUS;
+    const isNearby = dist <= radius;
 
     manager.setNearby(handle.current, isNearby);
 
@@ -169,7 +178,7 @@ export function InteractableObject(
 
     camera.getWorldDirection(_cameraDir);
     _raycaster.set(_cameraPos, _cameraDir);
-    _raycaster.far = INTERACTION_RADIUS;
+    _raycaster.far = radius;
 
     const hits = group ? _raycaster.intersectObject(group, true) : [];
     const validHit = hits.find((h) => h.object !== debugSphereRef.current);
@@ -187,7 +196,7 @@ export function InteractableObject(
       <mesh ref={debugSphereRef} visible={false}>
         <sphereGeometry
           args={[
-            INTERACTION_RADIUS,
+            radius,
             INTERACTION_DEBUG_SPHERE_SEGMENTS,
             INTERACTION_DEBUG_SPHERE_SEGMENTS,
           ]}

src/components/three/interaction/TriggerObject.tsx

@@ -4,6 +4,7 @@ import type { RapierRigidBody } from "@react-three/rapier";
 import { InteractableObject } from "@/components/three/interaction/InteractableObject";
 import { useClonedObject } from "@/hooks/three/useClonedObject";
 import { useLoggedGLTF } from "@/hooks/three/useLoggedGLTF";
+import { INTERACTION_RADIUS } from "@/data/interaction/interactionConfig";
 import {
   TRIGGER_DEFAULT_COLLIDERS,
   TRIGGER_DEFAULT_LABEL,
@@ -23,6 +24,7 @@ interface TriggerObjectProps {
   children: React.ReactNode;
   colliders?: ColliderShape;
   label?: string;
+  radius?: number;
   soundPath?: string;
   soundVolume?: number;
   spawnModel?: string;
@@ -53,6 +55,7 @@ export function TriggerObject({
   children,
   colliders = TRIGGER_DEFAULT_COLLIDERS,
   label = TRIGGER_DEFAULT_LABEL,
+  radius = INTERACTION_RADIUS,
   soundPath,
   soundVolume = TRIGGER_DEFAULT_SOUND_VOLUME,
   spawnModel,
@@ -74,6 +77,7 @@ export function TriggerObject({
           kind="trigger"
           label={label}
           position={position}
+          radius={radius}
           bodyRef={rbRef}
           onPress={() => {
             if (soundPath) {