fix index attempt refreshing automatically (#2791)

Co-authored-by: Richard Kuo <rkuo@rkuo.com>

web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx

@@ -145,7 +145,7 @@ export function IndexingAttemptsTable({ ccPair }: { ccPair: CCPairFullInfo }) {
     if (!cachedBatches[0]) {
       fetchBatchData(0);
     }
-  }, [ccPair.id, page, cachedBatches, totalPages]);
+  }, [ccPair.id, page, cachedBatches, totalPages, fetchBatchData]);
 
   // This updates the data on the current page
   useEffect(() => {
@@ -160,6 +160,15 @@ export function IndexingAttemptsTable({ ccPair }: { ccPair: CCPairFullInfo }) {
     }
   }, [page, cachedBatches]);
 
+  useEffect(() => {
+    const interval = setInterval(() => {
+      const batchNum = Math.floor((page - 1) / BATCH_SIZE);
+      fetchBatchData(batchNum); // Re-fetch the current batch data
+    }, 5000); // Refresh every 5 seconds
+
+    return () => clearInterval(interval); // Cleanup on unmount
+  }, [page, fetchBatchData]); // Dependencies to ensure correct batch is fetched
+
   // This updates the page number and manages the URL
   const updatePage = (newPage: number) => {
     setPage(newPage);

web/src/app/admin/connector/[ccPairId]/page.tsx

@@ -74,7 +74,7 @@ function Main({ ccPairId }: { ccPairId: number }) {
     ) {
       finishConnectorDeletion();
     }
-  }, [isLoading, ccPair, error, hasLoadedOnce]);
+  }, [isLoading, ccPair, error, hasLoadedOnce, finishConnectorDeletion]);
 
   const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setEditableName(e.target.value);