fix(flow): destroy node active generator, verify hasMounted state bef…

…ore invoking renderEdge
worktile · Apr 29, 2024 · 544cf6a · 544cf6a
1 parent b4e7bb9
commit 544cf6a
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 2 deletions.
diff --git a/packages/flow/src/edge.component.ts b/packages/flow/src/edge.component.ts
@@ -51,6 +51,7 @@ export class FlowEdgeComponent<T extends FlowBaseData = FlowBaseData>
 
     ngOnInit(): void {
         super.ngOnInit();
+        this.getRef().setState(this.context.selected ? EdgeStableState.active : EdgeStableState['']);
         this.initializeGenerator();
         this.getRef().buildPathPoints(this.board, this.element);
         renderEdge(this.board, this.element, this.getRef().getState());
@@ -97,5 +98,7 @@ export class FlowEdgeComponent<T extends FlowBaseData = FlowBaseData>
 
     ngOnDestroy(): void {
         super.ngOnDestroy();
+        this.edgeGenerator.destroy();
+        this.edgeLabelGenerator.destroy();
     }
 }
diff --git a/packages/flow/src/generators/edge-label-generator.ts b/packages/flow/src/generators/edge-label-generator.ts
@@ -128,4 +128,10 @@ export class EdgeLabelGenerator extends Generator<FlowEdge, EdgeData, GeneratorO
             this.textManage.updateRectangle();
         }
     }
+
+    destroy(): void {
+        super.destroy();
+        this.textManage.destroy();
+        this.labelIconRef && this.labelIconRef.labelIconComponentRef.destroy();
+    }
 }
diff --git a/packages/flow/src/node.component.ts b/packages/flow/src/node.component.ts
@@ -101,5 +101,6 @@ export class FlowNodeComponent<T extends FlowBaseData = FlowBaseData> extends Co
     ngOnDestroy(): void {
         super.ngOnDestroy();
         this.destroyText();
+        this.nodeActiveGenerator.destroy();
     }
 }
diff --git a/packages/flow/src/plugins/with-hovering.ts b/packages/flow/src/plugins/with-hovering.ts
@@ -4,7 +4,6 @@ import { FlowEdge } from '../interfaces/edge';
 import { getHitEdge, getHitNode, isEdgeDragging, isPlaceholderEdgeInfo, renderEdge, renderRelatedEdges } from '../utils';
 import { PlaitCommonElementRef } from '@plait/common';
 import { NodeActiveGenerator } from '../generators/node-active.generator';
-import { EdgeState } from '../public-api';
 
 export const withHovering: PlaitPlugin = (board: PlaitBoard) => {
     const { pointerMove, pointerLeave } = board;
@@ -22,7 +21,7 @@ export const withHovering: PlaitPlugin = (board: PlaitBoard) => {
             hoveredElement = newHitNode;
             return;
         }
-        if (hoveredElement) {
+        if (hoveredElement && PlaitElement.hasMounted(hoveredElement)) {
             const selected = isSelectedElement(board, hoveredElement);
             if (FlowNode.isFlowNodeElement(hoveredElement)) {
                 const elementRef = PlaitElement.getElementRef<PlaitCommonElementRef>(hoveredElement);