Search: Support filtering by tag in folder view (#49221)

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

@@ -29,6 +29,7 @@ interface SectionHeaderProps {
   onTagSelected: (tag: string) => void;
   section: DashboardSection;
   renderStandaloneBody?: boolean; // render the body on its own
+  tags?: string[];
 }
 
 export const FolderSection: FC<SectionHeaderProps> = ({
@@ -37,6 +38,7 @@ export const FolderSection: FC<SectionHeaderProps> = ({
   onTagSelected,
   selection,
   renderStandaloneBody,
+  tags,
 }) => {
   const editable = selectionToggle != null;
   const theme = useTheme();
@@ -74,7 +76,7 @@ export const FolderSection: FC<SectionHeaderProps> = ({
       folderUid = undefined;
       folderTitle = undefined;
     }
-    const raw = await getGrafanaSearcher().search(query);
+    const raw = await getGrafanaSearcher().search({ ...query, tags });
     const v = raw.view.map(
       (item) =>
         ({
@@ -91,7 +93,7 @@ export const FolderSection: FC<SectionHeaderProps> = ({
         } as DashboardSectionItem)
     );
     return v;
-  }, [sectionExpanded, section]);
+  }, [sectionExpanded, section, tags]);
 
   const onSectionExpand = () => {
     setSectionExpanded(!sectionExpanded);

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

@@ -12,11 +12,8 @@ import { SearchResultsProps } from '../components/SearchResultsTable';
 
 import { DashboardSection, FolderSection } from './FolderSection';
 
-export const FolderView = ({
-  selection,
-  selectionToggle,
-  onTagSelected,
-}: Pick<SearchResultsProps, 'selection' | 'selectionToggle' | 'onTagSelected'>) => {
+type Props = Pick<SearchResultsProps, 'selection' | 'selectionToggle' | 'onTagSelected'> & { tags?: string[] };
+export const FolderView = ({ selection, selectionToggle, onTagSelected, tags }: Props) => {
   const styles = useStyles2(getStyles);
 
   const results = useAsync(async () => {
@@ -59,6 +56,7 @@ export const FolderView = ({
                 selectionToggle={selectionToggle}
                 onTagSelected={onTagSelected}
                 section={section}
+                tags={tags}
               />
             )}
           </div>

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

@@ -131,7 +131,9 @@ export const SearchView = ({ showManage, folderDTO, queryText }: SearchViewProps
           />
         );
       }
-      return <FolderView selection={selection} selectionToggle={toggleSelection} onTagSelected={onTagAdd} />;
+      return (
+        <FolderView selection={selection} selectionToggle={toggleSelection} tags={query.tag} onTagSelected={onTagAdd} />
+      );
     }
 
     return (