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;