Merge pull request #1009 from fudiwei/main

ui/eslint.config.mjs

@@ -120,8 +120,14 @@ export default defineConfig(
   // React
   {
     name: "react",
-    extends: [reactHooksPlugin.configs.flat["recommended"], reactRefreshPlugin.configs["vite"]],
+    extends: [reactHooksPlugin.configs.flat["recommended-latest"], reactRefreshPlugin.configs["vite"]],
     rules: {
+      "react-hooks/exhaustive-deps": ["warn"],
+      "react-hooks/immutability": ["warn"],
+      "react-hooks/refs": ["warn"],
+      "react-hooks/preserve-manual-memoization": ["warn"],
+      "react-hooks/set-state-in-effect": ["warn"],
+      "react-hooks/set-state-in-render": ["warn"],
       "react-refresh/only-export-components": [
         "warn",
         {

ui/src/components/access/AccessEditDrawer.tsx

@@ -4,11 +4,11 @@ import { IconX } from "@tabler/icons-react";
 import { useControllableValue, useGetState } from "ahooks";
 import { App, Button, Drawer, Flex, Form } from "antd";
 
+import { notifyTest } from "@/api/notify";
 import AccessProviderPicker from "@/components/provider/AccessProviderPicker";
 import Show from "@/components/Show";
 import { type AccessModel } from "@/domain/access";
 import { ACCESS_USAGES } from "@/domain/provider";
-import { notifyTest } from "@/api/notify";
 import { useTriggerElement, useZustandShallowSelector } from "@/hooks";
 import { useAccessesStore } from "@/stores/access";
 import { getErrMsg } from "@/utils/error";
@@ -126,7 +126,7 @@ const AccessEditDrawer = ({ afterSubmit, mode, data, loading, trigger, usage, ..
     }
 
     try {
-      await notifyTest({ provider: fieldProvider, accessId: data?.id! });
+      await notifyTest({ provider: fieldProvider, accessId: data!.id });
       message.success(t("common.text.operation_succeeded"));
     } catch (err) {
       notification.error({ message: t("common.text.request_error"), description: getErrMsg(err) });

ui/src/components/provider/_shared.ts

@@ -19,7 +19,7 @@ export interface SharedSelectProps<T extends Provider>
 export const useSelectDataSource = <T extends Provider>({
   dataSource,
   filters,
-  deps,
+  deps = [],
 }: {
   dataSource: T[];
   filters?: Array<(value: string, option: T) => boolean>;
@@ -39,7 +39,7 @@ export const useSelectDataSource = <T extends Provider>({
 
       return true;
     });
-  }, [dataSource, filters, ...(deps ?? [])]);
+  }, [dataSource, filters, deps]);
 
   const availableDataSource = useMemo(() => {
     return filteredDataSource.filter((provider) => {
@@ -49,11 +49,11 @@ export const useSelectDataSource = <T extends Provider>({
         return access.provider === provider.type;
       });
     });
-  }, [accesses, filteredDataSource, ...(deps ?? [])]);
+  }, [accesses, filteredDataSource, deps]);
 
   const unavailableDataSource = useMemo(() => {
     return filteredDataSource.filter((item) => !availableDataSource.includes(item));
-  }, [filteredDataSource, availableDataSource, ...(deps ?? [])]);
+  }, [filteredDataSource, availableDataSource, deps]);
 
   return {
     raw: dataSource,
@@ -94,7 +94,7 @@ export const usePickerDataSource = <T extends Provider>({
   dataSource,
   filters,
   keyword,
-  deps,
+  deps = [],
 }: {
   dataSource: T[];
   filters?: Array<(value: string, option: T) => boolean>;
@@ -126,7 +126,7 @@ export const usePickerDataSource = <T extends Provider>({
 
         return true;
       });
-  }, [dataSource, filters, keyword, ...(deps ?? [])]);
+  }, [dataSource, filters, keyword, deps]);
 
   const availableDataSource = useMemo(() => {
     return filteredDataSource.filter((provider) => {
@@ -136,11 +136,11 @@ export const usePickerDataSource = <T extends Provider>({
         return access.provider === provider.type;
       });
     });
-  }, [accesses, filteredDataSource, ...(deps ?? [])]);
+  }, [accesses, filteredDataSource, deps]);
 
   const unavailableDataSource = useMemo(() => {
     return filteredDataSource.filter((item) => !availableDataSource.includes(item));
-  }, [filteredDataSource, availableDataSource, ...(deps ?? [])]);
+  }, [filteredDataSource, availableDataSource, deps]);
 
   return {
     raw: dataSource,

ui/src/components/workflow/designer/Designer.tsx

@@ -4,10 +4,10 @@ import {
   EditorRenderer,
   EditorState,
   FixedLayoutEditorProvider,
-  FlowLayoutDefault,
   type FixedLayoutPluginContext,
   type FixedLayoutProps,
   type FlowDocumentJSON,
+  FlowLayoutDefault,
   type FlowNodeEntity,
   FlowTextKey,
 } from "@flowgram.ai/fixed-layout-editor";

ui/src/components/workflow/designer/forms/BizDeployNodeConfigFieldsProviderTencentCloudEO.tsx

@@ -93,10 +93,7 @@ const getSchema = ({ i18n = getI18n() }: { i18n?: ReturnType<typeof getI18n> })
   return z.object({
     endpoint: z.string().nullish(),
     zoneId: z.string().nonempty(t("workflow_node.deploy.form.tencentcloud_eo_zone_id.placeholder")),
-    matchPattern: z.enum(
-      [MATCH_PATTERN_EXACT, MATCH_PATTERN_WILDCARD],
-      t("workflow_node.deploy.form.shared_domain_match_pattern.placeholder")
-    ),
+    matchPattern: z.enum([MATCH_PATTERN_EXACT, MATCH_PATTERN_WILDCARD], t("workflow_node.deploy.form.shared_domain_match_pattern.placeholder")),
     domains: z.string().refine((v) => {
       if (!v) return false;
       return String(v)

ui/src/pages/accesses/AccessList.tsx

@@ -302,7 +302,7 @@ const AccessList = () => {
         return draft;
       });
     getAccess(access.id).then((data) => {
-      createDrawer.open({ data: copier(data), loading: true });
+      createDrawer.open({ data: copier(data) });
     });
   };
 

ui/src/pages/workflows/WorkflowDetailDesign.tsx

@@ -29,7 +29,7 @@ const WorkflowDetailDesign = () => {
 
   const designerRef = useRef<WorkflowDesignerInstance>(null);
   const designerPending = useRef(false); // 保存中时阻止刷新画布
-  const [designerError, setDesignerError] = useState<any>();
+  const [designerError, setDesignerError] = useState<unknown>();
   useDeepCompareEffect(() => {
     if (designerRef.current == null || designerRef.current.document.disposed) return;
     if (designerPending.current) return;
@@ -212,7 +212,7 @@ const WorkflowDetailDesign = () => {
             </div>
           </div>
 
-          {designerError && (
+          {!!designerError && (
             <div className="absolute top-1/2 left-1/2 z-10 w-full -translate-1/2 px-4">
               <Result status="warning" title="Data corruption!" subTitle={`Error: ${getErrMsg(designerError)}`} />
             </div>