app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx

@@ -1,5 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react'
 import * as THREE from "three";
+import { useThree } from "@react-three/fiber";
 import IKInstance from '../ikInstance/ikInstance';
 import RoboticArmAnimator from '../animator/roboticArmAnimator';
 import MaterialAnimator from '../animator/materialAnimator';
@@ -18,6 +19,7 @@ function RoboticArmInstance({ armBot }: { armBot: ArmBotStatus }) {
     const [currentPhase, setCurrentPhase] = useState<(string)>("init");
     const [path, setPath] = useState<[number, number, number][]>([]);
     const [ikSolver, setIkSolver] = useState<any>(null);
+    const { scene } = useThree();
     const restPosition = new THREE.Vector3(0, 1.75, -1.6);
     const targetBone = "Target";
     const groupRef = useRef<any>(null);
@@ -271,6 +273,10 @@ function RoboticArmInstance({ armBot }: { armBot: ArmBotStatus }) {
 
 
     useEffect(() => {
+        const targetMesh = scene?.getObjectByProperty("uuid", armBot.modelUuid);
+        if (targetMesh) {
+            targetMesh.visible = (!isPlaying)
+        }
         const targetBones = ikSolver?.mesh.skeleton.bones.find((b: any) => b.name === targetBone);
         if (!isReset && isPlaying) {
             //Moving armBot from initial point to rest position.