From ed40d2dc02fb14b8657c7ebf49a015c093ada884 Mon Sep 17 00:00:00 2001 From: balaji-jr Date: Fri, 2 Aug 2024 15:43:45 +0530 Subject: [PATCH 1/2] clear filter context on stream change --- src/pages/Stream/Views/Explore/StaticLogRow.tsx | 3 +-- .../Stream/components/Querier/SavedFiltersModal.tsx | 1 - src/pages/Stream/components/Querier/index.tsx | 12 ++++++------ src/pages/Stream/providers/LogsProvider.tsx | 9 --------- 4 files changed, 7 insertions(+), 18 deletions(-) diff --git a/src/pages/Stream/Views/Explore/StaticLogRow.tsx b/src/pages/Stream/Views/Explore/StaticLogRow.tsx index cbcb7368..971f3984 100644 --- a/src/pages/Stream/Views/Explore/StaticLogRow.tsx +++ b/src/pages/Stream/Views/Explore/StaticLogRow.tsx @@ -84,11 +84,10 @@ const LogRow: FC = (props) => { onClick(log)}> {columnsToShow.map((header, logSchemaIndex) => { const parsedData = parseLogData(log[header], header); - return ( handleMouseEnter(logIndex, logSchemaIndex)} onMouseLeave={handleMouseLeave}> diff --git a/src/pages/Stream/components/Querier/SavedFiltersModal.tsx b/src/pages/Stream/components/Querier/SavedFiltersModal.tsx index fb734ee0..b9c001e5 100644 --- a/src/pages/Stream/components/Querier/SavedFiltersModal.tsx +++ b/src/pages/Stream/components/Querier/SavedFiltersModal.tsx @@ -170,7 +170,6 @@ const SavedFiltersModal = () => { const onSqlSearchApply = useCallback( (query: string, id: string, time_filter: null | { from: string; to: string }) => { setFilterStore((store) => resetFilters(store)); - setLogsStore((store) => applyCustomQuery(store, query, 'sql', id, time_filter)); }, [], diff --git a/src/pages/Stream/components/Querier/index.tsx b/src/pages/Stream/components/Querier/index.tsx index 4fa3f0ba..127faf3e 100644 --- a/src/pages/Stream/components/Querier/index.tsx +++ b/src/pages/Stream/components/Querier/index.tsx @@ -136,8 +136,8 @@ const Querier = () => { const onFiltersApply = useCallback( (opts?: { isUncontrolled?: boolean }) => { if (!currentStream) return; - const { isUncontrolled } = opts || {}; + const { isUncontrolled } = opts || {}; const { parsedQuery } = parseQuery(query, currentStream); setFilterStore((store) => storeAppliedQuery(store)); triggerRefetch(parsedQuery, 'filters', isUncontrolled && savedFilterId ? savedFilterId : undefined); @@ -175,13 +175,13 @@ const Querier = () => { // trigger query fetch if the rules were updated by the remove btn on pills // ----------------------------------- - if (!showQueryBuilder && (activeMode !== 'sql' || savedFilterId)) { + if ((!showQueryBuilder && activeMode === 'filters') || savedFilterId) { if (!shouldSumbitDisabled) { onFiltersApply({ isUncontrolled: true }); - } - - if (allValues.length === 0 && activeMode !== 'sql') { - onClear(); + } else { + if (activeMode === 'filters') { + onClear(); + } } } // ----------------------------------- diff --git a/src/pages/Stream/providers/LogsProvider.tsx b/src/pages/Stream/providers/LogsProvider.tsx index 4984ed0f..42e487d9 100644 --- a/src/pages/Stream/providers/LogsProvider.tsx +++ b/src/pages/Stream/providers/LogsProvider.tsx @@ -239,7 +239,6 @@ type LogsStoreReducers = { streamChangeCleanup: (store: LogsStore) => ReducerOutput; toggleQueryBuilder: (store: LogsStore, val?: boolean) => ReducerOutput; resetCustQuerySearchState: (store: LogsStore) => ReducerOutput; - setCustQuerySearchState: (store: LogsStore, payload: Partial) => ReducerOutput; toggleCustQuerySearchViewMode: (store: LogsStore, targetMode: 'sql' | 'filters') => ReducerOutput; toggleDeleteModal: (store: LogsStore, val?: boolean) => ReducerOutput; toggleAlertsModal: (store: LogsStore, val?: boolean) => ReducerOutput; @@ -445,13 +444,6 @@ const resetCustQuerySearchState = (store: LogsStore) => { }; }; -const setCustQuerySearchState = (store: LogsStore, payload: Partial) => { - const { custQuerySearchState } = store; - return { - custQuerySearchState: { ...custQuerySearchState, ...payload, isQuerySearchActive: true, showQueryBuilder: false }, - }; -}; - const toggleCustQuerySearchViewMode = (store: LogsStore, targetMode: 'filters' | 'sql') => { const { custQuerySearchState } = store; @@ -914,7 +906,6 @@ const logsStoreReducers: LogsStoreReducers = { streamChangeCleanup, toggleQueryBuilder, resetCustQuerySearchState, - setCustQuerySearchState, toggleCustQuerySearchViewMode, toggleAlertsModal, toggleRetentionModal, From 8ff9eeef92dfc25bd69f483b1bc9feef99969337 Mon Sep 17 00:00:00 2001 From: balaji-jr Date: Fri, 2 Aug 2024 17:13:11 +0530 Subject: [PATCH 2/2] fix - reset sql filter context on stream change --- src/pages/Stream/components/Querier/QueryCodeEditor.tsx | 4 +--- src/pages/Stream/components/Querier/index.tsx | 9 +++++++-- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/src/pages/Stream/components/Querier/QueryCodeEditor.tsx b/src/pages/Stream/components/Querier/QueryCodeEditor.tsx index 782fc505..d5424c14 100644 --- a/src/pages/Stream/components/Querier/QueryCodeEditor.tsx +++ b/src/pages/Stream/components/Querier/QueryCodeEditor.tsx @@ -9,7 +9,6 @@ import { sanitiseSqlString } from '@/utils/sanitiseSqlString'; import { Field } from '@/@types/parseable/dataType'; import queryCodeStyles from '../../styles/QueryCode.module.css'; import { useAppStore } from '@/layouts/MainLayout/providers/AppProvider'; -import { useFilterStore } from '../../providers/FilterProvider'; import { LOAD_LIMIT, useLogsStore } from '../../providers/LogsProvider'; import { useStreamStore } from '../../providers/StreamProvider'; @@ -30,7 +29,7 @@ const genColumnConfig = (fields: Field[]) => { }, columnConfig); }; -const defaultCustSQLQuery = (streamName: string | null) => { +export const defaultCustSQLQuery = (streamName: string | null) => { if (streamName && streamName.length > 0) { return `SELECT * FROM ${streamName} LIMIT ${LOAD_LIMIT};`; } else { @@ -44,7 +43,6 @@ const QueryCodeEditor: FC<{ onClear: () => void; }> = (props) => { const [llmActive] = useAppStore((store) => store.instanceConfig?.llmActive); - const [] = useFilterStore((store) => store); const [{ isQuerySearchActive, activeMode, savedFilterId, custSearchQuery }] = useLogsStore( (store) => store.custQuerySearchState, ); diff --git a/src/pages/Stream/components/Querier/index.tsx b/src/pages/Stream/components/Querier/index.tsx index 127faf3e..bac334bc 100644 --- a/src/pages/Stream/components/Querier/index.tsx +++ b/src/pages/Stream/components/Querier/index.tsx @@ -4,7 +4,7 @@ import classes from '../../styles/Querier.module.css'; import { Text } from '@mantine/core'; import { FilterQueryBuilder, QueryPills } from './FilterQueryBuilder'; import { AppliedSQLQuery } from './QueryEditor'; -import QueryCodeEditor from './QueryCodeEditor'; +import QueryCodeEditor, { defaultCustSQLQuery } from './QueryCodeEditor'; import { useLogsStore, logsStoreReducers } from '../../providers/LogsProvider'; import { useCallback, useEffect, useRef } from 'react'; import { filterStoreReducers, noValueOperators, useFilterStore } from '../../providers/FilterProvider'; @@ -72,12 +72,17 @@ const QuerierModal = (props: { onSqlSearchApply: (query: string) => void; onFiltersApply: () => void; }) => { + const [currentStream] = useAppStore(store => store.currentStream) const [{ showQueryBuilder, viewMode }, setLogsStore] = useLogsStore((store) => store.custQuerySearchState); const onClose = useCallback(() => { setLogsStore((store) => toggleQueryBuilder(store, false)); }, []); const queryCodeEditorRef = useRef(''); // to store input value even after the editor unmounts + useEffect(() => { + queryCodeEditorRef.current = defaultCustSQLQuery(currentStream); + }, [currentStream]); + return ( { useEffect(() => { return setFilterStore(resetFilters); - }, []); + }, [currentStream]); const triggerRefetch = useCallback( (query: string, mode: 'filters' | 'sql', id?: string) => {