From 70136fd7d39e98a38e2d5f20b08670efdc8c8d82 Mon Sep 17 00:00:00 2001
From: Jerald-Golden-B <jerald@hexrfactory.com>
Date: Wed, 21 May 2025 17:38:42 +0530
Subject: [PATCH] Add useThree hook and update visibility logic for target mesh
 in RoboticArmInstance

---
 .../roboticArm/instances/armInstance/roboticArmInstance.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx b/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx
index 6568e1f..ce5a280 100644
--- a/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx
+++ b/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.