From 47659bba27fcac6b134f89c783fd663dbdf5c622 Mon Sep 17 00:00:00 2001
From: Anton Standrik <astandrik@gmail.com>
Date: Tue, 29 Oct 2024 17:32:24 +0300
Subject: [PATCH 1/2] fix: tracing issues

---
 .../Query/ExecuteResult/TraceButton.tsx       | 26 +++++++------------
 src/services/api.ts                           |  9 ++++---
 src/store/reducers/trace.ts                   |  2 +-
 3 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx b/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx
index e07042390..37fa5dc6e 100644
--- a/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx
+++ b/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx
@@ -5,14 +5,10 @@ import {Button} from '@gravity-ui/uikit';
 
 import {useClusterBaseInfo} from '../../../../store/reducers/cluster/cluster';
 import {traceApi} from '../../../../store/reducers/trace';
-import {SECOND_IN_MS} from '../../../../utils/constants';
-import {useDelayed} from '../../../../utils/hooks/useDelayed';
 import {replaceParams} from '../utils/replaceParams';
 
 import i18n from './i18n';
 
-const TIME_BEFORE_CHECK = 15 * SECOND_IN_MS;
-
 interface TraceUrlButtonProps {
     traceId: string;
 }
@@ -23,27 +19,25 @@ export function TraceButton({traceId}: TraceUrlButtonProps) {
     const checkTraceUrl = traceCheck?.url ? replaceParams(traceCheck.url, {traceId}) : '';
     const traceUrl = traceView?.url ? replaceParams(traceView.url, {traceId}) : '';
 
-    // We won't get any trace data at first 15 seconds for sure
-    const [readyToFetch, resetDelay] = useDelayed(TIME_BEFORE_CHECK);
+    const [checkTrace, {isLoading, isUninitialized}] = traceApi.useCheckTraceMutation();
 
     React.useEffect(() => {
-        resetDelay();
-    }, [traceId, resetDelay]);
+        let checkTraceMutation: {abort: () => void} | null;
+        if (checkTraceUrl) {
+            checkTraceMutation = checkTrace({url: checkTraceUrl});
+        }
 
-    const {isFetching} = traceApi.useCheckTraceQuery(
-        {url: checkTraceUrl},
-        {skip: !checkTraceUrl || !readyToFetch},
-    );
+        return () => checkTraceMutation?.abort();
+    }, [checkTrace, checkTraceUrl]);
 
-    if (!traceUrl) {
+    if (!traceUrl || isUninitialized) {
         return null;
     }
 
-    const loading = !readyToFetch || isFetching;
     return (
         <Button
-            view={loading ? 'flat-secondary' : 'flat-info'}
-            loading={loading}
+            view={isLoading ? 'flat-secondary' : 'flat-info'}
+            loading={isLoading}
             href={traceUrl}
             target="_blank"
         >
diff --git a/src/services/api.ts b/src/services/api.ts
index 2a1d9b3e6..1f27971f5 100644
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -66,8 +66,9 @@ import {parseMetaCluster} from './parsers/parseMetaCluster';
 import {parseMetaTenants} from './parsers/parseMetaTenants';
 import {settingsManager} from './settings';
 
-const TRACE_CHECK_TIMEOUT = 2 * SECOND_IN_MS;
-const TRACE_API_ERROR_TIMEOUT = 10 * SECOND_IN_MS;
+const TRACE_RETRY_DELAY = 4 * SECOND_IN_MS;
+const TRACE_CHECK_TIMEOUT = 10 * SECOND_IN_MS;
+const TRACE_API_ERROR_RETRY_DELAY = 10 * SECOND_IN_MS;
 const MAX_TRACE_CHECK_RETRIES = 30;
 
 export type AxiosOptions = {
@@ -604,10 +605,10 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
                                 (error?.response?.status === 404 || error.code === 'ERR_NETWORK');
 
                             if (isTracingError) {
-                                return TRACE_CHECK_TIMEOUT;
+                                return TRACE_RETRY_DELAY;
                             }
 
-                            return TRACE_API_ERROR_TIMEOUT;
+                            return TRACE_API_ERROR_RETRY_DELAY;
                         },
                         shouldResetTimeout: true,
                         retryCondition: () => true,
diff --git a/src/store/reducers/trace.ts b/src/store/reducers/trace.ts
index 6d1ec2ae1..15b47e193 100644
--- a/src/store/reducers/trace.ts
+++ b/src/store/reducers/trace.ts
@@ -6,7 +6,7 @@ interface CheckTraceParams {
 
 export const traceApi = api.injectEndpoints({
     endpoints: (build) => ({
-        checkTrace: build.query({
+        checkTrace: build.mutation({
             queryFn: async ({url}: CheckTraceParams, {signal}) => {
                 try {
                     const response = await window.api.checkTrace({url}, {signal});

From 8234116091803d7898f50246933196a3c435abb4 Mon Sep 17 00:00:00 2001
From: Anton Standrik <astandrik@gmail.com>
Date: Tue, 29 Oct 2024 18:10:06 +0300
Subject: [PATCH 2/2] fix: dont reask trace for query if it fetched

---
 .../Query/ExecuteResult/ExecuteResult.tsx     |  4 +++-
 .../Query/ExecuteResult/TraceButton.tsx       |  9 ++++----
 src/store/reducers/executeQuery.ts            | 21 +++++++++++++++++++
 src/store/reducers/trace.ts                   |  5 ++++-
 src/types/store/executeQuery.ts               |  5 ++++-
 5 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/src/containers/Tenant/Query/ExecuteResult/ExecuteResult.tsx b/src/containers/Tenant/Query/ExecuteResult/ExecuteResult.tsx
index 24174ae32..87326f0a0 100644
--- a/src/containers/Tenant/Query/ExecuteResult/ExecuteResult.tsx
+++ b/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()}
diff --git a/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx b/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx
index 37fa5dc6e..32449207f 100644
--- a/src/containers/Tenant/Query/ExecuteResult/TraceButton.tsx
+++ b/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;
     }
 
diff --git a/src/store/reducers/executeQuery.ts b/src/store/reducers/executeQuery.ts
index 5fc88271a..b58376567 100644
--- a/src/store/reducers/executeQuery.ts
+++ b/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,
diff --git a/src/store/reducers/trace.ts b/src/store/reducers/trace.ts
index 15b47e193..466afcb2b 100644
--- a/src/store/reducers/trace.ts
+++ b/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};
diff --git a/src/types/store/executeQuery.ts b/src/types/store/executeQuery.ts
index 62b88db1e..391a20ae3 100644
--- a/src/types/store/executeQuery.ts
+++ b/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;