fix: refactor useSavedQueries (#3023)

Author: Raubzeug

src/containers/Tenant/Query/QueryEditor/helpers.ts

@@ -6,14 +6,10 @@ import type Monaco from 'monaco-editor';
 import {codeAssistApi} from '../../../../store/reducers/codeAssist/codeAssist';
 import {selectQueriesHistory} from '../../../../store/reducers/query/query';
 import type {TelemetryOpenTabs} from '../../../../types/api/codeAssist';
-import type {SavedQuery} from '../../../../types/store/query';
-import {
-    AUTOCOMPLETE_ON_ENTER,
-    ENABLE_AUTOCOMPLETE,
-    SAVED_QUERIES_KEY,
-} from '../../../../utils/constants';
+import {AUTOCOMPLETE_ON_ENTER, ENABLE_AUTOCOMPLETE} from '../../../../utils/constants';
 import {useSetting, useTypedSelector} from '../../../../utils/hooks';
 import {YQL_LANGUAGE_ID} from '../../../../utils/monaco/constats';
+import {useSavedQueries} from '../utils/useSavedQueries';
 
 export type EditorOptions = Monaco.editor.IEditorOptions & Monaco.editor.IGlobalEditorOptions;
 
@@ -50,7 +46,7 @@ export function useCodeAssistHelpers() {
     const [ignoreSuggestion] = codeAssistApi.useIgnoreSuggestionMutation();
     const [sendUserQueriesData] = codeAssistApi.useSendUserQueriesDataMutation();
     const historyQueries = useTypedSelector(selectQueriesHistory);
-    const [savedQueries] = useSetting<SavedQuery[]>(SAVED_QUERIES_KEY, []);
+    const savedQueries = useSavedQueries();
 
     const getCodeAssistSuggestions = React.useCallback(
         async (promptFiles: PromptFile[]) => sendCodeAssistPrompt(promptFiles).unwrap(),

src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx

@@ -24,7 +24,7 @@ import {useTypedDispatch, useTypedSelector} from '../../../../utils/hooks';
 import {useChangeInputWithConfirmation} from '../../../../utils/hooks/withConfirmation/useChangeInputWithConfirmation';
 import {MAX_QUERY_HEIGHT, QUERY_TABLE_SETTINGS} from '../../utils/constants';
 import i18n from '../i18n';
-import {useSavedQueries} from '../utils/useSavedQueries';
+import {useFilteredSavedQueries} from '../utils/useSavedQueries';
 
 import './SavedQueries.scss';
 
@@ -68,7 +68,7 @@ interface SavedQueriesProps {
 }
 
 export const SavedQueries = ({changeUserInput}: SavedQueriesProps) => {
-    const savedQueries = useSavedQueries();
+    const savedQueries = useFilteredSavedQueries();
     const dispatch = useTypedDispatch();
     const filter = useTypedSelector(selectSavedQueriesFilter);
 

src/containers/Tenant/Query/utils/useSavedQueries.tsx

@@ -7,6 +7,12 @@ import {useSetting, useTypedSelector} from '../../../../utils/hooks';
 
 export function useSavedQueries() {
     const [savedQueries] = useSetting<SavedQuery[]>(SAVED_QUERIES_KEY, []);
+
+    return savedQueries;
+}
+
+export function useFilteredSavedQueries() {
+    const savedQueries = useSavedQueries();
     const filter = useTypedSelector(selectSavedQueriesFilter).trim().toLowerCase();
 
     const filteredSavedQueries = React.useMemo(() => {