fix: Retry on error should show success data (#406)

src/hooks/useQueryLogs.ts

@@ -1,13 +1,11 @@
-import { SortOrder, type Log, type LogsData, type LogsSearch } from '@/@types/parseable/api/query';
+import { type Log } from '@/@types/parseable/api/query';
 import { getQueryLogsWithHeaders, getQueryResultWithHeaders } from '@/api/query';
 import { StatusCodes } from 'http-status-codes';
-import useMountedState from './useMountedState';
 import { useQuery } from 'react-query';
 import { useCallback, useRef } from 'react';
 import { useLogsStore, logsStoreReducers, LOAD_LIMIT, isJqSearch } from '@/pages/Stream/providers/LogsProvider';
 import { useAppStore } from '@/layouts/MainLayout/providers/AppProvider';
 import _ from 'lodash';
-import { AxiosError } from 'axios';
 import jqSearch from '@/utils/jqSearch';
 import { useGetStreamSchema } from '@/hooks/useGetLogStreamSchema';
 import { useStreamStore } from '@/pages/Stream/providers/StreamProvider';
@@ -33,16 +31,7 @@ export const useQueryLogs = () => {
 	// data ref will always have the unfiltered data.
 	// Only mutate it when data is fetched, otherwise read only
 	const _dataRef = useRef<Log[] | null>(null);
-	const [error, setError] = useMountedState<string | null>(null);
-	const [pageLogData, setPageLogData] = useMountedState<LogsData | null>(null);
-	const [querySearch, setQuerySearch] = useMountedState<LogsSearch>({
-		search: '',
-		filters: {},
-		sort: {
-			key: 'p_timestamp',
-			order: SortOrder.DESCENDING,
-		},
-	});
+	const [queryEngine] = useAppStore((store) => store.instanceConfig?.queryEngine);
 	const [streamInfo] = useStreamStore((store) => store.info);
 	const [currentStream] = useAppStore((store) => store.currentStream);
 	const timePartitionColumn = _.get(streamInfo, 'time_partition', 'p_timestamp');
@@ -92,6 +81,7 @@ export const useQueryLogs = () => {
 	const {
 		isLoading: logsLoading,
 		isRefetching: logsRefetching,
+		error: queryLogsError,
 		refetch: getQueryData,
 	} = useQuery(
 		['fetch-logs', defaultQueryOpts],
@@ -123,33 +113,19 @@ export const useQueryLogs = () => {
 			onSuccess: async (data) => {
 				const logs = data.data;
 				const isInvalidResponse = _.isEmpty(logs) || _.isNil(logs) || data.status !== StatusCodes.OK;
-				if (isInvalidResponse) return setError('Failed to query logs');
+				if (isInvalidResponse) return;
 
 				const { records, fields } = logs;
 				const jqFilteredData = isJqSearch(instantSearchValue) ? await jqSearch(records, instantSearchValue) : [];
 				setLogsStore((store) => setLogData(store, records, fields, jqFilteredData));
 			},
-			onError: (data: AxiosError) => {
-				const errorMessage = data.response?.data as string;
-				setError(_.isString(errorMessage) && !_.isEmpty(errorMessage) ? errorMessage : 'Failed to query logs');
-			},
 		},
 	);
 
-	const resetData = () => {
-		_dataRef.current = null;
-		setPageLogData(null);
-		setError(null);
-	};
-
 	return {
-		pageLogData,
-		setQuerySearch,
 		getColumnFilters,
-		sort: querySearch.sort,
-		error,
+		queryLogsError,
 		loading: logsLoading || logsRefetching,
 		getQueryData,
-		resetData,
 	};
 };

src/pages/Stream/Views/Explore/JSONView.tsx

@@ -18,6 +18,7 @@ import { IconCheck, IconCopy, IconSearch } from '@tabler/icons-react';
 import { copyTextToClipboard } from '@/utils';
 import { useStreamStore } from '../../providers/StreamProvider';
 import timeRangeUtils from '@/utils/timeRangeUtils';
+import { AxiosError } from 'axios';
 
 const { setInstantSearchValue, applyInstantSearch, applyJqSearch } = logsStoreReducers;
 
@@ -187,7 +188,7 @@ const TableContainer = (props: { children: ReactNode }) => {
 };
 
 const JsonView = (props: {
-	errorMessage: string | null;
+	errorMessage: AxiosError;
 	hasNoData: boolean;
 	showTable: boolean;
 	isFetchingCount: boolean;
@@ -224,7 +225,7 @@ const JsonView = (props: {
 					<LoadingView />
 				)
 			) : (
-				<ErrorView message={errorMessage} />
+				<ErrorView message={(errorMessage?.response?.data as string) || 'Failed to query logs'} />
 			)}
 			<Footer loaded={showTable} hasNoData={hasNoData} isFetchingCount={isFetchingCount} />
 		</TableContainer>

src/pages/Stream/Views/Explore/LogsView.tsx

@@ -8,14 +8,15 @@ import { useFilterStore, filterStoreReducers } from '../../providers/FilterProvi
 
 import { useEffect } from 'react';
 import _ from 'lodash';
+import { AxiosError } from 'axios';
 
 const { setPageAndPageData, setTargetPage, setTargetColumns, setDisabledColumns } = logsStoreReducers;
 const { toogleQueryParamsFlag } = filterStoreReducers;
 
 const LogsView = (props: { schemaLoading: boolean; infoLoading: boolean }) => {
 	const [, setFilterStore] = useFilterStore((store) => store);
 	const { schemaLoading, infoLoading } = props;
-	const { errorMessage, hasNoData, showTable, isFetchingCount, logsLoading } = useLogsFetcher({
+	const { hasNoData, showTable, isFetchingCount, logsLoading, queryLogsError } = useLogsFetcher({
 		schemaLoading,
 		infoLoading,
 	});
@@ -24,7 +25,7 @@ const LogsView = (props: { schemaLoading: boolean; infoLoading: boolean }) => {
 	const { currentPage, targetPage, headers, targetColumns } = tableOpts;
 	const [viewMode, setLogsStore] = useLogsStore((store) => store.viewMode);
 	const viewOpts = {
-		errorMessage,
+		errorMessage: queryLogsError as AxiosError,
 		hasNoData,
 		showTable,
 		isFetchingCount,

src/pages/Stream/Views/Explore/StaticLogTable.tsx

@@ -24,6 +24,7 @@ import timeRangeUtils from '@/utils/timeRangeUtils';
 import { IconDotsVertical } from '@tabler/icons-react';
 import { copyTextToClipboard } from '@/utils';
 import { notifySuccess } from '@/utils/notification';
+import { AxiosError } from 'axios';
 
 const { setSelectedLog, setRowNumber } = logsStoreReducers;
 const TableContainer = (props: { children: ReactNode }) => {
@@ -362,7 +363,7 @@ const Table = (props: { primaryHeaderHeight: number }) => {
 };
 
 const LogTable = (props: {
-	errorMessage: string | null;
+	errorMessage: AxiosError;
 	hasNoData: boolean;
 	showTable: boolean;
 	isFetchingCount: boolean;
@@ -413,7 +414,7 @@ const LogTable = (props: {
 					<LoadingView />
 				)
 			) : (
-				<ErrorView message={errorMessage} />
+				<ErrorView message={(errorMessage?.response?.data as string) || 'Failed to query logs'} />
 			)}
 			<Footer loaded={showTable} hasNoData={hasNoData} isFetchingCount={isFetchingCount} />
 		</TableContainer>

src/pages/Stream/Views/Explore/useLogsFetcher.ts

@@ -4,6 +4,7 @@ import { useLogsStore, logsStoreReducers } from '../../providers/LogsProvider';
 import { useQueryLogs } from '@/hooks/useQueryLogs';
 import { useFetchCount } from '@/hooks/useQueryResult';
 import { useStreamStore } from '../../providers/StreamProvider';
+import _ from 'lodash';
 
 const { setCleanStoreForStreamChange } = logsStoreReducers;
 const { syncTimeRange } = appStoreReducers;
@@ -14,14 +15,14 @@ const useLogsFetcher = (props: { schemaLoading: boolean; infoLoading: boolean })
 	const [{ timeRange }, setAppStore] = useAppStore((store) => store);
 	const [{ tableOpts }, setLogsStore] = useLogsStore((store) => store);
 	const { currentOffset, currentPage, pageData } = tableOpts;
-	const { getQueryData, loading: logsLoading, error: errorMessage } = useQueryLogs();
+	const { getQueryData, loading: logsLoading, queryLogsError } = useQueryLogs();
 	const [{ info }] = useStreamStore((store) => store);
 	const firstEventAt = 'first-event-at' in info ? info['first-event-at'] : undefined;
 
 	const { refetchCount, isCountLoading, isCountRefetching } = useFetchCount();
 	const hasContentLoaded = schemaLoading === false && logsLoading === false;
-	const hasNoData = hasContentLoaded && !errorMessage && pageData.length === 0;
-	const showTable = hasContentLoaded && !hasNoData && !errorMessage;
+	const hasNoData = hasContentLoaded && !queryLogsError && pageData.length === 0;
+	const showTable = hasContentLoaded && !hasNoData && !queryLogsError;
 
 	useEffect(() => {
 		setAppStore(syncTimeRange);
@@ -47,7 +48,7 @@ const useLogsFetcher = (props: { schemaLoading: boolean; infoLoading: boolean })
 
 	return {
 		logsLoading: infoLoading || logsLoading,
-		errorMessage,
+		queryLogsError,
 		hasContentLoaded,
 		hasNoData,
 		showTable,