fix: duplicate watch created

src/pages/cluster-management/components/add-worker/add-worker-step.tsx

@@ -74,7 +74,6 @@ const AddWorkerSteps: React.FC<AddWorkerProps> = (props) => {
 
   const handleOnClusterChange = (value: number, row?: any) => {
     onClusterChange?.(value, row);
-    createModelsChunkRequest({ cluster_id: value });
   };
 
   React.useEffect(() => {
@@ -83,11 +82,13 @@ const AddWorkerSteps: React.FC<AddWorkerProps> = (props) => {
   }, [stepList]);
 
   React.useEffect(() => {
-    // this effect is only triggered when used in cluster create page
-    if (actionSource === 'page') {
-      createModelsChunkRequest();
+    // this effect is only triggered when used in cluster create page inner
+    if (actionSource === 'page' && registrationInfo?.cluster_id) {
+      createModelsChunkRequest({
+        cluster_id: registrationInfo?.cluster_id
+      });
     }
-  }, [actionSource]);
+  }, [actionSource, registrationInfo?.cluster_id]);
 
   const renderMessage = (count: number) => {
     if (count === 1) {

src/pages/cluster-management/components/add-worker/index.tsx

@@ -77,6 +77,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
 
   const handleOnClusterChange = async (value: number, row?: any) => {
     try {
+      createModelsChunkRequest({ cluster_id: value });
       axiosTokenRef.current?.cancel?.();
       axiosTokenRef.current = createAxiosToken();
       const data = await queryClusterToken(
@@ -97,21 +98,12 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
     if (open && cluster_id && firstLoad.current) {
       handleOnClusterChange(cluster_id);
     }
-    return () => {
+    if (!open) {
+      reset();
+      axiosTokenRef.current?.cancel?.();
       firstLoad.current = true;
-      axiosTokenRef.current?.cancel?.();
-      reset();
-    };
-  }, [open, cluster_id]);
-
-  useEffect(() => {
-    if (open) {
-      createModelsChunkRequest();
-    } else {
-      reset();
-      axiosTokenRef.current?.cancel?.();
     }
-  }, [open]);
+  }, [open, cluster_id]);
 
   const renderMessage = (count: number) => {
     if (count === 1) {