Refactor trigger handling in Trigger component: update trigger selection logic and add memoization for performance; enhance renameTrigger function in useProductStore to return updated event.

This commit is contained in:
Jerald-Golden-B 2025-05-03 13:23:01 +05:30
parent 649352b4b4
commit 71fdb26e16
3 changed files with 113 additions and 52 deletions

View File

@ -200,9 +200,8 @@ function RoboticArmMechanics() {
);
}
const newActions = selectedPointData.actions.filter(
(a: any) => a.actionUuid !== actionUuid
);
const index = selectedPointData.actions.findIndex(a => a.actionUuid === actionUuid);
const newActions = selectedPointData.actions.filter(a => a.actionUuid !== actionUuid);
const updatedPoint = {
...selectedPointData,
@ -211,8 +210,9 @@ function RoboticArmMechanics() {
setSelectedPointData(updatedPoint);
if (selectedAction.actionId === actionUuid) {
if (newActions.length > 0) {
setSelectedAction(newActions[0].actionUuid, newActions[0].actionName);
const nextAction = newActions[index] || newActions[index - 1];
if (nextAction) {
setSelectedAction(nextAction.actionUuid, nextAction.actionName);
} else {
clearSelectedAction();
}

View File

@ -20,7 +20,7 @@ type TriggerProps = {
const Trigger = ({ selectedPointData, type }: TriggerProps) => {
const [currentAction, setCurrentAction] = useState<string | undefined>();
const { selectedProduct } = useSelectedProduct();
const { getActionByUuid, getEventByModelUuid, getPointByUuid, addTrigger, removeTrigger, updateTrigger, renameTrigger, getProductById } = useProductStore();
const { getActionByUuid, getEventByModelUuid, getPointByUuid, getTriggerByUuid, addTrigger, removeTrigger, updateTrigger, renameTrigger, getProductById } = useProductStore();
const [triggers, setTriggers] = useState<TriggerSchema[]>([]);
const [selectedTrigger, setSelectedTrigger] = useState<TriggerSchema | undefined>();
const [activeOption, setActiveOption] = useState<"onComplete" | "onStart" | "onStop" | "delay" | "onError">("onComplete");
@ -43,7 +43,6 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
setCurrentAction(actionUuid);
}, [selectedPointData, selectedProduct, type]);
const updateBackend = (
productName: string,
productId: string,
@ -66,50 +65,27 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
setSelectedTrigger(actionTriggers[0]);
}, [currentAction, selectedProduct]);
const handleAddTrigger = () => {
if (!selectedProduct || !currentAction) return;
const triggeredModel = useMemo(() => {
if (!selectedProduct || !selectedTrigger?.triggeredAsset?.triggeredModel?.modelUuid) return undefined;
return getEventByModelUuid(selectedProduct.productId, selectedTrigger.triggeredAsset.triggeredModel.modelUuid);
}, [selectedProduct, selectedTrigger]);
const newTrigger: TriggerSchema = {
triggerUuid: THREE.MathUtils.generateUUID(),
triggerName: `New Trigger ${triggers.length + 1}`,
triggerType: activeOption,
delay: 0,
triggeredAsset: null
};
const triggeredPoint = useMemo(() => {
if (!selectedProduct || !triggeredModel || !selectedTrigger?.triggeredAsset?.triggeredPoint?.pointUuid) return undefined;
return getPointByUuid(
selectedProduct.productId,
triggeredModel.modelUuid,
selectedTrigger.triggeredAsset.triggeredPoint.pointUuid
);
}, [selectedProduct, triggeredModel, selectedTrigger]);
addTrigger(selectedProduct.productId, currentAction, newTrigger);
setSelectedTrigger(newTrigger);
};
const handleRemoveTrigger = (triggerUuid: string) => {
if (!selectedProduct) return;
removeTrigger(selectedProduct.productId, triggerUuid);
if (selectedTrigger?.triggerUuid === triggerUuid) {
const remainingTriggers = triggers.filter(t => t.triggerUuid !== triggerUuid);
setSelectedTrigger(remainingTriggers[0]);
}
};
const handleTriggerRename = (triggerUuid: string, newName: string) => {
if (!selectedProduct) return;
renameTrigger(selectedProduct.productId, triggerUuid, newName);
};
const handleTriggerTypeChange = (option: string) => {
if (!selectedTrigger || !selectedProduct) return;
const validTypes: Array<TriggerSchema['triggerType']> = ["onComplete", "onStart", "onStop", "delay", "onError"];
if (!validTypes.includes(option as TriggerSchema['triggerType'])) return;
setActiveOption(option as TriggerSchema['triggerType']);
updateTrigger(selectedProduct.productId, selectedTrigger.triggerUuid, {
triggerType: option as TriggerSchema['triggerType']
});
};
const triggeredModel = getEventByModelUuid(selectedProduct.productId, selectedTrigger?.triggeredAsset?.triggeredModel?.modelUuid || "");
const triggeredPoint = getPointByUuid(selectedProduct.productId, triggeredModel?.modelUuid || '', selectedTrigger?.triggeredAsset?.triggeredPoint?.pointUuid || "");
const triggeredAction = getActionByUuid(selectedProduct.productId, selectedTrigger?.triggeredAsset?.triggeredAction?.actionUuid || '');
const triggeredAction = useMemo(() => {
if (!selectedProduct || !selectedTrigger?.triggeredAsset?.triggeredAction?.actionUuid) return undefined;
return getActionByUuid(
selectedProduct.productId,
selectedTrigger.triggeredAsset.triggeredAction.actionUuid
);
}, [selectedProduct, selectedTrigger]);
const modelOptions = getProductById(selectedProduct.productId)?.eventDatas || [];
@ -160,6 +136,9 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
});
if (event) {
const updatedTrigger = getTriggerByUuid(selectedProduct.productId, triggerUuid);
setSelectedTrigger(updatedTrigger);
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
@ -172,8 +151,7 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
const handlePointSelect = (option: string, triggerUuid: string) => {
if (!selectedProduct || !selectedTrigger) return;
const pointUuid = pointOptions.find(p => `Point ${p.uuid.slice(0, 5)}` === option)?.uuid;
const pointUuid = pointOptions.find(p => `Point ${p.uuid.slice(0, 4)}` === option)?.uuid;
if (!pointUuid) return;
if (selectedTrigger.triggeredAsset?.triggeredModel) {
@ -189,6 +167,9 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
});
if (event) {
const updatedTrigger = getTriggerByUuid(selectedProduct.productId, triggerUuid);
setSelectedTrigger(updatedTrigger);
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
@ -199,6 +180,7 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
}
};
const handleActionSelect = (option: string, triggerUuid: string) => {
if (!selectedProduct || !selectedTrigger) return;
@ -228,6 +210,80 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
}
};
const handleAddTrigger = () => {
if (!selectedProduct || !currentAction) return;
const newTrigger: TriggerSchema = {
triggerUuid: THREE.MathUtils.generateUUID(),
triggerName: `New Trigger ${triggers.length + 1}`,
triggerType: activeOption,
delay: 0,
triggeredAsset: null
};
addTrigger(selectedProduct.productId, currentAction, newTrigger);
setSelectedTrigger(newTrigger);
};
const handleRemoveTrigger = (triggerUuid: string) => {
if (!selectedProduct || !currentAction) return;
const event = removeTrigger(selectedProduct.productId, triggerUuid);
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
const index = triggers.findIndex(t => t.triggerUuid === triggerUuid);
const newTriggers = triggers.filter(t => t.triggerUuid !== triggerUuid);
setTriggers(newTriggers);
if (selectedTrigger?.triggerUuid === triggerUuid) {
const nextTrigger = newTriggers[index] || newTriggers[index - 1];
setSelectedTrigger(nextTrigger);
}
};
const handleTriggerRename = (triggerUuid: string, newName: string) => {
if (!selectedProduct) return;
const event = renameTrigger(selectedProduct.productId, triggerUuid, newName);
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
};
const handleTriggerTypeChange = (option: string) => {
if (!selectedTrigger || !selectedProduct) return;
const validTypes: Array<TriggerSchema['triggerType']> = ["onComplete", "onStart", "onStop", "delay", "onError"];
if (!validTypes.includes(option as TriggerSchema['triggerType'])) return;
setActiveOption(option as TriggerSchema['triggerType']);
const event = updateTrigger(selectedProduct.productId, selectedTrigger.triggerUuid, {
triggerType: option as TriggerSchema['triggerType']
});
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
};
return (
<div className="trigger-wrapper">
<div className="header">

View File

@ -56,7 +56,7 @@ type ProductsStore = {
// Renaming functions
renameProduct: (productId: string, newName: string) => void;
renameAction: (productId: string, actionUuid: string, newName: string) => EventsSchema | undefined;
renameTrigger: (productId: string, triggerUuid: string, newName: string) => void;
renameTrigger: (productId: string, triggerUuid: string, newName: string) => EventsSchema | undefined;
// Helper functions
getProductById: (productId: string) => { productName: string; productId: string; eventDatas: EventsSchema[] } | undefined;
@ -482,6 +482,7 @@ export const useProductStore = create<ProductsStore>()(
},
renameTrigger: (productId, triggerUuid, newName) => {
let updatedEvent: EventsSchema | undefined;
set((state) => {
const product = state.products.find(p => p.productId === productId);
if (product) {
@ -492,6 +493,7 @@ export const useProductStore = create<ProductsStore>()(
const trigger = point.action.triggers.find(t => t.triggerUuid === triggerUuid);
if (trigger) {
trigger.triggerName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return;
}
}
@ -502,6 +504,7 @@ export const useProductStore = create<ProductsStore>()(
const trigger = point.action.triggers.find((t: any) => t.triggerUuid === triggerUuid);
if (trigger) {
trigger.triggerName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return;
}
} else if ('actions' in point) {
@ -510,6 +513,7 @@ export const useProductStore = create<ProductsStore>()(
const trigger = action.triggers.find((t: any) => t.triggerUuid === triggerUuid);
if (trigger) {
trigger.triggerName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return;
}
}
@ -519,6 +523,7 @@ export const useProductStore = create<ProductsStore>()(
}
}
});
return updatedEvent;
},
// Helper functions