fix: fix removing parent combo of node not effect (#6566)

* chore: update graphlib version

* fix: support remove parent

* docs: update docs

packages/g6/__tests__/bugs/model-remove-parent.spec.ts

@@ -0,0 +1,34 @@
+import { createGraph } from '@@/utils';
+
+it('model remove parent', async () => {
+  const data = {
+    nodes: [
+      { id: 'node1', combo: 'combo1', style: { x: 250, y: 150 } },
+      { id: 'node2', combo: 'combo1', style: { x: 350, y: 150 } },
+      { id: 'node3', combo: 'combo1', style: { x: 250, y: 300 } },
+    ],
+    edges: [],
+    combos: [{ id: 'combo1' }],
+  };
+
+  const graph = createGraph({
+    data,
+    node: {
+      style: {
+        labelText: (d) => d.id,
+      },
+    },
+    combo: {
+      type: 'rect',
+    },
+  });
+
+  await graph.render();
+
+  await expect(graph).toMatchSnapshot(__filename);
+
+  graph.updateNodeData([{ id: 'node3', combo: null }]);
+  await graph.draw();
+
+  await expect(graph).toMatchSnapshot(__dirname, 'remove-parent');
+});

packages/g6/package.json

@@ -63,7 +63,7 @@
     "@antv/g": "^6.1.11",
     "@antv/g-canvas": "^2.0.29",
     "@antv/g-plugin-dragndrop": "^2.0.22",
-    "@antv/graphlib": "^2.0.3",
+    "@antv/graphlib": "^2.0.4",
     "@antv/hierarchy": "^0.6.14",
     "@antv/layout": "1.2.14-beta.9",
     "@antv/util": "^3.3.10",

packages/g6/src/runtime/data.ts

@@ -1,5 +1,5 @@
 import { Graph as GraphLib } from '@antv/graphlib';
-import { isNumber, isUndefined, uniq } from '@antv/util';
+import { isNil, isNumber, uniq } from '@antv/util';
 import { COMBO_KEY, ChangeType, TREE_KEY } from '../constants';
 import type { ComboData, EdgeData, GraphData, NodeData } from '../spec';
 import type {
@@ -518,8 +518,15 @@ export class DataController {
       const id = idOf(datum);
       const parent = parentIdOf(datum);
 
-      if (parent) {
+      if (parent !== undefined) {
         if (!model.hasTreeStructure(COMBO_KEY)) model.attachTreeStructure(COMBO_KEY);
+
+        // 解除原父节点的子节点关系，更新原父节点及其祖先的数据
+        // Remove the child relationship of the original parent node, update the data of the original parent node and its ancestors
+        if (parent === null) {
+          this.refreshComboData(id);
+        }
+
         this.setParent(id, parentIdOf(datum), COMBO_KEY);
       }
 
@@ -665,7 +672,7 @@ export class DataController {
    * @param hierarchyKey - <zh/> 层次结构类型 | <en/> hierarchy type
    * @param update - <zh/> 添加新/旧父节点数据更新记录 | <en/> add new/old parent node data update record
    */
-  public setParent(id: ID, parent: ID | undefined, hierarchyKey: HierarchyKey, update: boolean = true) {
+  public setParent(id: ID, parent: ID | undefined | null, hierarchyKey: HierarchyKey, update: boolean = true) {
     if (id === parent) return;
     const elementData = this.getNodeLikeDatum(id);
     const originalParentId = parentIdOf(elementData);
@@ -891,7 +898,7 @@ export class DataController {
         this.model.mergeNodeData(idOf(childData), value);
       });
 
-      if (!isUndefined(grandParent)) this.refreshComboData(grandParent);
+      if (!isNil(grandParent)) this.refreshComboData(grandParent);
     }
   }
 

packages/g6/src/spec/data.ts

@@ -92,7 +92,7 @@ export interface NodeData {
    *
    * <en/> ID of the combo to which the node belongs
    */
-  combo?: ID;
+  combo?: ID | null;
   /**
    * <zh/> 子节点 ID
    *
@@ -161,7 +161,7 @@ export interface ComboData {
    *
    * <en/> ID of the combo to which the combo belongs
    */
-  combo?: ID;
+  combo?: ID | null;
   [key: string]: unknown;
 }
 

packages/site/docs/manual/faq.en.md

@@ -268,3 +268,11 @@ graph.on(NodeEvent.CLICK, (event: IPointerEvent) => {
   // handler
 });
 ```
+
+### Remove the parent combo of the node
+
+Update the node data, set the `combo` value to `null`.
+
+```typescript
+graph.updateNodeData([{ id: 'node-id', combo: null }]);
+```

packages/site/docs/manual/faq.zh.md

@@ -268,3 +268,11 @@ graph.on(NodeEvent.CLICK, (event: IPointerEvent) => {
   // handler
 });
 ```
+
+### 解除节点所在组合
+
+更新节点数据，`combo` 值设置为 `null`。
+
+```typescript
+graph.updateNodeData([{ id: 'node-id', combo: null }]);
+```