feat: Implement ArmReplace component with MultiGLTFInstances for dynamic arm rendering

- Added ArmReplace component to manage the rendering of arm models based on scene objects.
- Integrated MultiGLTFInstances for loading and displaying multiple GLTF models.
- Created findLinkObjects function to traverse the scene and extract positions, rotations, and visibility settings for objects named 'link_0'.
- Utilized useModuleStore to manage active module state and control visibility of arm models.

app/src/modules/simulation/ik/MultiGLTFInstances.tsx

@@ -0,0 +1,42 @@
+import { useLoader } from "@react-three/fiber";
+import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
+import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
+
+interface MultiGLTFInstancesProps {
+  index: number;
+  modelUrl: string;
+  position: [number, number, number];
+  rotation: [number, number, number];
+  visibility?: boolean;
+}
+
+export const MultiGLTFInstances: React.FC<MultiGLTFInstancesProps> = ({
+  index,
+  modelUrl,
+  position,
+  rotation,
+  visibility
+}) => {
+  const originalGltf = useLoader(GLTFLoader, modelUrl, (loader) => {
+    const draco = new DRACOLoader();
+    draco.setDecoderPath(
+      "https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/libs/draco/"
+    );
+    loader.setDRACOLoader(draco);
+  });
+  const cloned = originalGltf.scene.clone();
+  cloned.name = `rigged_arm_${index}`; // Set the name of the cloned object
+  console.log(index);
+  return (
+    <>
+      <primitive
+        key={index}
+        object={cloned}
+        position={position}
+        scale={[1, 1, 1]}
+        rotation={rotation}
+        visible={visibility}
+      />
+    </>
+  );
+};