diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index 43f3167eccaf..bfbc1f758326 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -345,7 +345,9 @@ export default function Page({ view }: { view?: boolean }): JSX.Element { track("Component Connection Deleted"); } if (lastSelection.nodes?.length) { - track("Component Deleted"); + lastSelection.nodes.forEach((n) => { + track("Component Deleted", { componentType: n.data.type }); + }); } deleteNode(lastSelection.nodes.map((node) => node.id)); deleteEdge(lastSelection.edges.map((edge) => edge.id)); diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts index c5b6e290e33a..7dd8d11f52d1 100644 --- a/src/frontend/src/stores/flowStore.ts +++ b/src/frontend/src/stores/flowStore.ts @@ -269,14 +269,32 @@ const useFlowStore = create((set, get) => ({ return get().nodes.find((node) => node.id === id); }, deleteNode: (nodeId) => { - get().setNodes( - get().nodes.filter((node) => - typeof nodeId === "string" - ? node.id !== nodeId - : !nodeId.includes(node.id), - ), + const { filteredNodes, deletedNode } = get().nodes.reduce<{ + filteredNodes: Node[]; + deletedNode: Node | null; + }>( + (acc, node) => { + const isMatch = + typeof nodeId === "string" + ? node.id === nodeId + : nodeId.includes(node.id); + + if (isMatch) { + acc.deletedNode = node; + } else { + acc.filteredNodes.push(node); + } + + return acc; + }, + { filteredNodes: [], deletedNode: null }, ); - track("Component Deleted", { nodeId }); + + get().setNodes(filteredNodes); + + if (deletedNode) { + track("Component Deleted", { componentType: deletedNode.data.type }); + } }, deleteEdge: (edgeId) => { get().setEdges(