fix: dont reask trace for query if it fetched

Author: astandrik

src/containers/Tenant/Query/ExecuteResult/ExecuteResult.tsx

@@ -270,7 +270,9 @@ export function ExecuteResult({
                             <CancelQueryButton queryId={queryId} tenantName={tenantName} />
                         </React.Fragment>
                     ) : null}
-                    {data?.traceId ? <TraceButton traceId={data.traceId} /> : null}
+                    {data?.traceId ? (
+                        <TraceButton traceId={data.traceId} isTraceReady={result.isTraceReady} />
+                    ) : null}
                 </div>
                 <div className={b('controls-left')}>
                     {renderClipboardButton()}

src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx

@@ -11,9 +11,10 @@ import i18n from './i18n';
 
 interface TraceUrlButtonProps {
     traceId: string;
+    isTraceReady?: true;
 }
 
-export function TraceButton({traceId}: TraceUrlButtonProps) {
+export function TraceButton({traceId, isTraceReady}: TraceUrlButtonProps) {
     const {traceCheck, traceView} = useClusterBaseInfo();
 
     const checkTraceUrl = traceCheck?.url ? replaceParams(traceCheck.url, {traceId}) : '';
@@ -23,14 +24,14 @@ export function TraceButton({traceId}: TraceUrlButtonProps) {
 
     React.useEffect(() => {
         let checkTraceMutation: {abort: () => void} | null;
-        if (checkTraceUrl) {
+        if (checkTraceUrl && !isTraceReady) {
             checkTraceMutation = checkTrace({url: checkTraceUrl});
         }
 
         return () => checkTraceMutation?.abort();
-    }, [checkTrace, checkTraceUrl]);
+    }, [checkTrace, checkTraceUrl, isTraceReady]);
 
-    if (!traceUrl || isUninitialized) {
+    if (!traceUrl || (isUninitialized && !isTraceReady)) {
         return null;
     }
 

src/store/reducers/executeQuery.ts

@@ -22,6 +22,7 @@ const MAXIMUM_QUERIES_IN_HISTORY = 20;
 
 const CHANGE_USER_INPUT = 'query/CHANGE_USER_INPUT';
 const SET_QUERY_RESULT = 'query/SET_QUERY_RESULT';
+const SET_QUERY_TRACE_READY = 'query/SET_QUERY_TRACE_READY';
 const SAVE_QUERY_TO_HISTORY = 'query/SAVE_QUERY_TO_HISTORY';
 const UPDATE_QUERY_IN_HISTORY = 'query/UPDATE_QUERY_IN_HISTORY';
 const SET_QUERY_HISTORY_FILTER = 'query/SET_QUERY_HISTORY_FILTER';
@@ -63,6 +64,20 @@ const executeQuery: Reducer<ExecuteQueryState, ExecuteQueryAction> = (
             };
         }
 
+        case SET_QUERY_TRACE_READY: {
+            if (state.result) {
+                return {
+                    ...state,
+                    result: {
+                        ...state.result,
+                        isTraceReady: true,
+                    },
+                };
+            }
+
+            return state;
+        }
+
         case SET_QUERY_RESULT: {
             return {
                 ...state,
@@ -313,6 +328,12 @@ export function setQueryResult(data?: QueryResult) {
     } as const;
 }
 
+export function setQueryTraceReady() {
+    return {
+        type: SET_QUERY_TRACE_READY,
+    } as const;
+}
+
 export const goToPreviousQuery = () => {
     return {
         type: GO_TO_PREVIOUS_QUERY,

src/store/reducers/trace.ts

@@ -1,4 +1,5 @@
 import {api} from './api';
+import {setQueryTraceReady} from './executeQuery';
 
 interface CheckTraceParams {
     url: string;
@@ -7,9 +8,11 @@ interface CheckTraceParams {
 export const traceApi = api.injectEndpoints({
     endpoints: (build) => ({
         checkTrace: build.mutation({
-            queryFn: async ({url}: CheckTraceParams, {signal}) => {
+            queryFn: async ({url}: CheckTraceParams, {signal, dispatch}) => {
                 try {
                     const response = await window.api.checkTrace({url}, {signal});
+
+                    dispatch(setQueryTraceReady());
                     return {data: response};
                 } catch (error) {
                     return {error: error};

src/types/store/executeQuery.ts

@@ -5,6 +5,7 @@ import type {
     saveQueryToHistory,
     setQueryHistoryFilter,
     setQueryResult,
+    setQueryTraceReady,
     setTenantPath,
     updateQueryInHistory,
 } from '../../store/reducers/executeQuery';
@@ -34,6 +35,7 @@ export type ExecuteQueryResult = {
     type: ResultType.EXECUTE;
     data?: IQueryResult;
     error?: unknown;
+    isTraceReady?: true;
 } & CommonResultParams;
 
 export type ExplainQueryResult = {
@@ -64,7 +66,8 @@ export type ExecuteQueryAction =
     | ReturnType<typeof saveQueryToHistory>
     | ReturnType<typeof updateQueryInHistory>
     | ReturnType<typeof setTenantPath>
-    | ReturnType<typeof setQueryHistoryFilter>;
+    | ReturnType<typeof setQueryHistoryFilter>
+    | ReturnType<typeof setQueryTraceReady>;
 
 export interface ExecuteQueryStateSlice {
     executeQuery: ExecuteQueryState;