fix: add worker message trigger

src/hooks/use-chunk-request.ts

@@ -61,7 +61,6 @@ const useSetChunkRequest = () => {
   const timer = useRef<any>(null);
   const loadedSize = useRef(0);
   const workerRef = useRef<any>(null);
-  const startLoadingRef = useRef(false);
 
   const reset = () => {
     loaded.current = 0;
@@ -170,7 +169,6 @@ const useSetChunkRequest = () => {
   const setChunkRequest = (config: RequestConfig) => {
     requestConfig.current = { ...particalConfig, ...config };
     retryCount.current = totalCount;
-    startLoadingRef.current = false;
     clearTimeout(timer.current);
     axiosChunkRequest(requestConfig.current);
     return axiosToken;
@@ -203,17 +201,11 @@ const useSetChunkRequest = () => {
         2 ** (totalCount - retryCount.current) * 1000
       );
     }
-    if (requestReadyState === 3) {
-      setTimeout(() => {
-        startLoadingRef.current = true;
-      }, 5000);
-    }
   }, [requestReadyState]);
 
   return {
     setChunkRequest,
-    createAxiosToken,
+    createAxiosToken
-    startLoadingRef
   };
 };
 

src/hooks/use-update-chunk-list.ts

@@ -14,6 +14,7 @@ type EventsType = 'CREATE' | 'UPDATE' | 'DELETE' | 'INSERT';
 export function useUpdateChunkedList(options: {
   events?: EventsType[];
   dataList?: any[];
+  triggerAt?: React.MutableRefObject<number>;
   limit?: number;
   onCreate?: (args: any) => void;
   onUpdate?: (args: any) => void;
@@ -24,7 +25,8 @@ export function useUpdateChunkedList(options: {
   mapFun?: (args: any) => any;
   computedID?: (d: object) => string;
 }) {
-  const { events = ['CREATE', 'DELETE', 'UPDATE', 'INSERT'] } = options;
+  const { events = ['CREATE', 'DELETE', 'UPDATE', 'INSERT'], triggerAt } =
+    options;
   const deletedIdsRef = useRef<Set<number | string>>(new Set());
   const cacheDataListRef = useRef<any[]>(options.dataList || []);
   const timerRef = useRef<any>(null);
@@ -63,6 +65,7 @@ export function useUpdateChunkedList(options: {
 
     // CREATE
     if (data?.type === WatchEventType.CREATE && events.includes('CREATE')) {
+      const latestCreateList: any[] = [];
       const newDataList = collections.reduce((acc: any[], item: any) => {
         const updateIndex = cacheDataListRef.current?.findIndex(
           (sItem: any) => sItem.id === item.id
@@ -73,6 +76,12 @@ export function useUpdateChunkedList(options: {
         } else {
           cacheDataListRef.current[updateIndex] = updateItem;
         }
+        if (
+          triggerAt?.current &&
+          Date.parse(item.created_at) >= triggerAt.current
+        ) {
+          latestCreateList.push(updateItem);
+        }
 
         return acc;
       }, []);
@@ -82,7 +91,7 @@ export function useUpdateChunkedList(options: {
         ...cacheDataListRef.current
       ].slice(0, limit);
 
-      options.onCreate?.(newDataList);
+      options.onCreate?.(latestCreateList);
     }
 
     // DELETE
@@ -112,7 +121,11 @@ export function useUpdateChunkedList(options: {
             updateItem,
             ...cacheDataListRef.current.slice(0, limit - 1)
           ];
-          options.onCreate?.([updateItem]);
+          if (options.onCreate && triggerAt?.current) {
+            if (Date.parse(item.created_at) >= triggerAt.current) {
+              options.onCreate?.([updateItem]);
+            }
+          }
         }
       });
     }

src/pages/backends/forms/versions-config.tsx

@@ -370,7 +370,7 @@ const VersionsForm: React.FC<AddModalProps> = ({
                         { id: 'common.help.eg' },
                         {
                           content:
-                            'vllm serve {{model_path}} --port {{port}} --host {{worker_ip}} --served-model-name {{model_name}}'
+                            '{{model_path}} --port {{port}} --host {{worker_ip}} --served-model-name {{model_name}}'
                         }
                       )}
                       label={intl.formatMessage({ id: 'backend.runCommand' })}

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

@@ -60,8 +60,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
     stepList = []
   } = props || {};
   const intl = useIntl();
-  const { addedCount, createModelsChunkRequest, chunkRequestRef } =
+  const { addedCount, createModelsChunkRequest, reset } = useAddWorkerMessage();
-    useAddWorkerMessage();
   const firstLoad = React.useRef(true);
   const axiosTokenRef = React.useRef<any>(null);
   const [registrationInfo, setRegistrationInfo] = React.useState<{
@@ -100,8 +99,8 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
     }
     return () => {
       firstLoad.current = true;
-      chunkRequestRef.current?.current?.cancel?.();
       axiosTokenRef.current?.cancel?.();
+      reset();
     };
   }, [open, cluster_id]);
 
@@ -109,7 +108,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
     if (open) {
       createModelsChunkRequest();
     } else {
-      chunkRequestRef.current?.current?.cancel?.();
+      reset();
       axiosTokenRef.current?.cancel?.();
     }
   }, [open]);

src/pages/cluster-management/hooks/use-add-worker-message.ts

@@ -9,6 +9,7 @@ export default function useAddWorkerMessage() {
   const newItemsRef = useRef<any[]>([]);
   const [addedCount, setAddedCount] = useState(0);
   const timerRef = useRef<any>(null);
+  const triggerAtRef = useRef<number>(0);
 
   const showAddWorkerMessage = () => {
     if (newItemsRef.current.length > 0) {
@@ -17,12 +18,13 @@ export default function useAddWorkerMessage() {
     }
   };
 
-  const { setChunkRequest, startLoadingRef } = useSetChunkRequest();
+  const { setChunkRequest } = useSetChunkRequest();
   const { updateChunkedList } = useUpdateChunkedList({
     events: ['CREATE', 'INSERT'],
     dataList: [],
+    triggerAt: triggerAtRef,
     onCreate: (newItems: any) => {
-      if (startLoadingRef.current) {
+      if (triggerAtRef.current) {
         newItemsRef.current = newItemsRef.current.concat(newItems);
         showAddWorkerMessage();
       }
@@ -37,18 +39,20 @@ export default function useAddWorkerMessage() {
 
   const resetAddedCount = () => {
     setAddedCount(0);
+    chunkRequestRef.current?.current?.cancel?.();
     newItemsRef.current = [];
+    triggerAtRef.current = 0;
     clearTimeout(timerRef.current);
   };
 
   const createModelsChunkRequest = async () => {
-    chunkRequestRef.current?.current?.cancel?.();
     resetAddedCount();
     try {
       chunkRequestRef.current = setChunkRequest({
         url: WORKERS_API,
         handler: updateHandler
       });
+      triggerAtRef.current = Date.now();
     } catch (error) {
       // ignore
     }
@@ -56,15 +60,14 @@ export default function useAddWorkerMessage() {
 
   useEffect(() => {
     return () => {
-      chunkRequestRef.current?.current?.cancel?.();
+      resetAddedCount();
-      newItemsRef.current = [];
-      clearTimeout(timerRef.current);
     };
   }, []);
 
   return {
     addedCount,
     chunkRequestRef,
+    reset: resetAddedCount,
     createModelsChunkRequest
   };
 }