refacto : cleaning the codebasebase again

src/hooks/debug/useCameraMode.ts

@@ -1,13 +1,6 @@
-import { useSyncExternalStore } from "react";
 import type { CameraMode } from "@/types/debug";
-import { Debug } from "@/utils/debug/Debug";
+import { useDebugStore } from "@/hooks/debug/useDebugStore";
 
 export function useCameraMode(): CameraMode {
-  const debug = Debug.getInstance();
-
-  return useSyncExternalStore(
-    (listener) => debug.subscribe(listener),
-    () => debug.getCameraMode(),
-    () => debug.getCameraMode(),
-  );
+  return useDebugStore((debug) => debug.getCameraMode());
 }

src/hooks/debug/useDebugStore.ts

@@ -0,0 +1,12 @@
+import { useSyncExternalStore } from "react";
+import { Debug } from "@/utils/debug/Debug";
+
+export function useDebugStore<T>(selector: (debug: Debug) => T): T {
+  const debug = Debug.getInstance();
+
+  return useSyncExternalStore(
+    (listener) => debug.subscribe(listener),
+    () => selector(debug),
+    () => selector(debug),
+  );
+}

src/hooks/debug/useSceneMode.ts

@@ -1,13 +1,6 @@
-import { useSyncExternalStore } from "react";
 import type { SceneMode } from "@/types/debug";
-import { Debug } from "@/utils/debug/Debug";
+import { useDebugStore } from "@/hooks/debug/useDebugStore";
 
 export function useSceneMode(): SceneMode {
-  const debug = Debug.getInstance();
-
-  return useSyncExternalStore(
-    (listener) => debug.subscribe(listener),
-    () => debug.getSceneMode(),
-    () => debug.getSceneMode(),
-  );
+  return useDebugStore((debug) => debug.getSceneMode());
 }

src/hooks/useInteraction.ts

@@ -1,8 +1,6 @@
 import { useSyncExternalStore } from "react";
-import {
-  InteractionManager,
-  type InteractionSnapshot,
-} from "@/stateManager/InteractionManager";
+import { InteractionManager } from "@/stateManager/InteractionManager";
+import type { InteractionSnapshot } from "@/types/interaction";
 
 const manager = InteractionManager.getInstance();
 
@@ -12,11 +10,3 @@ export function useInteraction(): InteractionSnapshot {
     manager.getState.bind(manager),
   );
 }
-
-export function useInteractionSelector<T>(
-  selector: (state: InteractionSnapshot) => T,
-): T {
-  return useSyncExternalStore(manager.subscribe.bind(manager), () =>
-    selector(manager.getState()),
-  );
-}

src/hooks/useOctreeGraphNode.ts

@@ -0,0 +1,24 @@
+import { useEffect, useRef } from "react";
+import type { RefObject } from "react";
+import type { Object3D } from "three";
+import { Octree } from "three/addons/math/Octree.js";
+import type { OctreeReadyHandler } from "@/types/3d";
+
+export function useOctreeGraphNode(
+  graphNodeRef: RefObject<Object3D | null>,
+  onOctreeReady: OctreeReadyHandler,
+): void {
+  const octreeBuilt = useRef(false);
+
+  useEffect(() => {
+    const graphNode = graphNodeRef.current;
+    if (octreeBuilt.current || !graphNode) return;
+    octreeBuilt.current = true;
+
+    graphNode.updateMatrixWorld(true);
+
+    const octree = new Octree();
+    octree.fromGraphNode(graphNode);
+    onOctreeReady(octree);
+  }, [graphNodeRef, onOctreeReady]);
+}