feat: Extend simulation state types to include ArmBot events and update related components

- Updated RotateControls and SelectionControls to handle ArmBot events in simulation states.
- Enhanced PathConnector to manage connections involving ArmBot and StaticMachine types.
- Added ArmBotMechanics and StaticMachineMechanics components for managing properties of ArmBot and StaticMachine.
- Modified types in worldTypes to include rotation for ArmBot and StaticMachine events.
- Updated store to accommodate new ArmBot event types in simulation states.

app/src/components/layout/sidebarRight/SideBarRight.tsx

@@ -22,6 +22,8 @@ import GlobalProperties from "./properties/GlobalProperties";
 import AsstePropertiies from "./properties/AssetProperties";
 import ZoneProperties from "./properties/ZoneProperties";
 import VehicleMechanics from "./mechanics/VehicleMechanics";
+import StaticMachineMechanics from "./mechanics/StaticMachineMechanics";
+import ArmBotMechanics from "./mechanics/ArmBotMechanics";
 
 const SideBarRight: React.FC = () => {
   const { activeModule } = useModuleStore();
@@ -42,9 +44,8 @@ const SideBarRight: React.FC = () => {
         <div className="sidebar-actions-container">
           {/* {activeModule === "builder" && ( */}
           <div
-            className={`sidebar-action-list ${
-              subModule === "properties" ? "active" : ""
-            }`}
+            className={`sidebar-action-list ${subModule === "properties" ? "active" : ""
+              }`}
             onClick={() => setSubModule("properties")}
           >
             <PropertiesIcon isActive={subModule === "properties"} />
@@ -53,25 +54,22 @@ const SideBarRight: React.FC = () => {
           {activeModule === "simulation" && (
             <>
               <div
-                className={`sidebar-action-list ${
-                  subModule === "mechanics" ? "active" : ""
-                }`}
+                className={`sidebar-action-list ${subModule === "mechanics" ? "active" : ""
+                  }`}
                 onClick={() => setSubModule("mechanics")}
               >
                 <MechanicsIcon isActive={subModule === "mechanics"} />
               </div>
               <div
-                className={`sidebar-action-list ${
-                  subModule === "simulations" ? "active" : ""
-                }`}
+                className={`sidebar-action-list ${subModule === "simulations" ? "active" : ""
+                  }`}
                 onClick={() => setSubModule("simulations")}
               >
                 <SimulationIcon isActive={subModule === "simulations"} />
               </div>
               <div
-                className={`sidebar-action-list ${
-                  subModule === "analysis" ? "active" : ""
-                }`}
+                className={`sidebar-action-list ${subModule === "analysis" ? "active" : ""
+                  }`}
                 onClick={() => setSubModule("analysis")}
               >
                 <AnalysisIcon isActive={subModule === "analysis"} />
@@ -132,10 +130,28 @@ const SideBarRight: React.FC = () => {
                 </div>
               </div>
             )}
+          {subModule === "mechanics" &&
+            selectedActionSphere &&
+            selectedActionSphere.path.type === "StaticMachine" && (
+              <div className="sidebar-right-container">
+                <div className="sidebar-right-content-container">
+                  <StaticMachineMechanics /> 
+                </div>
+              </div>
+            )}
+          {subModule === "mechanics" &&
+            selectedActionSphere &&
+            selectedActionSphere.path.type === "ArmBot" && (
+              <div className="sidebar-right-container">
+                <div className="sidebar-right-content-container">
+                  <ArmBotMechanics /> 
+                </div>
+              </div>
+            )}
           {subModule === "mechanics" && !selectedActionSphere && (
             <div className="sidebar-right-container">
               <div className="sidebar-right-content-container">
-                <ConveyorMechanics />
+                <ConveyorMechanics /> {/*  default */}
               </div>
             </div>
           )}

app/src/components/layout/sidebarRight/mechanics/ArmBotMechanics.tsx

@@ -0,0 +1,90 @@
+import React, { useRef, useMemo } from "react";
+import { InfoIcon } from "../../../icons/ExportCommonIcons";
+import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
+import { useEditingPoint, useEyeDropMode, usePreviewPosition, useSelectedActionSphere, useSimulationStates, useSocketStore } from "../../../../store/store";
+import * as Types from '../../../../types/world/worldTypes';
+import PositionInput from "../customInput/PositionInputs";
+import { setEventApi } from "../../../../services/factoryBuilder/assest/floorAsset/setEventsApt";
+
+const ArmBotMechanics: React.FC = () => {
+    const { selectedActionSphere } = useSelectedActionSphere();
+    const { simulationStates, setSimulationStates } = useSimulationStates();
+    const { socket } = useSocketStore();
+
+    const propertiesContainerRef = useRef<HTMLDivElement>(null);
+
+    const { selectedPoint, connectedPointUuids } = useMemo(() => {
+        if (!selectedActionSphere?.points?.uuid) return { selectedPoint: null, connectedPointUuids: [] };
+
+        const vehiclePaths = simulationStates.filter(
+            (path): path is Types.ArmBotEventsSchema => path.type === "ArmBot"
+        );
+
+        const points = vehiclePaths.find(
+            (path) => path.points.uuid === selectedActionSphere.points.uuid
+        )?.points;
+
+        if (!points) return { selectedPoint: null, connectedPointUuids: [] };
+
+        const connectedUuids: string[] = [];
+        if (points.connections?.targets) {
+            points.connections.targets.forEach(target => {
+                connectedUuids.push(target.pointUUID);
+            });
+        }
+
+        return {
+            selectedPoint: points,
+            connectedPointUuids: connectedUuids
+        };
+    }, [selectedActionSphere, simulationStates]);
+
+    const updateBackend = async (updatedPath: Types.ArmBotEventsSchema | undefined) => {
+        if (!updatedPath) return;
+        const email = localStorage.getItem("email");
+        const organization = email ? email.split("@")[1].split(".")[0] : "";
+
+        // await setEventApi(
+        //     organization,
+        //     updatedPath.modeluuid,
+        //     { type: "ArmBot", points: updatedPath.points }
+        // );
+
+        const data = {
+            organization: organization,
+            modeluuid: updatedPath.modeluuid,
+            eventData: { type: "ArmBot", points: updatedPath.points }
+        }
+
+        socket.emit('v2:model-asset:updateEventData', data);
+
+    }
+
+
+    return (
+        <div className="machine-mechanics-container" key={selectedPoint?.uuid}>
+            <div className="machine-mechanics-header">
+                {selectedActionSphere?.path?.modelName || "ArmBot point not found"}
+            </div>
+
+            <div className="machine-mechanics-content-container">
+                <div className="selected-properties-container" ref={propertiesContainerRef}>
+                    <div className="properties-header">ArmBot Properties</div>
+
+                    {selectedPoint && (
+                        <>
+
+                        </>
+                    )}
+                </div>
+
+                <div className="footer">
+                    <InfoIcon />
+                    Configure armbot properties.
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default React.memo(ArmBotMechanics);

app/src/components/layout/sidebarRight/mechanics/StaticMachineMechanics.tsx

@@ -0,0 +1,90 @@
+import React, { useRef, useMemo } from "react";
+import { InfoIcon } from "../../../icons/ExportCommonIcons";
+import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
+import { useEditingPoint, useEyeDropMode, usePreviewPosition, useSelectedActionSphere, useSimulationStates, useSocketStore } from "../../../../store/store";
+import * as Types from '../../../../types/world/worldTypes';
+import PositionInput from "../customInput/PositionInputs";
+import { setEventApi } from "../../../../services/factoryBuilder/assest/floorAsset/setEventsApt";
+
+const StaticMachineMechanics: React.FC = () => {
+    const { selectedActionSphere } = useSelectedActionSphere();
+    const { simulationStates, setSimulationStates } = useSimulationStates();
+    const { socket } = useSocketStore();
+
+    const propertiesContainerRef = useRef<HTMLDivElement>(null);
+
+    const { selectedPoint, connectedPointUuids } = useMemo(() => {
+        if (!selectedActionSphere?.points?.uuid) return { selectedPoint: null, connectedPointUuids: [] };
+
+        const vehiclePaths = simulationStates.filter(
+            (path): path is Types.StaticMachineEventsSchema => path.type === "StaticMachine"
+        );
+
+        const points = vehiclePaths.find(
+            (path) => path.points.uuid === selectedActionSphere.points.uuid
+        )?.points;
+
+        if (!points) return { selectedPoint: null, connectedPointUuids: [] };
+
+        const connectedUuids: string[] = [];
+        if (points.connections?.targets) {
+            points.connections.targets.forEach(target => {
+                connectedUuids.push(target.pointUUID);
+            });
+        }
+
+        return {
+            selectedPoint: points,
+            connectedPointUuids: connectedUuids
+        };
+    }, [selectedActionSphere, simulationStates]);
+
+    const updateBackend = async (updatedPath: Types.StaticMachineEventsSchema | undefined) => {
+        if (!updatedPath) return;
+        const email = localStorage.getItem("email");
+        const organization = email ? email.split("@")[1].split(".")[0] : "";
+
+        // await setEventApi(
+        //     organization,
+        //     updatedPath.modeluuid,
+        //     { type: "StaticMachine", points: updatedPath.points }
+        // );
+
+        const data = {
+            organization: organization,
+            modeluuid: updatedPath.modeluuid,
+            eventData: { type: "StaticMachine", points: updatedPath.points }
+        }
+
+        socket.emit('v2:model-asset:updateEventData', data);
+
+    }
+
+
+    return (
+        <div className="machine-mechanics-container" key={selectedPoint?.uuid}>
+            <div className="machine-mechanics-header">
+                {selectedActionSphere?.path?.modelName || "Machine point not found"}
+            </div>
+
+            <div className="machine-mechanics-content-container">
+                <div className="selected-properties-container" ref={propertiesContainerRef}>
+                    <div className="properties-header">Machine Properties</div>
+
+                    {selectedPoint && (
+                        <>
+
+                        </>
+                    )}
+                </div>
+
+                <div className="footer">
+                    <InfoIcon />
+                    Configure machine properties.
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default React.memo(StaticMachineMechanics);