From 5575334893c6f2bc049d1b34d127419df64b0d6d Mon Sep 17 00:00:00 2001 From: SagarRajput-7 Date: Thu, 26 Jun 2025 15:01:29 +0530 Subject: [PATCH] fix: implemented the filter retention across view switch in explorer pages --- .../QueryAddOns/HavingFilter/HavingFilter.tsx | 9 +++ frontend/src/pages/LogsExplorer/index.tsx | 70 +++++++++++++++---- frontend/src/pages/TracesExplorer/index.tsx | 66 +++++++++++++---- 3 files changed, 118 insertions(+), 27 deletions(-) diff --git a/frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/HavingFilter/HavingFilter.tsx b/frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/HavingFilter/HavingFilter.tsx index 72fed3077126..3fb41feb6def 100644 --- a/frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/HavingFilter/HavingFilter.tsx +++ b/frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/HavingFilter/HavingFilter.tsx @@ -244,6 +244,15 @@ function HavingFilter({ return null; } + // Hide suggestions while typing a value after an operator + if ( + !text.endsWith(' ') && + tokens.length >= 2 && + havingOperators.some((op) => op.value === tokens[tokens.length - 2]) + ) { + return null; + } + // Suggest key/operator pairs and ( for grouping if ( tokens.length === 0 || diff --git a/frontend/src/pages/LogsExplorer/index.tsx b/frontend/src/pages/LogsExplorer/index.tsx index 01a68e03264f..987219d7e661 100644 --- a/frontend/src/pages/LogsExplorer/index.tsx +++ b/frontend/src/pages/LogsExplorer/index.tsx @@ -32,6 +32,7 @@ import { usePreferenceContext } from 'providers/preferences/context/PreferenceCo import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useSearchParams } from 'react-router-dom-v5-compat'; import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse'; +import { Query } from 'types/api/queryBuilder/queryBuilderData'; import { DataSource } from 'types/common/queryBuilder'; import { getExplorerViewForPanelType, @@ -82,6 +83,8 @@ function LogsExplorer(): JSX.Element { handleRunQuery, handleSetConfig, updateAllQueriesOperators, + currentQuery, + updateQueriesData, } = useQueryBuilder(); const { handleExplorerTabChange } = useHandleExplorerTabChange(); @@ -94,6 +97,14 @@ function LogsExplorer(): JSX.Element { const [shouldReset, setShouldReset] = useState(false); + const [defaultQuery, setDefaultQuery] = useState(() => + updateAllQueriesOperators( + initialQueriesMap.logs, + PANEL_TYPES.LIST, + DataSource.LOGS, + ), + ); + const handleChangeSelectedView = useCallback( (view: ExplorerViews): void => { if (selectedView === ExplorerViews.LIST) { @@ -101,6 +112,30 @@ function LogsExplorer(): JSX.Element { } if (view === ExplorerViews.LIST) { + if ( + selectedView !== ExplorerViews.LIST && + currentQuery?.builder?.queryData?.[0] + ) { + const filterToRetain = currentQuery.builder.queryData[0].filter; + + const newDefaultQuery = updateAllQueriesOperators( + initialQueriesMap.logs, + PANEL_TYPES.LIST, + DataSource.LOGS, + ); + + const newListQuery = updateQueriesData( + newDefaultQuery, + 'queryData', + (item, index) => { + if (index === 0) { + return { ...item, filter: filterToRetain }; + } + return item; + }, + ); + setDefaultQuery(newListQuery); + } setShouldReset(true); } @@ -109,27 +144,34 @@ function LogsExplorer(): JSX.Element { view === ExplorerViews.TIMESERIES ? PANEL_TYPES.TIME_SERIES : view, ); }, - [handleSetConfig, handleExplorerTabChange, selectedView], - ); - - const defaultListQuery = useMemo( - () => - updateAllQueriesOperators( - initialQueriesMap.logs, - PANEL_TYPES.LIST, - DataSource.LOGS, - ), - [updateAllQueriesOperators], + [ + handleSetConfig, + handleExplorerTabChange, + selectedView, + currentQuery, + updateAllQueriesOperators, + updateQueriesData, + setSelectedView, + ], ); useShareBuilderUrl({ - defaultValue: defaultListQuery, + defaultValue: defaultQuery, forceReset: shouldReset, }); useEffect(() => { - if (shouldReset) setShouldReset(false); - }, [shouldReset]); + if (shouldReset) { + setShouldReset(false); + setDefaultQuery( + updateAllQueriesOperators( + initialQueriesMap.logs, + PANEL_TYPES.LIST, + DataSource.LOGS, + ), + ); + } + }, [shouldReset, updateAllQueriesOperators]); const handleFilterVisibilityChange = (): void => { setLocalStorageApi( diff --git a/frontend/src/pages/TracesExplorer/index.tsx b/frontend/src/pages/TracesExplorer/index.tsx index e6675240e3d0..aef043126ce7 100644 --- a/frontend/src/pages/TracesExplorer/index.tsx +++ b/frontend/src/pages/TracesExplorer/index.tsx @@ -51,6 +51,7 @@ function TracesExplorer(): JSX.Element { handleRunQuery, stagedQuery, handleSetConfig, + updateQueriesData, } = useQueryBuilder(); const { options } = useOptionsMenu({ @@ -94,6 +95,14 @@ function TracesExplorer(): JSX.Element { const [shouldReset, setShouldReset] = useState(false); + const [defaultQuery, setDefaultQuery] = useState(() => + updateAllQueriesOperators( + initialQueriesMap.traces, + PANEL_TYPES.LIST, + DataSource.TRACES, + ), + ); + const handleChangeSelectedView = useCallback( (view: ExplorerViews): void => { if (selectedView === ExplorerViews.LIST) { @@ -101,6 +110,30 @@ function TracesExplorer(): JSX.Element { } if (view === ExplorerViews.LIST) { + if ( + selectedView !== ExplorerViews.LIST && + currentQuery?.builder?.queryData?.[0] + ) { + const filterToRetain = currentQuery.builder.queryData[0].filter; + + const newDefaultQuery = updateAllQueriesOperators( + initialQueriesMap.traces, + PANEL_TYPES.LIST, + DataSource.TRACES, + ); + + const newListQuery = updateQueriesData( + newDefaultQuery, + 'queryData', + (item, index) => { + if (index === 0) { + return { ...item, filter: filterToRetain }; + } + return item; + }, + ); + setDefaultQuery(newListQuery); + } setShouldReset(true); } @@ -109,7 +142,15 @@ function TracesExplorer(): JSX.Element { view === ExplorerViews.TIMESERIES ? PANEL_TYPES.TIME_SERIES : view, ); }, - [handleSetConfig, handleExplorerTabChange, selectedView], + [ + handleSetConfig, + handleExplorerTabChange, + selectedView, + currentQuery, + updateAllQueriesOperators, + updateQueriesData, + setSelectedView, + ], ); const listQuery = useMemo(() => { @@ -118,16 +159,6 @@ function TracesExplorer(): JSX.Element { return stagedQuery.builder.queryData.find((item) => !item.disabled) || null; }, [stagedQuery]); - const defaultQuery = useMemo( - () => - updateAllQueriesOperators( - initialQueriesMap.traces, - PANEL_TYPES.LIST, - DataSource.TRACES, - ), - [updateAllQueriesOperators], - ); - const exportDefaultQuery = useMemo( () => updateAllQueriesOperators( @@ -186,8 +217,17 @@ function TracesExplorer(): JSX.Element { useShareBuilderUrl({ defaultValue: defaultQuery, forceReset: shouldReset }); useEffect(() => { - if (shouldReset) setShouldReset(false); - }, [shouldReset]); + if (shouldReset) { + setShouldReset(false); + setDefaultQuery( + updateAllQueriesOperators( + initialQueriesMap.traces, + PANEL_TYPES.LIST, + DataSource.TRACES, + ), + ); + } + }, [shouldReset, updateAllQueriesOperators]); const [isOpen, setOpen] = useState(true); const logEventCalledRef = useRef(false);