Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

folder structure change

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-04-21 11:53:42 +05:30
parent 31561428ef
commit 54cc3deb98
118 changed files with 3014 additions and 13419 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/src/components/layout/sidebarLeft/SideBarLeft.tsx
View File

@@ -5,8 +5,8 @@ import Header from "./Header";
import useToggleStore from "../../../store/useUIToggleStore";
import Assets from "./Assets";
import useModuleStore from "../../../store/useModuleStore";
import Widgets from "./visualization/widgets/Widgets";
import Templates from "../../../modules/visualization/template/Templates";
import Widgets from ".//visualization/widgets/Widgets";
import Templates from "../../../modules//visualization/template/Templates";
import Search from "../../ui/inputs/Search";
const SideBarLeft: React.FC = () => {

8
app/src/components/layout/sidebarLeft/visualization/widgets/WidgetsFloating.tsx
View File

@@ -5,11 +5,11 @@ import {
GlobeIcon,
WalletIcon,
} from "../../../../icons/3dChartIcons";
import SimpleCard from "../../../../../modules/visualization/widgets/floating/cards/SimpleCard";
import SimpleCard from "../../../../../modules//visualization/widgets/floating/cards/SimpleCard";
import WarehouseThroughput from "../../../../../modules/visualization/widgets/floating/cards/WarehouseThroughput";
import ProductivityDashboard from "../../../../../modules/visualization/widgets/floating/cards/ProductivityDashboard";
import FleetEfficiency from "../../../../../modules/visualization/widgets/floating/cards/FleetEfficiency";
import WarehouseThroughput from "../../../../../modules//visualization/widgets/floating/cards/WarehouseThroughput";
import ProductivityDashboard from "../../../../../modules//visualization/widgets/floating/cards/ProductivityDashboard";
import FleetEfficiency from "../../../../../modules//visualization/widgets/floating/cards/FleetEfficiency";
interface Widget {
id: string;

2
app/src/components/layout/sidebarRight/Header.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
import { AppDockIcon } from "../../icons/HeaderIcons";
import orgImg from "../../../assets/orgTemp.png";
import { useActiveUsers } from "../../../store/store";
import { getAvatarColor } from "../../../modules/collaboration/users/functions/getAvatarColor";
import { getAvatarColor } from "../../../functions/users/functions/getAvatarColor";
import { ActiveUser } from "../../../types/users";
import CollaborationPopup from "../../templates/CollaborationPopup";

45
app/src/components/layout/sidebarRight/SideBarRight.tsx
View File

@@ -10,25 +10,19 @@ import {
SimulationIcon,
} from "../../icons/SimulationIcons";
import useToggleStore from "../../../store/useUIToggleStore";
import ConveyorMechanics from "./mechanics/ConveyorMechanics";
import Visualization from "./visualization/Visualization";
import Analysis from "./analysis/Analysis";
import Simulations from "./simulation/Simulations";
import {
useSelectedActionSphere,
useSelectedFloorItem,
} from "../../../store/store";
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();
const { toggleUI } = useToggleStore();
const { selectedActionSphere } = useSelectedActionSphere();
const { subModule, setSubModule } = useSubModuleStore();
const { selectedFloorItem } = useSelectedFloorItem();
// Reset activeList whenever activeModule changes
@@ -112,46 +106,9 @@ const SideBarRight: React.FC = () => {
{toggleUI && activeModule === "simulation" && (
<>
{subModule === "mechanics" &&
selectedActionSphere &&
selectedActionSphere.path.type === "Conveyor" && (
<div className="sidebar-right-container">
<div className="sidebar-right-content-container">
<ConveyorMechanics />
</div>
</div>
)}
{subModule === "mechanics" &&
selectedActionSphere &&
selectedActionSphere.path.type === "Vehicle" && (
<div className="sidebar-right-container">
<div className="sidebar-right-content-container">
<VehicleMechanics />
</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 && (
{subModule === "mechanics" && (
<div className="sidebar-right-container">
<div className="sidebar-right-content-container">
<ConveyorMechanics /> {/* default */}
</div>
</div>
)}

411
app/src/components/layout/sidebarRight/mechanics/ArmBotMechanics.tsx
View File

@@ -1,411 +0,0 @@
import React, { useRef, useMemo, useCallback, useState } from "react";
import { InfoIcon, AddIcon, RemoveIcon, ResizeHeightIcon } from "../../../icons/ExportCommonIcons";
import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
import { useSelectedActionSphere, useSimulationStates, useSocketStore } from "../../../../store/store";
import * as SimulationTypes from '../../../../types/simulationTypes';
import LabledDropdown from "../../../ui/inputs/LabledDropdown";
import { handleResize } from "../../../../functions/handleResizePannel";
interface ConnectedModel {
modelUUID: string;
modelName: string;
points: {
uuid: string;
position: [number, number, number];
index?: number;
}[];
triggers?: {
uuid: string;
name: string;
type: string;
isUsed: boolean;
}[];
}
const ArmBotMechanics: React.FC = () => {
const { selectedActionSphere } = useSelectedActionSphere();
const { simulationStates, setSimulationStates } = useSimulationStates();
const { socket } = useSocketStore();
const [selectedProcessIndex, setSelectedProcessIndex] = useState<number | null>(null);
const actionsContainerRef = useRef<HTMLDivElement>(null);
// Get connected models and their triggers
const connectedModels = useMemo<ConnectedModel[]>(() => {
if (!selectedActionSphere?.points?.uuid) return [];
const armBotPaths = simulationStates.filter(
(path): path is SimulationTypes.ArmBotEventsSchema => path.type === "ArmBot"
);
const currentPoint = armBotPaths.find(
(path) => path.points.uuid === selectedActionSphere.points.uuid
)?.points;
if (!currentPoint?.connections?.targets) return [];
return currentPoint.connections.targets.reduce<ConnectedModel[]>((acc, target) => {
const connectedModel = simulationStates.find(
(model) => model.modeluuid === target.modelUUID
);
if (!connectedModel) return acc;
let triggers: { uuid: string; name: string; type: string; isUsed: boolean }[] = [];
let points: { uuid: string; position: [number, number, number] }[] = [];
if (connectedModel.type === "Conveyor") {
const conveyor = connectedModel as SimulationTypes.ConveyorEventsSchema;
const connectedPointUUIDs = currentPoint?.connections?.targets
.filter(t => t.modelUUID === connectedModel.modeluuid)
.map(t => t.pointUUID) || [];
points = conveyor.points
.map((point, idx) => ({
uuid: point.uuid,
position: point.position,
index: idx
}))
.filter(point => connectedPointUUIDs.includes(point.uuid));
triggers = conveyor.points.flatMap(p => p.triggers?.filter(t => t.isUsed) || []);
}
else if (connectedModel.type === "StaticMachine") {
const staticMachine = connectedModel as SimulationTypes.StaticMachineEventsSchema;
points = [{
uuid: staticMachine.points.uuid,
position: staticMachine.points.position
}];
triggers = staticMachine.points.triggers ?
[{
uuid: staticMachine.points.triggers.uuid,
name: staticMachine.points.triggers.name,
type: staticMachine.points.triggers.type,
isUsed: true // StaticMachine triggers are always considered used
}] : [];
}
if (!acc.some(m => m.modelUUID === connectedModel.modeluuid)) {
acc.push({
modelUUID: connectedModel.modeluuid,
modelName: connectedModel.modelName,
points,
triggers
});
}
return acc;
}, []);
}, [selectedActionSphere, simulationStates]);
// Get triggers from connected models
const connectedTriggers = useMemo(() => {
return connectedModels.flatMap(model =>
(model.triggers || []).map(trigger => ({
...trigger,
displayName: `${model.modelName} - ${trigger.name}`,
modelUUID: model.modelUUID
}))
);
}, [connectedModels]);
// Get all points from connected models
const connectedPoints = useMemo(() => {
return connectedModels.flatMap(model =>
model.points.map(point => ({
...point,
displayName: `${model.modelName} - Point${typeof point.index === 'number' ? ` ${point.index}` : ''}`,
modelUUID: model.modelUUID
}))
);
}, [connectedModels]);
const { selectedPoint } = useMemo(() => {
if (!selectedActionSphere?.points?.uuid) return { selectedPoint: null };
const armBotPaths = simulationStates.filter(
(path): path is SimulationTypes.ArmBotEventsSchema => path.type === "ArmBot"
);
const points = armBotPaths.find(
(path) => path.points.uuid === selectedActionSphere.points.uuid
)?.points;
return {
selectedPoint: points || null
};
}, [selectedActionSphere, simulationStates]);
const updateBackend = async (updatedPath: SimulationTypes.ArmBotEventsSchema | undefined) => {
if (!updatedPath) return;
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "";
const data = {
organization: organization,
modeluuid: updatedPath.modeluuid,
eventData: { type: "ArmBot", points: updatedPath.points }
}
socket.emit('v2:model-asset:updateEventData', data);
}
const handleActionUpdate = useCallback((updatedAction: Partial<SimulationTypes.ArmBotEventsSchema['points']['actions']>) => {
if (!selectedActionSphere?.points?.uuid || !selectedPoint) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "ArmBot" && path.points.uuid === selectedActionSphere.points.uuid) {
return {
...path,
points: {
...path.points,
actions: {
...path.points.actions,
...updatedAction
}
}
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ArmBotEventsSchema =>
path.type === "ArmBot" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, selectedPoint, simulationStates, setSimulationStates]);
const handleSpeedChange = useCallback((speed: number) => {
handleActionUpdate({ speed });
}, [handleActionUpdate]);
const handleProcessChange = useCallback((processes: SimulationTypes.ArmBotEventsSchema['points']['actions']['processes']) => {
handleActionUpdate({ processes });
}, [handleActionUpdate]);
const handleAddProcess = useCallback(() => {
if (!selectedPoint) return;
const newProcess: any = {
triggerId: "",
startPoint: "",
endPoint: ""
};
const updatedProcesses = selectedPoint.actions.processes ? [...selectedPoint.actions.processes, newProcess] : [newProcess];
handleProcessChange(updatedProcesses);
setSelectedProcessIndex(updatedProcesses.length - 1);
}, [selectedPoint, handleProcessChange]);
const handleDeleteProcess = useCallback((index: number) => {
if (!selectedPoint?.actions.processes) return;
const updatedProcesses = [...selectedPoint.actions.processes];
updatedProcesses.splice(index, 1);
handleProcessChange(updatedProcesses);
// Reset selection if deleting the currently selected process
if (selectedProcessIndex === index) {
setSelectedProcessIndex(null);
} else if (selectedProcessIndex !== null && selectedProcessIndex > index) {
// Adjust selection index if needed
setSelectedProcessIndex(selectedProcessIndex - 1);
}
}, [selectedPoint, selectedProcessIndex, handleProcessChange]);
const handleTriggerSelect = useCallback((displayName: string, index: number) => {
const availableOptions = getFilteredTriggerOptions(index);
const selectedDisplayIndex = availableOptions.indexOf(displayName);
const filteredTriggers = connectedTriggers.filter(trigger =>
!selectedPoint?.actions.processes
?.filter((_, i) => i !== index)
.map(p => p.triggerId)
.includes(trigger.uuid)
);
const selected = filteredTriggers[selectedDisplayIndex];
if (!selected || !selectedPoint?.actions.processes) return;
const oldProcess = selectedPoint.actions.processes[index];
const updatedProcesses = [...selectedPoint.actions.processes];
updatedProcesses[index] = {
...oldProcess,
triggerId: selected.uuid,
startPoint: oldProcess.startPoint || "",
endPoint: oldProcess.endPoint || ""
};
handleProcessChange(updatedProcesses);
}, [connectedTriggers, selectedPoint, handleProcessChange]);
const handleStartPointSelect = useCallback((displayName: string, index: number) => {
if (!selectedPoint?.actions.processes) return;
const point = connectedPoints.find(p => p.displayName === displayName);
if (!point) return;
const updatedProcesses = [...selectedPoint.actions.processes];
updatedProcesses[index] = {
...updatedProcesses[index],
startPoint: point.uuid
};
handleProcessChange(updatedProcesses);
}, [selectedPoint, connectedPoints, handleProcessChange]);
const handleEndPointSelect = useCallback((displayName: string, index: number) => {
if (!selectedPoint?.actions.processes) return;
const point = connectedPoints.find(p => p.displayName === displayName);
if (!point) return;
const updatedProcesses = [...selectedPoint.actions.processes];
updatedProcesses[index] = {
...updatedProcesses[index],
endPoint: point.uuid
};
handleProcessChange(updatedProcesses);
}, [selectedPoint, connectedPoints, handleProcessChange]);
const getProcessByIndex = useCallback((index: number) => {
if (!selectedPoint?.actions.processes || index >= selectedPoint.actions.processes.length) return null;
return selectedPoint.actions.processes[index];
}, [selectedPoint]);
const getFilteredTriggerOptions = (currentIndex: number) => {
const usedTriggerUUIDs = selectedPoint?.actions.processes?.filter((_, i) => i !== currentIndex).map(p => p.triggerId).filter(Boolean) ?? [];
return connectedTriggers.filter(trigger => !usedTriggerUUIDs.includes(trigger.uuid)).map(trigger => trigger.displayName);
};
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">
<div className="properties-header">ArmBot Properties</div>
{selectedPoint && (
<>
<InputWithDropDown
key={`speed-${selectedPoint.uuid}`}
label="ArmBot Speed"
min={0.1}
step={0.1}
value={selectedPoint.actions.speed.toString()}
onChange={(value) => handleSpeedChange(parseFloat(value))}
/>
<div className="actions">
<div className="header">
<div className="header-value">Processes</div>
<div className="add-button" onClick={handleAddProcess}>
<AddIcon /> Add
</div>
</div>
<div
className="lists-main-container"
ref={actionsContainerRef}
style={{ height: "120px" }}
>
<div className="list-container">
{selectedPoint.actions.processes?.map((process, index) => (
<div
key={`process-${index}`}
className={`list-item ${selectedProcessIndex === index ? "active" : ""}`}
>
<div
className="value"
onClick={() => setSelectedProcessIndex(index)}
>
Process {index + 1}
</div>
<div
className="remove-button"
onClick={() => handleDeleteProcess(index)}
>
<RemoveIcon />
</div>
</div>
))}
</div>
<div
className="resize-icon"
id="action-resize"
onMouseDown={(e) => handleResize(e, actionsContainerRef)}
>
<ResizeHeightIcon />
</div>
</div>
</div>
{selectedProcessIndex !== null && (
<div className="process-configuration">
<LabledDropdown
key={`trigger-select-${selectedProcessIndex}`}
label="Select Trigger"
defaultOption={
connectedTriggers.find(t =>
t.uuid === getProcessByIndex(selectedProcessIndex)?.triggerId
)?.displayName || 'Select a trigger'
}
onSelect={(value) => handleTriggerSelect(value, selectedProcessIndex)}
options={getFilteredTriggerOptions(selectedProcessIndex)}
/>
<LabledDropdown
key={`start-point-${selectedProcessIndex}`}
label="Start Point"
defaultOption={
connectedPoints.find(p =>
p.uuid === getProcessByIndex(selectedProcessIndex)?.startPoint
)?.displayName || 'Select start point'
}
onSelect={(value) => handleStartPointSelect(value, selectedProcessIndex)}
options={connectedPoints.map(point => point.displayName)}
/>
<LabledDropdown
key={`end-point-${selectedProcessIndex}`}
label="End Point"
defaultOption={
connectedPoints.find(p =>
p.uuid === getProcessByIndex(selectedProcessIndex)?.endPoint
)?.displayName || 'Select end point'
}
onSelect={(value) => handleEndPointSelect(value, selectedProcessIndex)}
options={connectedPoints.map(point => point.displayName)}
/>
</div>
)}
</>
)}
</div>
<div className="footer">
<InfoIcon />
Configure ArmBot properties and trigger-based processes.
</div>
</div>
</div>
);
};
export default React.memo(ArmBotMechanics);

879
app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx
View File

@@ -1,879 +0,0 @@
import React, { useRef, useState, useMemo, useEffect } from "react";
import {
AddIcon,
InfoIcon,
RemoveIcon,
ResizeHeightIcon,
} from "../../../icons/ExportCommonIcons";
import RenameInput from "../../../ui/inputs/RenameInput";
import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
import LabledDropdown from "../../../ui/inputs/LabledDropdown";
import { handleResize } from "../../../../functions/handleResizePannel";
import {
useFloorItems,
useSelectedActionSphere,
useSelectedPath,
useSimulationStates,
useSocketStore,
} from "../../../../store/store";
import * as THREE from "three";
import * as SimulationTypes from "../../../../types/simulationTypes";
import InputToggle from "../../../ui/inputs/InputToggle";
import { setFloorItemApi } from "../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
import { setEventApi } from "../../../../services/factoryBuilder/assest/floorAsset/setEventsApt";
const ConveyorMechanics: React.FC = () => {
const { selectedActionSphere } = useSelectedActionSphere();
const { selectedPath, setSelectedPath } = useSelectedPath();
const { simulationStates, setSimulationStates } = useSimulationStates();
const { floorItems, setFloorItems } = useFloorItems();
const { socket } = useSocketStore();
const actionsContainerRef = useRef<HTMLDivElement>(null);
const triggersContainerRef = useRef<HTMLDivElement>(null);
const selectedPoint = useMemo(() => {
if (!selectedActionSphere) return null;
return simulationStates
.filter(
(path): path is SimulationTypes.ConveyorEventsSchema => path.type === "Conveyor"
)
.flatMap((path) => path.points)
.find((point) => point.uuid === selectedActionSphere.points.uuid);
}, [selectedActionSphere, simulationStates]);
const updateBackend = async (updatedPath: SimulationTypes.ConveyorEventsSchema | undefined) => {
if (!updatedPath) return;
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "";
// await setEventApi(
// organization,
// updatedPath.modeluuid,
// { type: "Conveyor", points: updatedPath.points, speed: updatedPath.speed }
// );
const data = {
organization: organization,
modeluuid: updatedPath.modeluuid,
eventData: { type: "Conveyor", points: updatedPath.points, speed: updatedPath.speed }
}
socket.emit('v2:model-asset:updateEventData', data);
}
const handleAddAction = () => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "Conveyor") {
return {
...path,
points: path.points.map((point) => {
if (point.uuid === selectedActionSphere.points.uuid) {
const actionIndex = point.actions.length;
const newAction = {
uuid: THREE.MathUtils.generateUUID(),
name: `Action ${actionIndex + 1}`,
type: "Inherit",
material: "Inherit",
delay: "Inherit",
spawnInterval: "Inherit",
isUsed: false,
};
return { ...point, actions: [...point.actions, newAction] };
}
return point;
}),
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleDeleteAction = (uuid: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.filter(
(action) => action.uuid !== uuid
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleActionSelect = (uuid: string, actionType: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.map((action) =>
action.uuid === uuid
? {
...action,
type: actionType,
material:
actionType === "Spawn" || actionType === "Swap"
? "Inherit"
: action.material,
delay:
actionType === "Delay" ? "Inherit" : action.delay,
spawnInterval:
actionType === "Spawn"
? "Inherit"
: action.spawnInterval,
}
: action
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Update the selected item to reflect changes
if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) {
const updatedAction = updatedPaths
.filter(
(path): path is SimulationTypes.ConveyorEventsSchema => path.type === "Conveyor"
)
.flatMap((path) => path.points)
.find((p) => p.uuid === selectedActionSphere.points.uuid)
?.actions.find((a) => a.uuid === uuid);
if (updatedAction) {
setSelectedItem({
type: "action",
item: updatedAction,
});
}
}
};
// Modified handleMaterialSelect to ensure it only applies to relevant action types
const handleMaterialSelect = (uuid: string, material: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.map((action) =>
action.uuid === uuid &&
(action.type === "Spawn" || action.type === "Swap")
? { ...action, material }
: action
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Update selected item if it's the current action
if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) {
setSelectedItem({
...selectedItem,
item: {
...selectedItem.item,
material,
},
});
}
};
const handleDelayChange = (uuid: string, delay: number | string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.map((action) =>
action.uuid === uuid ? { ...action, delay } : action
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleSpawnIntervalChange = (
uuid: string,
spawnInterval: number | string
) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.map((action) =>
action.uuid === uuid
? { ...action, spawnInterval }
: action
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleSpeedChange = (speed: number | string) => {
if (!selectedPath) return;
const updatedPaths = simulationStates.map((path) =>
path.modeluuid === selectedPath.path.modeluuid ? { ...path, speed } : path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.modeluuid === selectedPath.path.modeluuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
setSelectedPath({ ...selectedPath, path: { ...selectedPath.path, speed } });
};
const handleAddTrigger = () => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) => {
if (point.uuid === selectedActionSphere.points.uuid) {
const triggerIndex = point.triggers.length;
const newTrigger = {
uuid: THREE.MathUtils.generateUUID(),
name: `Trigger ${triggerIndex + 1}`,
type: "",
bufferTime: 0,
isUsed: false,
};
return { ...point, triggers: [...point.triggers, newTrigger] };
}
return point;
}),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleDeleteTrigger = (uuid: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
triggers: point.triggers.filter(
(trigger) => trigger.uuid !== uuid
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
};
const handleTriggerSelect = (uuid: string, triggerType: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
triggers: point.triggers.map((trigger) =>
trigger.uuid === uuid
? { ...trigger, type: triggerType }
: trigger
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Ensure the selectedItem is updated immediately
const updatedTrigger = updatedPaths
.flatMap((path) => (path.type === "Conveyor" ? path.points : []))
.flatMap((point) => point.triggers)
.find((trigger) => trigger.uuid === uuid);
if (updatedTrigger) {
setSelectedItem({ type: "trigger", item: updatedTrigger });
}
};
// Update the toggle handlers to immediately update the selected item
const handleActionToggle = (uuid: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
actions: point.actions.map((action) => ({
...action,
isUsed: action.uuid === uuid ? !action.isUsed : false,
})),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Immediately update the selected item if it's the one being toggled
if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) {
setSelectedItem({
...selectedItem,
item: {
...selectedItem.item,
isUsed: !selectedItem.item.isUsed,
},
});
}
};
// Do the same for trigger toggle
const handleTriggerToggle = (uuid: string) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
triggers: point.triggers.map((trigger) => ({
...trigger,
isUsed: trigger.uuid === uuid ? !trigger.isUsed : false,
})),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Immediately update the selected item if it's the one being toggled
if (selectedItem?.type === "trigger" && selectedItem.item.uuid === uuid) {
setSelectedItem({
...selectedItem,
item: {
...selectedItem.item,
isUsed: !selectedItem.item.isUsed,
},
});
}
};
const handleTriggerBufferTimeChange = (uuid: string, bufferTime: number) => {
if (!selectedActionSphere) return;
const updatedPaths = simulationStates.map((path) =>
path.type === "Conveyor"
? {
...path,
points: path.points.map((point) =>
point.uuid === selectedActionSphere.points.uuid
? {
...point,
triggers: point.triggers.map((trigger) =>
trigger.uuid === uuid
? { ...trigger, bufferTime }
: trigger
),
}
: point
),
}
: path
);
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.ConveyorEventsSchema =>
path.type === "Conveyor" &&
path.points.some(
(point) => point.uuid === selectedActionSphere.points.uuid
)
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
// Immediately update selectedItem if it's the currently selected trigger
if (selectedItem?.type === "trigger" && selectedItem.item.uuid === uuid) {
setSelectedItem({
...selectedItem,
item: {
...selectedItem.item,
bufferTime,
},
});
}
};
const [selectedItem, setSelectedItem] = useState<{
type: "action" | "trigger";
item: any;
} | null>(null);
useEffect(() => {
setSelectedItem(null);
}, [selectedActionSphere]);
return (
<div className="machine-mechanics-container">
{!selectedPath && (
<div className="machine-mechanics-header">
{selectedActionSphere?.path?.modelName || "point name not found"}
</div>
)}
{selectedPath && (
<div className="machine-mechanics-header">
{selectedPath.path.modelName || "path name not found"}
</div>
)}
<div className="machine-mechanics-content-container">
{!selectedPath && (
<>
<div className="actions">
<div className="header">
<div className="header-value">Actions</div>
<div className="add-button" onClick={handleAddAction}>
<AddIcon /> Add
</div>
</div>
<div
className="lists-main-container"
ref={actionsContainerRef}
style={{ height: "120px" }}
>
<div className="list-container">
{selectedPoint?.actions.map((action) => (
<div
key={action.uuid}
className={`list-item ${selectedItem?.type === "action" &&
selectedItem.item?.uuid === action.uuid
? "active"
: ""
}`}
>
<div
className="value"
onClick={() =>
setSelectedItem({ type: "action", item: action })
}
>
<input type="radio" name="action" id="action" checked={action.isUsed} readOnly />
<RenameInput value={action.name} />
</div>
<div
className="remove-button"
onClick={() => handleDeleteAction(action.uuid)}
>
<RemoveIcon />
</div>
</div>
))}
</div>
<div
className="resize-icon"
id="action-resize"
onMouseDown={(e) => handleResize(e, actionsContainerRef)}
>
<ResizeHeightIcon />
</div>
</div>
</div>
<div className="triggers">
<div className="header">
<div className="header-value">Triggers</div>
<div className="add-button" onClick={handleAddTrigger}>
<AddIcon /> Add
</div>
</div>
<div
className="lists-main-container"
ref={triggersContainerRef}
style={{ height: "120px" }}
>
<div className="list-container">
{selectedPoint?.triggers.map((trigger) => (
<div
key={trigger.uuid}
className={`list-item ${selectedItem?.type === "trigger" &&
selectedItem.item?.uuid === trigger.uuid
? "active"
: ""
}`}
>
<div
className="value"
onClick={() =>
setSelectedItem({ type: "trigger", item: trigger })
}
>
<input type="radio" name="trigger" id="trigger" checked={trigger.isUsed} readOnly />
<RenameInput value={trigger.name} />
</div>
<div
className="remove-button"
onClick={() => handleDeleteTrigger(trigger.uuid)}
>
<RemoveIcon />
</div>
</div>
))}
</div>
<div
className="resize-icon"
id="trigger-resize"
onMouseDown={(e) => handleResize(e, triggersContainerRef)}
>
<ResizeHeightIcon />
</div>
</div>
</div>
</>
)}
<div className="selected-properties-container">
{selectedItem && (
<>
<div className="properties-header">{selectedItem.item.name}</div>
{selectedItem.type === "action" && (
<>
<InputToggle
inputKey="enableAction"
label="Enable Action"
value={selectedItem.item.isUsed}
onClick={() => handleActionToggle(selectedItem.item.uuid)}
/>
<LabledDropdown
defaultOption={selectedItem.item.type}
options={["Inherit", "Spawn", "Swap", "Despawn", "Delay"]}
onSelect={(option) =>
handleActionSelect(selectedItem.item.uuid, option)
}
/>
{/* Only show material dropdown for Spawn/Swap actions */}
{(selectedItem.item.type === "Spawn" ||
selectedItem.item.type === "Swap") && (
<LabledDropdown
label={
selectedItem.item.type === "Spawn"
? "Spawn Material"
: "Swap Material"
}
defaultOption={selectedItem.item.material}
options={["Inherit", "Crate", "Box"]}
onSelect={(option) =>
handleMaterialSelect(selectedItem.item.uuid, option)
}
/>
)}
{/* Only show delay input for Delay actions */}
{selectedItem.item.type === "Delay" && (
<InputWithDropDown
label="Delay Time"
value={
selectedItem.item.delay === "Inherit"
? undefined
: selectedItem.item.delay
}
onChange={(value) => {
const numValue = parseInt(value);
handleDelayChange(
selectedItem.item.uuid,
!value ? "Inherit" : numValue
);
}}
/>
)}
{/* Only show spawn interval for Spawn actions */}
{selectedItem.item.type === "Spawn" && (
<InputWithDropDown
label="Spawn Interval"
min={0}
defaultValue={
selectedItem.item.spawnInterval === "Inherit"
? ""
: selectedItem.item.spawnInterval.toString()
}
value={
selectedItem.item.spawnInterval === "Inherit"
? ""
: selectedItem.item.spawnInterval.toString()
}
onChange={(value) => {
handleSpawnIntervalChange(
selectedItem.item.uuid,
value === "" ? "Inherit" : parseInt(value)
);
}}
/>
)}
</>
)}
{selectedItem.type === "trigger" && (
<>
<InputToggle
inputKey="enableTrigger"
label="Enable Trigger"
value={selectedItem.item.isUsed}
onClick={() => handleTriggerToggle(selectedItem.item.uuid)}
/>
<LabledDropdown
defaultOption={
selectedItem.item.type || "Select Trigger Type"
}
options={["On-Hit", "Buffer"]}
onSelect={(option) =>
handleTriggerSelect(selectedItem.item.uuid, option)
}
/>
{selectedItem.item.type === "Buffer" && (
<InputWithDropDown
label="Buffer Time"
value={selectedItem.item.bufferTime.toString()}
onChange={(value) => {
handleTriggerBufferTimeChange(
selectedItem.item.uuid,
parseInt(value)
);
}}
/>
)}
</>
)}
</>
)}
{selectedPath && !selectedItem && (
<div
key={selectedPath?.path.modeluuid || "none"}
className="speed-control"
>
<InputWithDropDown
label="Conveyor Speed"
min={0}
value={
selectedPath.path.speed === "Inherit"
? ""
: selectedPath.path.speed.toString()
}
onChange={(value) =>
handleSpeedChange(value === "" ? "Inherit" : parseInt(value))
}
/>
</div>
)}
</div>
{!selectedPath && (
<div className="footer">
<InfoIcon />
Configure the point's action and trigger properties.
</div>
)}
{selectedPath && (
<div className="footer">
<InfoIcon />
Configure the path properties.
</div>
)}
</div>
</div>
);
};
export default ConveyorMechanics;

188
app/src/components/layout/sidebarRight/mechanics/StaticMachineMechanics.tsx
View File

@@ -1,188 +0,0 @@
import React, { useRef, useMemo, useCallback } from "react";
import { InfoIcon } from "../../../icons/ExportCommonIcons";
import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
import { useSelectedActionSphere, useSimulationStates, useSocketStore } from "../../../../store/store";
import * as SimulationTypes from '../../../../types/simulationTypes';
import LabledDropdown from "../../../ui/inputs/LabledDropdown";
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 staticMachinePaths = simulationStates.filter(
(path): path is SimulationTypes.StaticMachineEventsSchema => path.type === "StaticMachine"
);
const points = staticMachinePaths.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: SimulationTypes.StaticMachineEventsSchema | undefined) => {
if (!updatedPath) return;
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "";
// await setEventApi(
// organization,
// updatedPath.modeluuid,
// { type: "Vehicle", points: updatedPath.points }
// );
const data = {
organization: organization,
modeluuid: updatedPath.modeluuid,
eventData: { type: "StaticMachine", points: updatedPath.points }
}
socket.emit('v2:model-asset:updateEventData', data);
}
const handleActionUpdate = useCallback((updatedAction: Partial<SimulationTypes.StaticMachineEventsSchema['points']['actions']>) => {
if (!selectedActionSphere?.points?.uuid) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "StaticMachine" && path.points.uuid === selectedActionSphere.points.uuid) {
return {
...path,
points: {
...path.points,
actions: {
...path.points.actions,
...updatedAction
}
}
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.StaticMachineEventsSchema =>
path.type === "StaticMachine" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, simulationStates, setSimulationStates]);
const handleBufferChange = useCallback((buffer: number) => {
handleActionUpdate({ buffer });
}, [handleActionUpdate]);
const handleMaterialChange = useCallback((material: string) => {
handleActionUpdate({ material });
}, [handleActionUpdate]);
const handleTriggerChange = useCallback((updatedTrigger: Partial<SimulationTypes.StaticMachineEventsSchema['points']['triggers']>) => {
if (!selectedActionSphere?.points?.uuid) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "StaticMachine" && path.points.uuid === selectedActionSphere.points.uuid) {
return {
...path,
points: {
...path.points,
triggers: {
...path.points.triggers,
...updatedTrigger
}
}
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.StaticMachineEventsSchema =>
path.type === "StaticMachine" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, simulationStates, setSimulationStates]);
const handleTriggerTypeChange = useCallback((type: string) => {
handleTriggerChange({ type });
}, [handleTriggerChange]);
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 && (
<>
<InputWithDropDown
key={`buffer-${selectedPoint.uuid}`}
label="Buffer Time"
value={selectedPoint.actions.buffer.toString()}
onChange={(value) => handleBufferChange(parseInt(value))}
/>
<LabledDropdown
key={`material-${selectedPoint.uuid}`}
label="Material"
defaultOption={selectedPoint.actions.material}
onSelect={(value) => handleMaterialChange(value)}
options={["Inherit", "Crate", "Box"]}
/>
<LabledDropdown
key={`trigger-type-${selectedPoint.uuid}`}
label="Trigger Type"
defaultOption={selectedPoint.triggers.type}
onSelect={(value) => handleTriggerTypeChange(value)}
options={["OnComplete", "OnStart"]}
/>
{/* <LabeledButton
label="Reset"
value="Reset Settings"
onClick={() => {
// Implement reset functionality if needed
}}
/> */}
</>
)}
</div>
<div className="footer">
<InfoIcon />
Configure machine interaction properties and triggers.
</div>
</div>
</div>
);
};
export default React.memo(StaticMachineMechanics);

265
app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx
View File

@@ -1,265 +0,0 @@
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 SimulationTypes from '../../../../types/simulationTypes';
import PositionInput from "../customInput/PositionInputs";
import { setEventApi } from "../../../../services/factoryBuilder/assest/floorAsset/setEventsApt";
import LabeledButton from "../../../ui/inputs/LabledButton";
const VehicleMechanics: React.FC = () => {
const { selectedActionSphere } = useSelectedActionSphere();
const { simulationStates, setSimulationStates } = useSimulationStates();
const { eyeDropMode, setEyeDropMode } = useEyeDropMode();
const { editingPoint, setEditingPoint } = useEditingPoint();
const { previewPosition, setPreviewPosition } = usePreviewPosition();
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 SimulationTypes.VehicleEventsSchema => path.type === "Vehicle"
);
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: SimulationTypes.VehicleEventsSchema | undefined) => {
if (!updatedPath) return;
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "";
// await setEventApi(
// organization,
// updatedPath.modeluuid,
// { type: "Vehicle", points: updatedPath.points }
// );
const data = {
organization: organization,
modeluuid: updatedPath.modeluuid,
eventData: { type: "Vehicle", points: updatedPath.points }
}
socket.emit('v2:model-asset:updateEventData', data);
}
const handleActionUpdate = React.useCallback((updatedAction: Partial<SimulationTypes.VehicleEventsSchema['points']['actions']>) => {
if (!selectedActionSphere?.points?.uuid) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "Vehicle" && path.points.uuid === selectedActionSphere.points.uuid) {
return {
...path,
points: {
...path.points,
actions: {
...path.points.actions,
...updatedAction
}
}
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.VehicleEventsSchema =>
path.type === "Vehicle" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, simulationStates, setSimulationStates]);
const handleHitCountChange = React.useCallback((hitCount: number) => {
handleActionUpdate({ hitCount });
}, [handleActionUpdate]);
const handleBufferChange = React.useCallback((buffer: number) => {
handleActionUpdate({ buffer });
}, [handleActionUpdate]);
const handleSpeedChange = React.useCallback((speed: number) => {
if (!selectedActionSphere?.points?.uuid) return;
const updatedPaths = simulationStates.map((path) => {
if (path.type === "Vehicle" && path.points.uuid === selectedActionSphere.points.uuid) {
return {
...path,
points: {
...path.points,
speed: speed
}
};
}
return path;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.VehicleEventsSchema =>
path.type === "Vehicle" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, simulationStates, setSimulationStates]);
const ResetVehicleState = React.useCallback(() => {
if (!selectedActionSphere?.points?.uuid) return;
const updatedPaths = simulationStates.map((state) => {
if (state.type === "Vehicle" && state.points.uuid === selectedActionSphere.points.uuid) {
return {
...state,
points: {
...state.points,
actions: { ...state.points.actions, start: {}, end: {} }
}
};
}
return state;
});
const updatedPath = updatedPaths.find(
(path): path is SimulationTypes.VehicleEventsSchema =>
path.type === "Vehicle" &&
path.points.uuid === selectedActionSphere.points.uuid
);
updateBackend(updatedPath);
setSimulationStates(updatedPaths);
}, [selectedActionSphere?.points?.uuid, simulationStates, setSimulationStates]);
const handleStartEyeDropClick = () => {
setEditingPoint('start');
setEyeDropMode(true);
};
const handleEndEyeDropClick = () => {
setEditingPoint('end');
setEyeDropMode(true);
};
return (
<div className="machine-mechanics-container" key={selectedPoint?.uuid}>
<div className="machine-mechanics-header">
{selectedActionSphere?.path?.modelName || "Vehicle point not found"}
</div>
<div className="machine-mechanics-content-container">
<div className="selected-properties-container" ref={propertiesContainerRef}>
<div className="properties-header">Vehicle Properties</div>
{selectedPoint && (
<>
<PositionInput
label="Start Point"
onChange={() => { }}
disabled={true}
value1={
editingPoint === 'start' && previewPosition
? parseFloat(previewPosition.x.toFixed(4))
: selectedPoint.actions.start && 'x' in selectedPoint.actions.start
? parseFloat(selectedPoint.actions.start.x.toFixed(4))
: 0
}
value2={
editingPoint === 'start' && previewPosition
? parseFloat(previewPosition.y.toFixed(4))
: selectedPoint.actions.start && 'y' in selectedPoint.actions.start
? parseFloat(selectedPoint.actions.start.y.toFixed(4))
: 0
}
isEyedrop={true}
handleEyeDropClick={handleStartEyeDropClick}
/>
<PositionInput
label="End Point"
onChange={() => { }}
disabled={true}
value1={
editingPoint === 'end' && previewPosition
? parseFloat(previewPosition.x.toFixed(4))
: selectedPoint.actions.end && 'x' in selectedPoint.actions.end
? parseFloat(selectedPoint.actions.end.x.toFixed(4))
: 0
}
value2={
editingPoint === 'end' && previewPosition
? parseFloat(previewPosition.y.toFixed(4))
: selectedPoint.actions.end && 'y' in selectedPoint.actions.end
? parseFloat(selectedPoint.actions.end.y.toFixed(4))
: 0
}
isEyedrop={true}
handleEyeDropClick={handleEndEyeDropClick}
/>
<LabeledButton
label="Reset"
value="Clear Points"
onClick={() => {
ResetVehicleState();
}}
/>
<InputWithDropDown
key={`hitcount-${selectedPoint.uuid}`}
label="Hit Count"
value={selectedPoint.actions.hitCount.toString()}
onChange={(value) => handleHitCountChange(parseInt(value))}
/>
<InputWithDropDown
key={`buffer-${selectedPoint.uuid}`}
label="Buffer Time"
value={selectedPoint.actions.buffer.toString()}
onChange={(value) => handleBufferChange(parseInt(value))}
/>
<InputWithDropDown
key={`speed-${selectedPoint.uuid}`}
label="Vehicle Speed"
value={selectedPoint.speed.toString()}
onChange={(value) => handleSpeedChange(parseFloat(value))}
/>
</>
)}
</div>
<div className="footer">
<InfoIcon />
Configure vehicle's movement and interaction properties.
</div>
</div>
</div>
);
};
export default React.memo(VehicleMechanics);

2
app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx
View File

@@ -3,7 +3,7 @@ import RenameInput from "../../../ui/inputs/RenameInput";
import Vector3Input from "../customInput/Vector3Input";
import { useSelectedZoneStore } from "../../../../store/useZoneStore";
import { useEditPosition, usezonePosition, useZones, usezoneTarget } from "../../../../store/store";
import { zoneCameraUpdate } from "../../../../services/realTimeVisulization/zoneData/zoneCameraUpdation";
import { zoneCameraUpdate } from "../../../../services/visulization/zone/zoneCameraUpdation";
const ZoneProperties: React.FC = () => {
const { Edit, setEdit } = useEditPosition();

4
app/src/components/layout/sidebarRight/visualization/design/Design.tsx
View File

@@ -1,9 +1,9 @@
import { useState, useEffect, useRef } from "react";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import ChartComponent from "../../../sidebarLeft/visualization/widgets/ChartComponent";
import ChartComponent from "../../../sidebarLeft//visualization/widgets/ChartComponent";
import RegularDropDown from "../../../../ui/inputs/RegularDropDown";
import { WalletIcon } from "../../../../icons/3dChartIcons";
import SimpleCard from "../../../../../modules/visualization/widgets/floating/cards/SimpleCard";
import SimpleCard from "../../../../../modules//visualization/widgets/floating/cards/SimpleCard";
interface Widget {
id: string;

2
app/src/components/ui/Tools.tsx
View File

@@ -15,7 +15,7 @@ import {
} from "../icons/ExportToolsIcons";
import { ArrowIcon, TickIcon } from "../icons/ExportCommonIcons";
import useModuleStore, { useThreeDStore } from "../../store/useModuleStore";
import { handleSaveTemplate } from "../../modules/visualization/functions/handleSaveTemplate";
import { handleSaveTemplate } from "../../modules//visualization/functions/handleSaveTemplate";
import { usePlayButtonStore } from "../../store/usePlayButtonStore";
import useTemplateStore from "../../store/useTemplateStore";
import { useSelectedZoneStore } from "../../store/useZoneStore";

1
app/src/components/ui/list/DropDownList.tsx
View File

@@ -4,7 +4,6 @@ import { AddIcon, ArrowIcon, FocusIcon } from "../../icons/ExportCommonIcons";
import KebabMenuListMultiSelect from "./KebebMenuListMultiSelect";
import { useFloorItems, useZones } from "../../../store/store";
import { useSelectedZoneStore } from "../../../store/useZoneStore";
import { getZone2dData } from "../../../services/realTimeVisulization/zoneData/getZoneData";
interface DropDownListProps {
value?: string; // Value to display in the DropDownList

4
app/src/components/ui/list/List.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
import RenameInput from "../inputs/RenameInput";
import { useSelectedZoneStore } from "../../../store/useZoneStore";
import { getZoneData } from "../../../services/realTimeVisulization/zoneData/getZones";
import { getZoneData } from "../../../services/visulization/zone/getZones";
import useModuleStore, {
useSubModuleStore,
} from "../../../store/useModuleStore";
@@ -14,7 +14,7 @@ import {
} from "../../icons/ExportCommonIcons";
import { useThree } from "@react-three/fiber";
import { useFloorItems, useZoneAssetId, useZones } from "../../../store/store";
import { zoneCameraUpdate } from "../../../services/realTimeVisulization/zoneData/zoneCameraUpdation";
import { zoneCameraUpdate } from "../../../services/visulization/zone/zoneCameraUpdation";
import { setFloorItemApi } from "../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
interface Asset {