How can i rotate my mesh with using one icon mesh?

Questions
, ,
1 
let isRotating = false;
  let lastMouseX = 0;
  const rotationAmount = THREE.MathUtils.degToRad(0.5);

  const handlePanelRotate = (event) => {
    isRotating = true;
    controlsRef.current.enabled = false;
    controlsRef.current.update();
    setDisableRotation(true)
    resetSelection();
    lastMouseX = event.clientX;
    canvasRef.current.addEventListener("mousemove", handleRotateMouseMove);
    canvasRef.current.addEventListener("mouseup", handleRotateMouseUp);
  };

  const rotatePanelGrid = (direction) => {
    if (!doc.selectedPanelGrid) return;

    const pivot = new THREE.Object3D();
    pivot.position.copy(doc.selectedPanelGrid.selectionSize).multiplyScalar(0.5);
    doc.selectedPanelGrid.add(pivot);
    pivot.updateMatrixWorld(true);

    doc.selectedPanelGrid.parent.attach(pivot);
    pivot.attach(doc.selectedPanelGrid);
    switch (direction) {
      case "left":
        pivot.rotation.z += rotationAmount; // Rotate counterclockwise
        break;
      case "right":
        pivot.rotation.z -= rotationAmount; // Rotate clockwise
        break;
    }
    pivot.updateMatrix(true);
    pivot.updateMatrixWorld(true);
    pivot.parent.attach(doc.selectedPanelGrid);
    pivot.parent.remove(pivot);

    // doc.selectedPanelGrid.position.add(center);

    doc.selectedPanelGrid.disposeOccupancy();

    doc.selectedPanelGrid.recomputeOccupancy({
      targets: terrainGroup.children,
    });
    doc.selectedPanelGrid.redrawOccupancy(scene);
  };
  const rotationThreshold = 5;
  const handleRotateMouseMove = (event) => {
    if (!isRotating || !doc.selectedPanelGrid) return;

    // Disable controls during rotation
    controlsRef.current.enabled = false;
    controlsRef.current.update();
    setDisableRotation(true)

    event.preventDefault();

    if (event.clientX > lastMouseX) {
      rotatePanelGrid("right"); // Rotate clockwise
    } else {
      rotatePanelGrid("left"); // Rotate counterclockwise
    }

    lastMouseX = event.clientX;
  };

  const handleRotateMouseUp = () => {
    updateBoxFrame(editingPanelGrid);
    setDisableRotation(false)

    isRotating = false;
    lastMouseX = 0;
    setIconPosition(null);
    canvasRef.current.removeEventListener("mousemove", handleRotateMouseMove);
    canvasRef.current.removeEventListener("mouseup", handleRotateMouseUp);

    // Call additional functions after rotation
    // solarProductionData();
    // handleRotationStop(); // Uncomment if needed
  };

https://www.awesomescreenshot.com/video/33046135?key=71eeb426a4b71153cd255c6cb1b90275

here is the video starting it’s working fine but when we change the direction then still my rotation still times works, and sometimes it does not work how can I fix it?