diff --git a/public/app/features/search/components/SectionHeader.tsx b/public/app/features/search/components/SectionHeader.tsx index 89eafe87500..689128f27c2 100644 --- a/public/app/features/search/components/SectionHeader.tsx +++ b/public/app/features/search/components/SectionHeader.tsx @@ -1,9 +1,10 @@ import React, { FC, useCallback } from 'react'; import { css, cx } from 'emotion'; import { GrafanaTheme } from '@grafana/data'; -import { Icon, IconButton, IconName, stylesFactory, useTheme } from '@grafana/ui'; +import { Icon, IconButton, stylesFactory, useTheme } from '@grafana/ui'; import { DashboardSection, OnToggleChecked } from '../types'; import { SearchCheckbox } from './SearchCheckbox'; +import { getSectionIcon } from '../utils'; interface SectionHeaderProps { editable?: boolean; @@ -41,7 +42,7 @@ export const SectionHeader: FC = ({
- +
{section.title} diff --git a/public/app/features/search/utils.ts b/public/app/features/search/utils.ts index 24801306bdb..84eb52c7333 100644 --- a/public/app/features/search/utils.ts +++ b/public/app/features/search/utils.ts @@ -1,4 +1,5 @@ import { parse, SearchParserResult } from 'search-query-parser'; +import { IconName } from '@grafana/ui'; import { DashboardQuery, DashboardSection, DashboardSectionItem, SearchAction, UidsToDelete } from './types'; import { NO_ID_SECTIONS } from './constants'; import { getDashboardSrv } from '../dashboard/services/DashboardSrv'; @@ -194,9 +195,25 @@ export const getParsedQuery = (query: DashboardQuery, queryParsing = false) => { return { ...parsedQuery, query: parseQuery(query.query).text as string, folderIds }; }; +/** + * Check if search query has filters enabled. Excludes folderId + * @param query + */ export const hasFilters = (query: DashboardQuery) => { if (!query) { return false; } return Boolean(query.query || query.tag?.length > 0 || query.starred || query.sort); }; + +/** + * Get section icon depending on expanded state. Currently works for folder icons only + * @param section + */ +export const getSectionIcon = (section: DashboardSection): IconName => { + if (!hasId(section.title)) { + return section.icon as IconName; + } + + return section.expanded ? 'folder-open' : 'folder'; +};