Search: default layout to last selected value (#50743)

public/app/features/search/constants.ts

@@ -9,3 +9,4 @@ export const GENERAL_FOLDER_UID = 'general';
 export const GENERAL_FOLDER_TITLE = 'General';
 export const PREVIEWS_LOCAL_STORAGE_KEY = 'grafana.dashboard.previews';
 export const SEARCH_PANELS_LOCAL_STORAGE_KEY = 'grafana.search.include.panels';
+export const SEARCH_SELECTED_LAYOUT = 'grafana.search.layout';

public/app/features/search/hooks/useSearchQuery.ts

@@ -4,6 +4,7 @@ import { FormEvent, useCallback, useReducer } from 'react';
 import { SelectableValue } from '@grafana/data';
 import { locationService } from '@grafana/runtime';
 
+import { SEARCH_SELECTED_LAYOUT } from '../constants';
 import {
   ADD_TAG,
   CLEAR_FILTERS,
@@ -23,6 +24,10 @@ const updateLocation = debounce((query) => locationService.partial(query), 300);
 export const useSearchQuery = (defaults: Partial<DashboardQuery>) => {
   const queryParams = parseRouteParams(locationService.getSearchObject());
   const initialState = { ...defaultQuery, ...defaults, ...queryParams };
+  const selectedLayout = localStorage.getItem(SEARCH_SELECTED_LAYOUT) as SearchLayout;
+  if (!queryParams.layout?.length && selectedLayout?.length) {
+    initialState.layout = selectedLayout;
+  }
   const [query, dispatch] = useReducer(queryReducer, initialState);
 
   const onQueryChange = useCallback((query: string) => {

public/app/features/search/page/components/ActionRow.tsx

@@ -7,6 +7,7 @@ import { HorizontalGroup, RadioButtonGroup, useStyles2, Checkbox, Button } from
 import { SortPicker } from 'app/core/components/Select/SortPicker';
 import { TagFilter, TermCount } from 'app/core/components/TagFilter/TagFilter';
 
+import { SEARCH_SELECTED_LAYOUT } from '../../constants';
 import { DashboardQuery, SearchLayout } from '../../types';
 
 export const layoutOptions = [
@@ -69,6 +70,11 @@ export const ActionRow: FC<Props> = ({
   // Disabled folder layout option when query is present
   const disabledOptions = query.query ? [SearchLayout.Folders] : [];
 
+  const updateLayoutPreference = (layout: SearchLayout) => {
+    localStorage.setItem(SEARCH_SELECTED_LAYOUT, layout);
+    onLayoutChange(layout);
+  };
+
   return (
     <div className={styles.actionRow}>
       <div className={styles.rowContainer}>
@@ -77,7 +83,7 @@ export const ActionRow: FC<Props> = ({
             <RadioButtonGroup
               options={layoutOptions}
               disabledOptions={disabledOptions}
-              onChange={onLayoutChange}
+              onChange={updateLayoutPreference}
               value={layout}
             />
           )}