fix: global variable table update (#542)

packages/variable-engine/variable-core/src/react/hooks/useScopeOutputVariables.ts

@@ -1,66 +0,0 @@
-/**
- * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
- * SPDX-License-Identifier: MIT
- */
-
-import { useCallback, useEffect, useMemo, useState } from 'react';
-
-import { DisposableCollection } from '@flowgram.ai/utils';
-import { useService } from '@flowgram.ai/core';
-
-import { useCurrentScope } from '../context';
-import { VariableEngine } from '../../variable-engine';
-import { Scope } from '../../scope';
-import {
-  DisposeASTAction,
-  GlobalEventActionType,
-  NewASTAction,
-  UpdateASTAction,
-} from '../../ast/types';
-
-export function useScopeOutputVariables(scopeFromParam?: Scope | Scope[]) {
-  const currentScope = useCurrentScope();
-  const variableEngine = useService(VariableEngine);
-
-  const [refreshKey, setRefreshKey] = useState(0);
-
-  const scopes = useMemo(
-    () => {
-      if (!scopeFromParam) {
-        return [currentScope];
-      }
-      if (Array.isArray(scopeFromParam)) {
-        return scopeFromParam;
-      }
-      return [scopeFromParam];
-    },
-    Array.isArray(scopeFromParam) ? scopeFromParam : [scopeFromParam]
-  );
-
-  useEffect(() => {
-    setRefreshKey((_key) => _key + 1);
-
-    const refreshWhenInScopes = useCallback((action: GlobalEventActionType) => {
-      if (scopes.includes(action.ast?.scope!)) {
-        setRefreshKey((_key) => _key + 1);
-      }
-    }, []);
-
-    const disposable = new DisposableCollection();
-
-    disposable.pushAll([
-      variableEngine.onGlobalEvent<DisposeASTAction>('DisposeAST', refreshWhenInScopes),
-      variableEngine.onGlobalEvent<NewASTAction>('NewAST', refreshWhenInScopes),
-      variableEngine.onGlobalEvent<UpdateASTAction>('UpdateAST', refreshWhenInScopes),
-    ]);
-
-    return () => disposable.dispose();
-  }, [scopes]);
-
-  const variables = useMemo(
-    () => scopes.map((scope) => scope.output.variables).flat(),
-    [scopes, refreshKey]
-  );
-
-  return variables;
-}

packages/variable-engine/variable-core/src/scope/variable-table.ts

@@ -14,6 +14,8 @@ import { IVariableTable } from './types';
 export class VariableTable implements IVariableTable {
   protected table: Map<string, VariableDeclaration> = new Map();
 
+  toDispose = new DisposableCollection();
+
   protected onDataChangeEmitter = new Emitter<void>();
 
   protected variables$: Subject<VariableDeclaration[]> = new Subject<VariableDeclaration[]>();
@@ -81,7 +83,13 @@ export class VariableTable implements IVariableTable {
 
   constructor(
     public parentTable?: IVariableTable // 父变量表，会包含所有子表的变量
-  ) {}
+  ) {
+    this.toDispose.pushAll([
+      this.onDataChangeEmitter,
+      // active share()
+      this.onAnyVariableChange(() => null),
+    ]);
+  }
 
   get variables(): VariableDeclaration[] {
     return Array.from(this.table.values());
@@ -146,6 +154,6 @@ export class VariableTable implements IVariableTable {
     this.parentTable?.fireChange();
     this.variables$.complete();
     this.variables$.unsubscribe();
-    this.onDataChangeEmitter.dispose();
+    this.toDispose.dispose();
   }
 }