diff --git a/src/modules/blockchains/Buy/hooks/useCheckEdges.ts b/src/modules/blockchains/Buy/hooks/useCheckEdges.ts index 3b94672f7..ddb80a602 100644 --- a/src/modules/blockchains/Buy/hooks/useCheckEdges.ts +++ b/src/modules/blockchains/Buy/hooks/useCheckEdges.ts @@ -2,39 +2,29 @@ import useOrderFormStoreV3 from '@/modules/blockchains/Buy/stores/index_v3'; import useFlowStore from '@/modules/blockchains/Buy/stores/useFlowStore'; import React from 'react'; import { needReactFlowRenderSignal } from '../studio/ReactFlowRender'; +import { removeItemAtIndex } from '@/modules/blockchains/dapp/utils'; const useCheckEdges = () => { const { field } = useOrderFormStoreV3(); - const { nodes, setNodes, edges, setEdges } = useFlowStore(); + const { nodes, setNodes, edges, setEdges, removedNode, setRemovedNode } = useFlowStore(); const checkEdges = () => { - const blockchainNodeIndex = nodes.findIndex( - (node) => node.id === 'blockchain', - ); - const blockchainNode = nodes[blockchainNodeIndex]; + const indexEdgeRemoved = edges.findIndex(edge => edge.target === removedNode?.id ||edge.source === removedNode?.id); + console.log('indexEdgeRemoved', indexEdgeRemoved); + if(indexEdgeRemoved === -1) return; - if (!blockchainNode) return; - const sourceHandles = blockchainNode.data.sourceHandles; - const edgesData = edges.filter((edge) => edge.source === 'blockchain'); - - const newSourceHandles = sourceHandles.filter((sourceHandle) => { - const edgeIndex = edgesData.findIndex( - (edge) => edge.sourceHandle === sourceHandle, - ); - - return edgeIndex !== -1; - }); - - blockchainNode.data.sourceHandles = newSourceHandles; - - setNodes([...nodes]); + setEdges(removeItemAtIndex(edges, indexEdgeRemoved)); + setRemovedNode(null) needReactFlowRenderSignal.value = true; }; React.useEffect(() => { + console.log('runmnnn here'); + if(removedNode === null) return; checkEdges(); - }, [nodes.length]); + }, [removedNode]); + }; export default useCheckEdges; diff --git a/src/modules/blockchains/Buy/hooks/useHandleDragging.ts b/src/modules/blockchains/Buy/hooks/useHandleDragging.ts index 8c860210d..7e0ce28d0 100644 --- a/src/modules/blockchains/Buy/hooks/useHandleDragging.ts +++ b/src/modules/blockchains/Buy/hooks/useHandleDragging.ts @@ -39,7 +39,7 @@ import useOverlappingChainLegoStore from '../stores/useOverlappingChainLegoStore export default function useHandleDragging() { const { setOverlappingId } = useOverlappingChainLegoStore(); - const { nodes, setNodes, edges, setEdges } = useFlowStore(); + const { nodes, setNodes, edges, setEdges, setRemovedNode } = useFlowStore(); const { setIdDragging, rightDragging, @@ -297,6 +297,8 @@ export default function useHandleDragging() { index, ); } + console.log('nodessssss', nodes[ index + 1 + totalTemplateDapps]); + setRemovedNode(nodes[ index + 1 + totalTemplateDapps]) setNodes(removeItemAtIndex(nodes, index + 1 + totalTemplateDapps)); } @@ -313,6 +315,8 @@ export default function useHandleDragging() { index, ); } + console.log('nodessssss1', nodes[ index + 1 + totalTemplateDapps]); + setRemovedNode(nodes[ index + 1 + totalTemplateDapps]) setNodes(removeItemAtIndex(nodes, index + 1 + totalTemplateDapps)); } @@ -404,6 +408,8 @@ export default function useHandleDragging() { draggedIds2DSignal.value, index, ); + console.log('nodessssss2', nodes[ index + 1 + totalTemplateDapps]); + setRemovedNode(nodes[ index + 1 + totalTemplateDapps]) setNodes(removeItemAtIndex(nodes, index + 1 + totalTemplateDapps)); } } @@ -420,6 +426,8 @@ export default function useHandleDragging() { draggedIds2DSignal.value, index, ); + console.log('nodessssss3', nodes[ index + 1 + totalTemplateDapps]); + setRemovedNode(nodes[ index + 1 + totalTemplateDapps]) setNodes(removeItemAtIndex(nodes, index + 1 + totalTemplateDapps)); } } @@ -1123,6 +1131,8 @@ export default function useHandleDragging() { totalTemplateDapps, }); const rootNode = 'blockchain'; + console.log('nodessssss', nodes[removeIndex]); + setRemovedNode(nodes[removeIndex]) let newNodes = removeItemAtIndex(nodes, removeIndex); let getHandleNodeBlockChain = nodes.find( diff --git a/src/modules/blockchains/Buy/hooks/useNodeFlowControl.ts b/src/modules/blockchains/Buy/hooks/useNodeFlowControl.ts index df11d580c..5d81b7395 100644 --- a/src/modules/blockchains/Buy/hooks/useNodeFlowControl.ts +++ b/src/modules/blockchains/Buy/hooks/useNodeFlowControl.ts @@ -276,7 +276,6 @@ export default function useNodeFlowControl() { // sourceHandles: [], }, }; - setNodes([...nodesData, newNode]); setEdges([ ...edges, @@ -450,12 +449,11 @@ export default function useNodeFlowControl() { // sourceHandles: [], }, }; - + console.log('statusMapping', statusMapping); setNodes([...nodesData, newNode]); setEdges([ ...edges, { - // id: `${edges.length + 1}`, id: `${Math.random()}`, source: rootNode, sourceHandle: `${rootNode}-s-${suffix}`, diff --git a/src/modules/blockchains/Buy/index_v8.tsx b/src/modules/blockchains/Buy/index_v8.tsx index 735546420..f1e23e41d 100644 --- a/src/modules/blockchains/Buy/index_v8.tsx +++ b/src/modules/blockchains/Buy/index_v8.tsx @@ -17,6 +17,7 @@ import useOnlyFetchDapp from './hooks/useOnlyFetchDapp'; import useSetDefaultDapp from './hooks/useSetDefaultDapp'; import s from './styles_v6.module.scss'; import useLineIssueToken from '@/modules/blockchains/Buy/hooks/useLineIssueToken'; +import useCheckEdges from '@/modules/blockchains/Buy/hooks/useCheckEdges'; const BuyPage = () => { const { handleDragStart, handleDragEnd, sensors } = useHandleDragging(); @@ -31,8 +32,7 @@ const BuyPage = () => { useGettingDappLego(); useCheckNodes(); useSetDefaultDapp(); - - // useCheckEdges(); + useCheckEdges(); const { tabActive } = useTabs((state) => state); const isTabCode = React.useMemo(() => { diff --git a/src/modules/blockchains/Buy/stores/useFlowStore.ts b/src/modules/blockchains/Buy/stores/useFlowStore.ts index 53fccceef..a46ac08bf 100644 --- a/src/modules/blockchains/Buy/stores/useFlowStore.ts +++ b/src/modules/blockchains/Buy/stores/useFlowStore.ts @@ -21,6 +21,8 @@ export type AppState = { onConnect: OnConnect; setNodes: (nodes: AppNode[]) => void; setEdges: (edges: Edge[]) => void; + removedNode: AppNode | null; + setRemovedNode: (node: AppNode | null) => void; }; const useFlowStore = create((set, get) => ({ @@ -47,6 +49,10 @@ const useFlowStore = create((set, get) => ({ setEdges: (edges) => { set({ edges }); }, + removedNode: null, + setRemovedNode: (node) => { + set({ removedNode: node }); + }, })); export default useFlowStore; diff --git a/src/utils/helpers.ts b/src/utils/helpers.ts index e570b5448..c34bbed4f 100644 --- a/src/utils/helpers.ts +++ b/src/utils/helpers.ts @@ -264,6 +264,7 @@ function handleStatusEdgeByBox(status: any) { switch (status) { case 'draft': case 'setting_up': + case 'Drafting Modules': case EAirdropStatus.new: case '': //draft @@ -291,7 +292,7 @@ function handleStatusEdgeByBox(status: any) { export default function handleStatusEdges(statusDapp: any, status: aa | string, idNode: string) { if (idNode === 'account_abstraction' || idNode === 'bridge_apps' || idNode === 'gaming_apps') { - console.log('status here', status); + console.log('status here', status, idNode); return handleStatusEdgeByBox(status); }