Nested Folders: Do not keep search state when navigating to a result item (#67749)

* Reset search state when navigating to a new search item

* Reset query on search select

* Spread initialState

* Remove unused import

* Only reset query

* Add test

* Fix spelling

* Change functionality

* Only applied saved filters when searching

public/app/features/search/state/SearchStateManager.test.ts

@@ -3,6 +3,7 @@ import { locationService } from '@grafana/runtime';
 
 import { DashboardQueryResult, getGrafanaSearcher } from '../service';
 import { SearchLayout } from '../types';
+import * as utils from '../utils';
 
 import { getSearchStateManager } from './SearchStateManager';
 
@@ -44,5 +45,29 @@ describe('SearchStateManager', () => {
       stm.initStateFromUrl();
       expect(stm.state.folderUid).toBe(undefined);
     });
+
+    it('should reset filters if state is updated and no URL params are present', () => {
+      const parseRouteParamsSpy = jest.spyOn(utils, 'parseRouteParams');
+      // Set initial values
+      parseRouteParamsSpy.mockImplementation(() => ({
+        query: 'hello',
+        sort: 'alpha-asc',
+      }));
+      const stm = getSearchStateManager();
+      stm.initStateFromUrl();
+
+      // Verify that they have been set
+      expect(stm.state.query).toBe('hello');
+      expect(stm.state.sort).toBe('alpha-asc');
+      expect(stm.state.folderUid).toBe(undefined);
+
+      // Changed to a view with no URL state.
+      parseRouteParamsSpy.mockImplementation(() => ({}));
+      stm.initStateFromUrl('abc');
+
+      expect(stm.state.query).toBe('');
+      expect(stm.state.sort).toBe(undefined);
+      expect(stm.state.folderUid).toBe('abc');
+    });
   });
 });

public/app/features/search/state/SearchStateManager.ts

@@ -49,6 +49,7 @@ export class SearchStateManager extends StateManagerBase<SearchState> {
     }
 
     stateManager.setState({
+      ...initialState,
       ...stateFromUrl,
       folderUid: folderUid,
       eventTrackingNamespace: folderUid ? 'manage_dashboards' : 'dashboard_search',
@@ -63,8 +64,10 @@ export class SearchStateManager extends StateManagerBase<SearchState> {
    * Updates internal and url state, then triggers a new search
    */
   setStateAndDoSearch(state: Partial<SearchState>) {
+    const sort = state.sort || this.state.sort || localStorage.getItem(SEARCH_SELECTED_SORT) || undefined;
+
     // Set internal state
-    this.setState(state);
+    this.setState({ sort, ...state });
 
     // Update url state
     this.updateLocation({
@@ -290,14 +293,13 @@ export function getSearchStateManager() {
   if (!stateManager) {
     const selectedLayout = localStorage.getItem(SEARCH_SELECTED_LAYOUT) as SearchLayout;
     const layout = selectedLayout ?? initialState.layout;
-    const sort = localStorage.getItem(SEARCH_SELECTED_SORT) ?? undefined;
 
     let includePanels = store.getBool(SEARCH_PANELS_LOCAL_STORAGE_KEY, true);
     if (includePanels) {
       includePanels = false;
     }
 
-    stateManager = new SearchStateManager({ ...initialState, layout, sort, includePanels });
+    stateManager = new SearchStateManager({ ...initialState, layout, includePanels });
   }
 
   return stateManager;