diff --git a/ui/src/components/LayoutShell.tsx b/ui/src/components/LayoutShell.tsx index 111cb661..7785a438 100644 --- a/ui/src/components/LayoutShell.tsx +++ b/ui/src/components/LayoutShell.tsx @@ -44,6 +44,7 @@ import { EnvironmentSwitcherModal } from './EnvironmentSwitcherModal'; import { envColorVar } from './env-colors'; import { useScope } from '../hooks/useScope'; import { formatDuration } from '../utils/format-utils'; +import { parseFacetQuery, formatAttrParam } from '../utils/attribute-filter'; import { buildAppTreeNodes, buildAdminTreeNodes, @@ -694,7 +695,19 @@ function LayoutContent() { } } - return [...catalogRef.current, ...exchangeItems, ...attributeItems, ...alertingSearchData]; + const facet = parseFacetQuery(debouncedQuery ?? ''); + const facetItems: SearchResult[] = + facet + ? [{ + id: `facet-${formatAttrParam(facet)}`, + category: 'attribute' as const, + title: `Filter: ${facet.key} = "${facet.value}"${facet.value?.includes('*') ? ' (wildcard)' : ''}`, + meta: 'apply attribute filter', + path: `/exchanges?attr=${encodeURIComponent(formatAttrParam(facet))}`, + }] + : []; + + return [...facetItems, ...catalogRef.current, ...exchangeItems, ...attributeItems, ...alertingSearchData]; }, [isAdminPage, catalogRef.current, exchangeResults, debouncedQuery, alertingSearchData]); const searchData = isAdminPage ? adminSearchData : operationalSearchData;