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

v2-ui #84

Merged
Vishnu merged 53 commits from v2-ui into main 2025-05-10 13:42:19 +00:00
Conversation 0 Commits 53 Files Changed 92 +59 -39
11 changed files with 59 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 25697f99a3 - Show all commits

8
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx
View File

@ -8,7 +8,7 @@ import SwapAction from "../actions/SwapAction";
import SpawnAction from "../actions/SpawnAction"; import SpawnAction from "../actions/SpawnAction";
import DefaultAction from "../actions/DefaultAction"; import DefaultAction from "../actions/DefaultAction";
import Trigger from "../trigger/Trigger"; import Trigger from "../trigger/Trigger";
import { useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore"; import { useSelectedAction, useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/UpsertProductOrEventApi"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/UpsertProductOrEventApi";
@ -19,6 +19,7 @@ function ConveyorMechanics() {
const { selectedEventData } = useSelectedEventData(); const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore(); const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
const email = localStorage.getItem('email') const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0]; const organization = (email!.split("@")[1]).split(".")[0];
@ -33,9 +34,12 @@ function ConveyorMechanics() {
if (point && "action" in point) { if (point && "action" in point) {
setSelectedPointData(point); setSelectedPointData(point);
setActiveOption(point.action.actionType as | "default" | "spawn" | "swap" | "delay" | "despawn"); setActiveOption(point.action.actionType as | "default" | "spawn" | "swap" | "delay" | "despawn");
setSelectedAction(point.action.actionUuid, point.action.actionName);
} }
} else {
clearSelectedAction();
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData]);
const updateBackend = ( const updateBackend = (
productName: string, productName: string,

10
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx
View File

@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
import RenameInput from "../../../../../ui/inputs/RenameInput"; import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger"; import Trigger from "../trigger/Trigger";
import { useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore"; import { useSelectedAction, useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import ProcessAction from "../actions/ProcessAction"; import ProcessAction from "../actions/ProcessAction";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
@ -14,6 +14,7 @@ function MachineMechanics() {
const { selectedEventData } = useSelectedEventData(); const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, updateAction } = useProductStore(); const { getPointByUuid, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
const email = localStorage.getItem('email') const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0]; const organization = (email!.split("@")[1]).split(".")[0];
@ -28,9 +29,12 @@ function MachineMechanics() {
if (point && "action" in point) { if (point && "action" in point) {
setSelectedPointData(point); setSelectedPointData(point);
setActiveOption(point.action.actionType as "process"); setActiveOption(point.action.actionType as "process");
setSelectedAction(point.action.actionUuid, point.action.actionName);
} }
} else {
clearSelectedAction();
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData]);
const updateBackend = ( const updateBackend = (
productName: string, productName: string,
@ -137,7 +141,7 @@ function MachineMechanics() {
</div> </div>
</div> </div>
<div className="tirgger"> <div className="tirgger">
<Trigger selectedPointData={selectedPointData as any} type= {'Machine'} /> <Trigger selectedPointData={selectedPointData as any} type={'Machine'} />
</div> </div>
</section> </section>
)} )}

2
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx
View File

@ -258,7 +258,7 @@ function RoboticArmMechanics() {
<div className="selected-actions-details"> <div className="selected-actions-details">
<div className="selected-actions-header"> <div className="selected-actions-header">
<RenameInput <RenameInput
value={selectedAction.actionName} value={selectedAction.actionName || ''}
onRename={handleRenameAction} onRename={handleRenameAction}
/> />
</div> </div>

10
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx
View File

@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
import RenameInput from "../../../../../ui/inputs/RenameInput"; import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger"; import Trigger from "../trigger/Trigger";
import { useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore"; import { useSelectedAction, useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import StorageAction from "../actions/StorageAction"; import StorageAction from "../actions/StorageAction";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
@ -14,6 +14,7 @@ function StorageMechanics() {
const { selectedEventData } = useSelectedEventData(); const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, updateAction } = useProductStore(); const { getPointByUuid, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
const email = localStorage.getItem('email') const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0]; const organization = (email!.split("@")[1]).split(".")[0];
@ -28,9 +29,12 @@ function StorageMechanics() {
if (point && "action" in point) { if (point && "action" in point) {
setSelectedPointData(point); setSelectedPointData(point);
setActiveOption(point.action.actionType as "store" | "spawn"); setActiveOption(point.action.actionType as "store" | "spawn");
setSelectedAction(point.action.actionUuid, point.action.actionName);
} }
} else {
clearSelectedAction();
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData]);
const updateBackend = ( const updateBackend = (
productName: string, productName: string,
@ -146,7 +150,7 @@ function StorageMechanics() {
</div> </div>
</div> </div>
<div className="tirgger"> <div className="tirgger">
<Trigger selectedPointData={selectedPointData as any} type= {'StorageUnit'} /> <Trigger selectedPointData={selectedPointData as any} type={'StorageUnit'} />
</div> </div>
</section> </section>
)} )}

9
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx
View File

@ -4,6 +4,7 @@ import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger"; import Trigger from "../trigger/Trigger";
import { import {
useSelectedAction,
useSelectedEventData, useSelectedEventData,
useSelectedProduct, useSelectedProduct,
} from "../../../../../../store/simulation/useSimulationStore"; } from "../../../../../../store/simulation/useSimulationStore";
@ -18,6 +19,7 @@ function VehicleMechanics() {
const { selectedEventData } = useSelectedEventData(); const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore(); const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
const email = localStorage.getItem('email') const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0]; const organization = (email!.split("@")[1]).split(".")[0];
@ -33,9 +35,12 @@ function VehicleMechanics() {
if (point) { if (point) {
setSelectedPointData(point); setSelectedPointData(point);
setActiveOption(point.action.actionType as "travel"); setActiveOption(point.action.actionType as "travel");
setSelectedAction(point.action.actionUuid, point.action.actionName);
} }
} else {
clearSelectedAction();
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData]);
const updateBackend = ( const updateBackend = (
productName: string, productName: string,
@ -235,7 +240,7 @@ function VehicleMechanics() {
</div> </div>
</div> </div>
<div className="tirgger"> <div className="tirgger">
<Trigger selectedPointData={selectedPointData as any} type= {'Vehicle'} /> <Trigger selectedPointData={selectedPointData as any} type={'Vehicle'} />
</div> </div>
</section> </section>
</> </>

2
app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx
View File

@ -37,7 +37,7 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
if (type === 'Conveyor' || type === 'Vehicle' || type === 'Machine' || type === 'StorageUnit') { if (type === 'Conveyor' || type === 'Vehicle' || type === 'Machine' || type === 'StorageUnit') {
actionUuid = (selectedPointData as ConveyorPointSchema | VehiclePointSchema | MachinePointSchema | StoragePointSchema).action?.actionUuid; actionUuid = (selectedPointData as ConveyorPointSchema | VehiclePointSchema | MachinePointSchema | StoragePointSchema).action?.actionUuid;
} else if (type === 'RoboticArm' && selectedAction) { } else if (type === 'RoboticArm' && selectedAction && selectedAction.actionId) {
actionUuid = selectedAction.actionId; actionUuid = selectedAction.actionId;
} }

18
app/src/modules/simulation/triggers/connector/triggerConnector.tsx
View File

@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from "react";
import { useFrame, useThree } from "@react-three/fiber"; import { useFrame, useThree } from "@react-three/fiber";
import * as THREE from "three"; import * as THREE from "three";
import { useSubModuleStore } from "../../../../store/useModuleStore"; import { useSubModuleStore } from "../../../../store/useModuleStore";
import { useSelectedAsset } from "../../../../store/simulation/useSimulationStore"; import { useSelectedAction, useSelectedAsset } from "../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../store/simulation/useProductStore";
import { useEventsStore } from "../../../../store/simulation/useEventsStore"; import { useEventsStore } from "../../../../store/simulation/useEventsStore";
import { useSelectedProduct } from "../../../../store/simulation/useSimulationStore"; import { useSelectedProduct } from "../../../../store/simulation/useSimulationStore";
@ -22,7 +22,7 @@ interface ConnectionLine {
function TriggerConnector() { function TriggerConnector() {
const { gl, raycaster, scene, pointer, camera } = useThree(); const { gl, raycaster, scene, pointer, camera } = useThree();
const { subModule } = useSubModuleStore(); const { subModule } = useSubModuleStore();
const { products, getPointByUuid, getIsEventInProduct, getActionByUuid, addTrigger, removeTrigger, addEvent, getEventByModelUuid, getProductById } = useProductStore(); const { products, getPointByUuid, getIsEventInProduct, getActionByUuid, addTrigger, removeTrigger, addEvent, getEventByModelUuid, getPointUuidByActionUuid, getProductById } = useProductStore();
const { selectedAsset, clearSelectedAsset } = useSelectedAsset(); const { selectedAsset, clearSelectedAsset } = useSelectedAsset();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const [hoveredLineKey, setHoveredLineKey] = useState<string | null>(null); const [hoveredLineKey, setHoveredLineKey] = useState<string | null>(null);
@ -31,6 +31,7 @@ function TriggerConnector() {
const [currentLine, setCurrentLine] = useState<{ start: THREE.Vector3; end: THREE.Vector3; mid: THREE.Vector3; } | null>(null); const [currentLine, setCurrentLine] = useState<{ start: THREE.Vector3; end: THREE.Vector3; mid: THREE.Vector3; } | null>(null);
const { deleteTool } = useDeleteTool(); const { deleteTool } = useDeleteTool();
const { isPlaying } = usePlayButtonStore(); const { isPlaying } = usePlayButtonStore();
const { selectedAction } = useSelectedAction();
const [firstSelectedPoint, setFirstSelectedPoint] = useState<{ const [firstSelectedPoint, setFirstSelectedPoint] = useState<{
productId: string; productId: string;
@ -50,7 +51,7 @@ function TriggerConnector() {
organization: string, organization: string,
eventData: EventsSchema eventData: EventsSchema
) => { ) => {
const data =upsertProductOrEventApi({ upsertProductOrEventApi({
productName: productName, productName: productName,
productId: productId, productId: productId,
organization: organization, organization: organization,
@ -201,6 +202,7 @@ function TriggerConnector() {
); );
const event = getEventByModelUuid(selectedProduct.productId, modelUuid); const event = getEventByModelUuid(selectedProduct.productId, modelUuid);
const clickedPointUuid = getPointUuidByActionUuid(selectedProduct.productId, selectedAction.actionId || '');
if (!point || !event) { if (!point || !event) {
setFirstSelectedPoint(null); setFirstSelectedPoint(null);
@ -215,11 +217,12 @@ function TriggerConnector() {
} }
if (!firstSelectedPoint) { if (!firstSelectedPoint) {
if (point.uuid !== clickedPointUuid) return;
setFirstSelectedPoint({ setFirstSelectedPoint({
productId: selectedProduct.productId, productId: selectedProduct.productId,
modelUuid, modelUuid,
pointUuid, pointUuid,
actionUuid actionUuid: selectedAction.actionId || ''
}); });
} else { } else {
const trigger: TriggerSchema = { const trigger: TriggerSchema = {
@ -323,11 +326,13 @@ function TriggerConnector() {
} }
}; };
if (subModule === 'simulations' && !deleteTool) { if (subModule === 'mechanics' && !deleteTool && selectedAction.actionId && selectedAction.actionName) {
canvasElement.addEventListener("mousedown", onMouseDown); canvasElement.addEventListener("mousedown", onMouseDown);
canvasElement.addEventListener("mouseup", onMouseUp); canvasElement.addEventListener("mouseup", onMouseUp);
canvasElement.addEventListener("mousemove", onMouseMove); canvasElement.addEventListener("mousemove", onMouseMove);
canvasElement.addEventListener('contextmenu', handleRightClick); canvasElement.addEventListener('contextmenu', handleRightClick);
} else {
setFirstSelectedPoint(null);
} }
return () => { return () => {
@ -337,8 +342,7 @@ function TriggerConnector() {
canvasElement.removeEventListener('contextmenu', handleRightClick); canvasElement.removeEventListener('contextmenu', handleRightClick);
}; };
}, [gl, subModule, selectedProduct, firstSelectedPoint, deleteTool]); }, [gl, subModule, selectedProduct, firstSelectedPoint, deleteTool, selectedAction]);
useFrame(() => { useFrame(() => {
if (firstSelectedPoint) { if (firstSelectedPoint) {

2
app/src/modules/simulation/triggers/trigger.tsx
View File

@ -1,7 +1,7 @@
import React from 'react'
import TriggerConnector from './connector/triggerConnector' import TriggerConnector from './connector/triggerConnector'
function Trigger() { function Trigger() {
return ( return (
<> <>

27
app/src/modules/simulation/triggers/triggerHandler/useTriggerHandler.ts
View File

@ -133,8 +133,6 @@ export function useTriggerHandler() {
if (armBot.isActive === false && armBot.state === 'idle') { if (armBot.isActive === false && armBot.state === 'idle') {
setIsPaused(material.materialId, true);
// Handle current action from arm bot // Handle current action from arm bot
handleAction(action, materialId); handleAction(action, materialId);
@ -265,6 +263,7 @@ export function useTriggerHandler() {
if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
setIsPaused(material.materialId, false); setIsPaused(material.materialId, false);
setPreviousLocation(material.materialId, { setPreviousLocation(material.materialId, {
@ -357,18 +356,6 @@ export function useTriggerHandler() {
const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid); const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid);
const vehicle = getVehicleById(trigger.triggeredAsset?.triggeredModel.modelUuid); const vehicle = getVehicleById(trigger.triggeredAsset?.triggeredModel.modelUuid);
setPreviousLocation(material.materialId, {
modelUuid: material.current.modelUuid,
pointUuid: material.current.pointUuid,
actionUuid: material.current.actionUuid,
})
setCurrentLocation(material.materialId, {
modelUuid: trigger.triggeredAsset.triggeredModel.modelUuid,
pointUuid: trigger.triggeredAsset.triggeredPoint.pointUuid,
actionUuid: trigger.triggeredAsset?.triggeredAction?.actionUuid,
});
setNextLocation(material.materialId, null); setNextLocation(material.materialId, null);
if (action) { if (action) {
@ -379,6 +366,18 @@ export function useTriggerHandler() {
setIsVisible(materialId, false); setIsVisible(materialId, false);
setPreviousLocation(material.materialId, {
modelUuid: material.current.modelUuid,
pointUuid: material.current.pointUuid,
actionUuid: material.current.actionUuid,
})
setCurrentLocation(material.materialId, {
modelUuid: trigger.triggeredAsset.triggeredModel.modelUuid,
pointUuid: trigger.triggeredAsset.triggeredPoint.pointUuid,
actionUuid: trigger.triggeredAsset?.triggeredAction?.actionUuid,
});
// Handle current action from vehicle // Handle current action from vehicle
handleAction(action, materialId); handleAction(action, materialId);

2
app/src/modules/simulation/ui/arm/armBotUI.tsx
View File

@ -53,7 +53,7 @@ const ArmBotUI = () => {
if (selectedEventSphere) { if (selectedEventSphere) {
const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventSphere.userData.modelUuid); const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventSphere.userData.modelUuid);
if (selectedArmBot?.type === "roboticArm") { if (selectedArmBot?.type === "roboticArm" && selectedAction.actionId) {
setSelectedArmBotData(selectedArmBot); setSelectedArmBotData(selectedArmBot);
const defaultPositions = getDefaultPositions(selectedArmBot.modelUuid); const defaultPositions = getDefaultPositions(selectedArmBot.modelUuid);
const matchingAction = getActionByUuid(selectedProduct.productId, selectedAction.actionId); const matchingAction = getActionByUuid(selectedProduct.productId, selectedAction.actionId);

8
app/src/store/simulation/useSimulationStore.ts
View File

@ -93,14 +93,14 @@ export const useSelectedProduct = create<SelectedProductState>()(
); );
interface SelectedActionState { interface SelectedActionState {
selectedAction: { actionId: string; actionName: string }; selectedAction: { actionId: string | null; actionName: string | null };
setSelectedAction: (actionId: string, actionName: string) => void; setSelectedAction: (actionId: string, actionName: string) => void;
clearSelectedAction: () => void; clearSelectedAction: () => void;
} }
export const useSelectedAction = create<SelectedActionState>()( export const useSelectedAction = create<SelectedActionState>()(
immer((set) => ({ immer((set) => ({
selectedAction: { actionId: '', actionName: '' }, selectedAction: { actionId: null, actionName: null },
setSelectedAction: (actionId, actionName) => { setSelectedAction: (actionId, actionName) => {
set((state) => { set((state) => {
state.selectedAction.actionId = actionId; state.selectedAction.actionId = actionId;
@ -109,8 +109,8 @@ export const useSelectedAction = create<SelectedActionState>()(
}, },
clearSelectedAction: () => { clearSelectedAction: () => {
set((state) => { set((state) => {
state.selectedAction.actionId = ''; state.selectedAction.actionId = null;
state.selectedAction.actionName = ''; state.selectedAction.actionName = null;
}); });
}, },
})) }))