zone camera and target updation added

app/src/components/ui/componets/zoneCameraTarget.tsx

@@ -1,13 +1,17 @@
 import { useEffect, useMemo, useRef, useState } from "react";
-import { useThree } from "@react-three/fiber";
+import { useFrame, useThree } from "@react-three/fiber";
 import * as THREE from "three";
 import { useSelectedZoneStore } from "../../../store/useZoneStore";
+import { useEditPosition, usezonePosition, usezoneTarget } from "../../../store/store";
 
 export default function ZoneCentreTarget() {
     const { selectedZone, setSelectedZone } = useSelectedZoneStore();
     const [previousZoneCentre, setPreviousZoneCentre] = useState<number[] | null>(null);
     const sphereRef = useRef<THREE.Mesh>(null);
     const { camera, controls }: any = useThree();
+    const { zonePosition, setZonePosition } = usezonePosition();
+    const { zoneTarget, setZoneTarget } = usezoneTarget();
+    const { Edit, setEdit } = useEditPosition();
 
 
     useEffect(() => {
@@ -32,9 +36,9 @@ export default function ZoneCentreTarget() {
                 sphereRef.current.position.set(selectedZone.zoneViewPortTarget[0], selectedZone.zoneViewPortTarget[1], selectedZone.zoneViewPortTarget[2]);
             }
             if (centrePoint) {
-                
+
                 if (centrePoint.length > 0) {
-                    
+
                     let camPosition = new THREE.Vector3(...selectedZone.zoneViewPortPosition);
                     let CamTarget = new THREE.Vector3(...selectedZone.zoneViewPortTarget);
 
@@ -63,7 +67,7 @@ export default function ZoneCentreTarget() {
                     };
                     setCam();
                 } else {
-                    
+
                     let camPosition = new THREE.Vector3(...selectedZone.zoneViewPortPosition);
                     let CamTarget = new THREE.Vector3(...selectedZone.zoneViewPortTarget);
 
@@ -89,7 +93,14 @@ export default function ZoneCentreTarget() {
                 }
             }
         }
-    }, [selectedZone.zoneViewPortTarget, camera, controls]);
+    }, [selectedZone.zoneViewPortTarget]);
+
+    useFrame(() => {
+        if (Edit) {
+            setZonePosition([controls.getPosition().x, controls.getPosition().y, controls.getPosition().z])
+            setZoneTarget([controls.getTarget().x, controls.getTarget().y, controls.getTarget().z])
+        }
+    })
     return (
         <> </>
     );