From 285fdbb194fc75d203ae44983f743864ae995d43 Mon Sep 17 00:00:00 2001 From: edendattox Date: Wed, 3 Jan 2024 20:01:26 +0530 Subject: [PATCH] check call is aborted --- src/hooks/useDoGetLiveTail.tsx | 29 ++++++++++++++++++----------- src/pages/LiveTail/LogTable.tsx | 1 - 2 files changed, 18 insertions(+), 12 deletions(-) diff --git a/src/hooks/useDoGetLiveTail.tsx b/src/hooks/useDoGetLiveTail.tsx index f4d0b65e..075cc6b7 100644 --- a/src/hooks/useDoGetLiveTail.tsx +++ b/src/hooks/useDoGetLiveTail.tsx @@ -2,12 +2,10 @@ import { FetchTransport, createChannel, createClient } from 'nice-grpc-web'; import { AsyncRecordBatchStreamReader } from '@apache-arrow/ts'; import { FlightServiceDefinition, FlightData } from '@/assets/arrow'; import useMountedState from './useMountedState'; -import { useEffect } from 'react'; +import { useEffect, useRef } from 'react'; import { useHeaderContext } from '@/layouts/MainLayout/Context'; import { LogStreamData } from '@/@types/parseable/api/stream'; -let abortController = new AbortController(); - const TOTAL_LOGS_TO_SHOW = 500; function flightDataToUint8Array(data: FlightData): Uint8Array { @@ -40,6 +38,8 @@ export const useDoGetLiveTail = () => { const [field, setField] = useMountedState(''); const [search, setSearch] = useMountedState(''); + const abortControllerRef = useRef(new AbortController()); + // Handles initiating the live tail stream const livetail = (currentStreamName: string, grpcPort: number | null, abortController: AbortController) => { if (!currentStreamName || !grpcPort) return; @@ -69,7 +69,12 @@ export const useDoGetLiveTail = () => { setLoading(true); } - await new Promise((resolve) => setTimeout(resolve, 800)); + await new Promise((resolve) => setTimeout(resolve, 600)); + + if (abortController.signal.aborted) { + break; + } + if (data.length > TOTAL_LOGS_TO_SHOW) { data.pop(); } @@ -84,23 +89,21 @@ export const useDoGetLiveTail = () => { } finally { setLoading(false); } - setLoading(false); })(); }; // Starts the live tail const doGetLiveTail = (streamName: string, grpcPort: number | null) => { - // Abort the previous stream before starting a new one - if (abortController) { - abortController.abort(); + if (abortControllerRef.current) { + abortControllerRef.current.abort(); } - abortController = new AbortController(); - livetail(streamName, grpcPort, abortController); + abortControllerRef.current = new AbortController(); + livetail(streamName, grpcPort, abortControllerRef.current); }; const abort = () => { - abortController.abort(); + abortControllerRef.current.abort(); }; const resetData = () => setData([]); @@ -134,6 +137,10 @@ export const useDoGetLiveTail = () => { state.liveTailSearchValue = ''; state.liveTailSearchField = ''; }); + + return () => { + abortControllerRef.current.abort(); + }; }, []); return { finalData, error, loading, doGetLiveTail, resetData, abort, schema }; diff --git a/src/pages/LiveTail/LogTable.tsx b/src/pages/LiveTail/LogTable.tsx index bc9e5aab..6b77fadf 100644 --- a/src/pages/LiveTail/LogTable.tsx +++ b/src/pages/LiveTail/LogTable.tsx @@ -72,7 +72,6 @@ const LogTable: FC = () => { subLiveTailsData.set((state) => { state.liveTailStatus = 'stopped'; }); - // subLiveTailsData.set('stopped'); setCallAgain(false); } }, [loading]);