feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/workflow/variable/src/hooks/index.tsx

@@ -0,0 +1,26 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+export { useVariableDispose } from './use-variable-dispose';
+export { useVariableTypeChange } from './use-variable-type-change';
+export { useVariableChange } from './use-variable-change';
+export { useVariableRename } from './use-variable-rename';
+export { useAvailableWorkflowVariables } from './use-available-workflow-variables';
+export { useAutoSyncRenameData } from './use-auto-sync-rename-data';
+export { useWorkflowVariableByKeyPath } from './use-workflow-variable-by-keypath';
+export { useVariableType } from './use-variable-type';
+export { useGetWorkflowVariableByKeyPath } from './use-get-workflow-variable-by-keypath';
+export { useGlobalVariableServiceState } from './use-global-variable-service-state';

frontend/packages/workflow/variable/src/hooks/use-auto-sync-rename-data.tsx

@@ -0,0 +1,53 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+import { useEffect, useRef } from 'react';
+
+import { VariableFieldKeyRenameService } from '@flowgram-adapter/free-layout-editor';
+import { useService } from '@flowgram-adapter/free-layout-editor';
+
+import { traverseUpdateRefExpressionByRename } from '../core/utils/traverse-refs';
+
+export function useAutoSyncRenameData(
+  data: any,
+  ctx: {
+    onDataRenamed?: (_newData?: any) => void;
+  } = {},
+) {
+  const { onDataRenamed } = ctx || {};
+  const fieldRenameService: VariableFieldKeyRenameService = useService(
+    VariableFieldKeyRenameService,
+  );
+
+  const latest = useRef(data);
+  latest.current = data;
+
+  useEffect(() => {
+    const disposable = fieldRenameService.onRename(({ before, after }) => {
+      traverseUpdateRefExpressionByRename(
+        latest.current,
+        { before, after },
+        {
+          onDataRenamed,
+        },
+      );
+    });
+
+    return () => disposable.dispose();
+  }, []);
+}

frontend/packages/workflow/variable/src/hooks/use-available-workflow-variables.tsx

@@ -0,0 +1,54 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect, startTransition } from 'react';
+
+import {
+  ASTKind,
+  type ObjectType,
+  useCurrentScope,
+} from '@flowgram-adapter/free-layout-editor';
+import { useRefresh, useService } from '@flowgram-adapter/free-layout-editor';
+
+import { WorkflowVariableFacadeService, type WorkflowVariable } from '../core';
+
+export function useAvailableWorkflowVariables(): WorkflowVariable[] {
+  const scope = useCurrentScope();
+  const facadeService: WorkflowVariableFacadeService = useService(
+    WorkflowVariableFacadeService,
+  );
+  const refresh = useRefresh();
+
+  useEffect(() => {
+    const disposable = scope.available.onDataChange(() => {
+      startTransition(() => refresh());
+    });
+
+    return () => disposable.dispose();
+  }, []);
+
+  return scope.available.variables
+    .map(_variable => {
+      // 第一层为变量，因此需要分层处理
+      if (_variable.type.kind === ASTKind.Object) {
+        return ((_variable.type as ObjectType)?.properties || []).map(
+          _property => facadeService.getVariableFacadeByField(_property),
+        );
+      }
+      return [];
+    })
+    .flat();
+}

frontend/packages/workflow/variable/src/hooks/use-get-workflow-variable-by-keypath.tsx

@@ -0,0 +1,37 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useCallback } from 'react';
+
+import {
+  useCurrentEntity,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+
+import { WorkflowVariableFacadeService } from '../core';
+
+export function useGetWorkflowVariableByKeyPath() {
+  const node = useCurrentEntity();
+  const facadeService: WorkflowVariableFacadeService = useService(
+    WorkflowVariableFacadeService,
+  );
+
+  return useCallback(
+    (keyPath: string[]) =>
+      facadeService.getVariableFacadeByKeyPath(keyPath, { node }),
+    [node],
+  );
+}

frontend/packages/workflow/variable/src/hooks/use-global-variable-service-state.tsx

@@ -0,0 +1,67 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect, useMemo } from 'react';
+
+import { useRefresh, useService } from '@flowgram-adapter/free-layout-editor';
+import { DisposableCollection } from '@flowgram-adapter/common';
+
+import {
+  GlobalVariableService,
+  type State as GlobalVariableServiceState,
+} from '../services/global-variable-service';
+
+interface Params {
+  // 是否监听变量加载完成事件（变量下钻可能发生变化）
+  listenVariableLoaded?: boolean;
+}
+
+export function useGlobalVariableServiceState(
+  params: Params = {},
+): GlobalVariableServiceState {
+  const { listenVariableLoaded } = params;
+
+  const globalVariableService = useService<GlobalVariableService>(
+    GlobalVariableService,
+  );
+
+  const refresh = useRefresh();
+
+  useEffect(() => {
+    const toDispose = new DisposableCollection();
+
+    toDispose.push(
+      globalVariableService.onBeforeLoad(() => {
+        refresh();
+      }),
+    );
+
+    if (listenVariableLoaded) {
+      toDispose.push(
+        globalVariableService.onLoaded(() => {
+          refresh();
+        }),
+      );
+    }
+
+    return () => toDispose.dispose();
+  }, []);
+
+  return useMemo(
+    () => globalVariableService.state,
+    [globalVariableService.state],
+  );
+}

frontend/packages/workflow/variable/src/hooks/use-variable-change.tsx

@@ -0,0 +1,57 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect } from 'react';
+
+import {
+  useCurrentEntity,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+import { type ViewVariableMeta } from '@coze-workflow/base';
+
+import { WorkflowVariableService } from '../legacy';
+
+interface HooksParams {
+  keyPath?: string[];
+  onChange?: (params: { variableMeta?: ViewVariableMeta | null }) => void;
+}
+
+export function useVariableChange(params: HooksParams) {
+  const { keyPath, onChange } = params;
+
+  const node = useCurrentEntity();
+  const variableService: WorkflowVariableService = useService(
+    WorkflowVariableService,
+  );
+
+  useEffect(() => {
+    if (!keyPath) {
+      return () => null;
+    }
+
+    const disposable = variableService.onListenVariableChange(
+      keyPath,
+      meta => {
+        onChange?.({ variableMeta: meta });
+      },
+      { node },
+    );
+
+    return () => disposable.dispose();
+  }, [keyPath?.join('.')]);
+
+  return;
+}

frontend/packages/workflow/variable/src/hooks/use-variable-dispose.tsx

@@ -0,0 +1,60 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect } from 'react';
+
+import {
+  useCurrentEntity,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+
+import { WorkflowVariableService } from '../legacy';
+
+interface HooksParams {
+  keyPath?: string[];
+  onDispose?: () => void;
+}
+
+/**
+ * @deprecated 变量销毁存在部分 Bad Case
+ * - 全局变量因切换 Project 销毁后，变量引用会被置空，导致变量引用失效
+ */
+export function useVariableDispose(params: HooksParams) {
+  const { keyPath, onDispose } = params;
+
+  const node = useCurrentEntity();
+  const variableService: WorkflowVariableService = useService(
+    WorkflowVariableService,
+  );
+
+  useEffect(() => {
+    if (!keyPath) {
+      return () => null;
+    }
+
+    const disposable = variableService.onListenVariableDispose(
+      keyPath,
+      () => {
+        onDispose?.();
+      },
+      { node },
+    );
+
+    return () => disposable.dispose();
+  }, [keyPath?.join('.')]);
+
+  return;
+}

frontend/packages/workflow/variable/src/hooks/use-variable-rename.tsx

@@ -0,0 +1,52 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect } from 'react';
+
+import { useService } from '@flowgram-adapter/free-layout-editor';
+import { useCurrentEntity } from '@flowgram-adapter/free-layout-editor';
+
+import { type RenameInfo } from '../core/types';
+import { WorkflowVariableFacadeService } from '../core';
+
+interface HooksParams {
+  keyPath?: string[];
+  onRename?: (params: RenameInfo) => void;
+}
+
+export function useVariableRename({ keyPath, onRename }: HooksParams) {
+  const node = useCurrentEntity();
+  const facadeService: WorkflowVariableFacadeService = useService(
+    WorkflowVariableFacadeService,
+  );
+
+  useEffect(() => {
+    if (!keyPath) {
+      return;
+    }
+
+    const variable = facadeService.getVariableFacadeByKeyPath(keyPath, {
+      node,
+    });
+    const disposable = variable?.onRename(_params => {
+      onRename?.(_params);
+    });
+
+    return () => disposable?.dispose();
+  }, [keyPath?.join('.')]);
+
+  return;
+}

frontend/packages/workflow/variable/src/hooks/use-variable-type-change.tsx

@@ -0,0 +1,86 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+/* eslint-disable security/detect-object-injection */
+import { useEffect, useRef } from 'react';
+
+import {
+  useCurrentEntity,
+  useRefresh,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+import { DisposableCollection } from '@flowgram-adapter/common';
+import { type ViewVariableMeta } from '@coze-workflow/base';
+
+import { WorkflowVariableFacadeService } from '../core';
+
+type TypeChange = (params: { variableMeta?: ViewVariableMeta | null }) => void;
+
+interface HooksParams {
+  keyPath?: string[];
+  onTypeChange?: TypeChange;
+}
+
+export function useVariableTypeChange(params: HooksParams) {
+  const { keyPath, onTypeChange } = params;
+
+  const node = useCurrentEntity();
+
+  const keyPathRef = useRef<string[] | undefined>([]);
+  keyPathRef.current = keyPath;
+
+  const refresh = useRefresh();
+  const facadeService: WorkflowVariableFacadeService = useService(
+    WorkflowVariableFacadeService,
+  );
+
+  const callbackRef = useRef<TypeChange | undefined>();
+  callbackRef.current = onTypeChange;
+
+  useEffect(() => {
+    if (!keyPath) {
+      return () => null;
+    }
+
+    const toDispose = new DisposableCollection();
+
+    const variable = facadeService.getVariableFacadeByKeyPath(keyPath, {
+      node,
+    });
+
+    toDispose.push(
+      facadeService.listenKeyPathTypeChange(keyPath, meta => {
+        callbackRef.current?.({ variableMeta: meta });
+      }),
+    );
+
+    if (variable) {
+      toDispose.push(
+        variable.onRename(({ modifyIndex, modifyKey }) => {
+          if (keyPathRef.current) {
+            // 更改 keyPath 并刷新，重新监听变量变化
+            keyPathRef.current[modifyIndex] = modifyKey;
+          }
+          refresh();
+        }),
+      );
+    }
+
+    return () => toDispose.dispose();
+  }, [keyPathRef.current?.join('.')]);
+
+  return;
+}

frontend/packages/workflow/variable/src/hooks/use-variable-type.tsx

@@ -0,0 +1,53 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useState } from 'react';
+
+import {
+  useCurrentEntity,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+import { type ViewVariableType } from '@coze-workflow/base/types';
+
+import { WorkflowVariableService } from '../legacy';
+import { useVariableTypeChange } from './use-variable-type-change';
+
+export const useVariableType = (
+  keyPath: string[],
+): ViewVariableType | undefined => {
+  const node = useCurrentEntity();
+
+  const variableService: WorkflowVariableService = useService(
+    WorkflowVariableService,
+  );
+
+  const originType = variableService.getWorkflowVariableByKeyPath(keyPath, {
+    node,
+  })?.viewType;
+
+  const [variableType, setVariableType] = useState<
+    ViewVariableType | undefined
+  >(originType);
+
+  useVariableTypeChange({
+    keyPath,
+    onTypeChange: ({ variableMeta }) => {
+      setVariableType(variableMeta?.type);
+    },
+  });
+
+  return variableType;
+};

frontend/packages/workflow/variable/src/hooks/use-workflow-variable-by-keypath.tsx

@@ -0,0 +1,34 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import {
+  useCurrentEntity,
+  useService,
+} from '@flowgram-adapter/free-layout-editor';
+
+import { WorkflowVariableFacadeService } from '../core';
+
+export function useWorkflowVariableByKeyPath(keyPath?: string[]) {
+  const node = useCurrentEntity();
+  const facadeService: WorkflowVariableFacadeService = useService(
+    WorkflowVariableFacadeService,
+  );
+
+  return facadeService.getVariableFacadeByKeyPath(keyPath, {
+    node,
+    checkScope: true,
+  });
+}