Search: Fix strict null errors (#23804)

public/app/core/components/Select/SortPicker.tsx

@@ -8,7 +8,7 @@ const searchSrv = new SearchSrv();
 
 
 export interface Props {
 export interface Props {
   onChange: (sortValue: SelectableValue) => void;
   onChange: (sortValue: SelectableValue) => void;
-  value?: SelectableValue;
+  value?: SelectableValue | null;
   placeholder?: string;
   placeholder?: string;
 }
 }
 
 

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

@@ -25,17 +25,19 @@ interface Props {
   query: DashboardQuery;
   query: DashboardQuery;
   showStarredFilter?: boolean;
   showStarredFilter?: boolean;
   hideSelectedTags?: boolean;
   hideSelectedTags?: boolean;
+  hideLayout?: boolean;
 }
 }
 
 
 export const ActionRow: FC<Props> = ({
 export const ActionRow: FC<Props> = ({
   layout,
   layout,
   onLayoutChange,
   onLayoutChange,
   onSortChange,
   onSortChange,
-  onStarredFilterChange,
+  onStarredFilterChange = () => {},
   onTagFilterChange,
   onTagFilterChange,
   query,
   query,
   showStarredFilter,
   showStarredFilter,
   hideSelectedTags,
   hideSelectedTags,
+  hideLayout,
 }) => {
 }) => {
   const theme = useTheme();
   const theme = useTheme();
   const styles = getStyles(theme);
   const styles = getStyles(theme);
@@ -43,7 +45,7 @@ export const ActionRow: FC<Props> = ({
   return (
   return (
     <div className={styles.actionRow}>
     <div className={styles.actionRow}>
       <HorizontalGroup spacing="md" width="100%">
       <HorizontalGroup spacing="md" width="100%">
-        {layout ? <RadioButtonGroup options={layoutOptions} onChange={onLayoutChange} value={layout} /> : null}
+        {!hideLayout ? <RadioButtonGroup options={layoutOptions} onChange={onLayoutChange} value={layout} /> : null}
         <SortPicker onChange={onSortChange} value={query.sort} />
         <SortPicker onChange={onSortChange} value={query.sort} />
       </HorizontalGroup>
       </HorizontalGroup>
       <HorizontalGroup spacing="md" justify="space-between">
       <HorizontalGroup spacing="md" justify="space-between">

public/app/features/search/components/ManageDashboards.tsx

@@ -154,7 +154,8 @@ export const ManageDashboards: FC<Props> = memo(({ folderId, folderUid }) => {
             onSortChange={onSortChange}
             onSortChange={onSortChange}
             onTagFilterChange={onTagFilterChange}
             onTagFilterChange={onTagFilterChange}
             query={query}
             query={query}
-            layout={!folderUid && layout}
+            layout={layout}
+            hideLayout={!!folderUid}
             onLayoutChange={onLayoutChange}
             onLayoutChange={onLayoutChange}
           />
           />
         )}
         )}

public/app/features/search/components/SearchResultsFilter.tsx

@@ -12,14 +12,15 @@ export interface Props {
   canDelete?: boolean;
   canDelete?: boolean;
   canMove?: boolean;
   canMove?: boolean;
   deleteItem: () => void;
   deleteItem: () => void;
+  hideLayout?: boolean;
+  layout: string;
   moveTo: () => void;
   moveTo: () => void;
+  onLayoutChange: Dispatch<SetStateAction<string>>;
+  onSortChange: onSelectChange;
   onStarredFilterChange: onSelectChange;
   onStarredFilterChange: onSelectChange;
   onTagFilterChange: onSelectChange;
   onTagFilterChange: onSelectChange;
   onToggleAllChecked: () => void;
   onToggleAllChecked: () => void;
   query: DashboardQuery;
   query: DashboardQuery;
-  onSortChange: onSelectChange;
-  onLayoutChange: Dispatch<SetStateAction<string>>;
-  layout: string;
 }
 }
 
 
 export const SearchResultsFilter: FC<Props> = ({
 export const SearchResultsFilter: FC<Props> = ({
@@ -27,14 +28,15 @@ export const SearchResultsFilter: FC<Props> = ({
   canDelete,
   canDelete,
   canMove,
   canMove,
   deleteItem,
   deleteItem,
+  hideLayout,
+  layout,
   moveTo,
   moveTo,
-  onToggleAllChecked,
+  onLayoutChange,
+  onSortChange,
   onStarredFilterChange,
   onStarredFilterChange,
   onTagFilterChange,
   onTagFilterChange,
+  onToggleAllChecked,
   query,
   query,
-  onSortChange,
-  layout,
-  onLayoutChange,
 }) => {
 }) => {
   const showActions = canDelete || canMove;
   const showActions = canDelete || canMove;
   const theme = useTheme();
   const theme = useTheme();
@@ -56,6 +58,7 @@ export const SearchResultsFilter: FC<Props> = ({
         <ActionRow
         <ActionRow
           {...{
           {...{
             layout,
             layout,
+            hideLayout,
             onLayoutChange,
             onLayoutChange,
             onSortChange,
             onSortChange,
             onStarredFilterChange,
             onStarredFilterChange,

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

@@ -46,7 +46,7 @@ export const useSearchQuery = (queryParams: Partial<DashboardQuery>) => {
     dispatch({ type: TOGGLE_STARRED, payload: filter.value });
     dispatch({ type: TOGGLE_STARRED, payload: filter.value });
   };
   };
 
 
-  const onSortChange = (sort: SelectableValue) => {
+  const onSortChange = (sort: SelectableValue | null) => {
     dispatch({ type: TOGGLE_SORT, payload: sort });
     dispatch({ type: TOGGLE_SORT, payload: sort });
   };
   };
 
 

public/app/features/search/loaders.ts

@@ -41,16 +41,16 @@ export const loadFolderPage = (uid: string, activeChildId: string) => {
     navModel.main.text = folderTitle;
     navModel.main.text = folderTitle;
 
 
     const dashTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-dashboards');
     const dashTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-dashboards');
-    dashTab.url = folderUrl;
+    dashTab!.url = folderUrl;
 
 
     if (folder.canAdmin) {
     if (folder.canAdmin) {
       const permTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-permissions');
       const permTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-permissions');
-      permTab.url = folderUrl + '/permissions';
+      permTab!.url = folderUrl + '/permissions';
 
 
       const settingsTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-settings');
       const settingsTab = navModel.main.children.find((child: any) => child.id === 'manage-folder-settings');
-      settingsTab.url = folderUrl + '/settings';
+      settingsTab!.url = folderUrl + '/settings';
     } else {
     } else {
-      navModel.main.children = [dashTab];
+      navModel.main.children = [dashTab!];
     }
     }
 
 
     return { folder, model: navModel };
     return { folder, model: navModel };