add blueprint extension for result type filter in search plugin

Signed-off-by: Mark Dunphy <markd@spotify.com>

plugins/search/report-alpha.api.md

@@ -22,27 +22,6 @@ const _default: FrontendPlugin<
   },
   {},
   {
-    'nav-item:search': ExtensionDefinition<{
-      kind: 'nav-item';
-      name: undefined;
-      config: {};
-      configInput: {};
-      output: ConfigurableExtensionDataRef<
-        {
-          title: string;
-          icon: IconComponent;
-          routeRef: RouteRef<undefined>;
-        },
-        'core.nav-item.target',
-        {}
-      >;
-      inputs: {};
-      params: {
-        title: string;
-        icon: IconComponent;
-        routeRef: RouteRef<undefined>;
-      };
-    }>;
     'api:search': ExtensionDefinition<{
       kind: 'api';
       name: undefined;
@@ -98,6 +77,21 @@ const _default: FrontendPlugin<
             optional: false;
           }
         >;
+        resultTypes: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            {
+              value: string;
+              name: string;
+              icon: JSX.Element;
+            },
+            'search.filters.result-types.type',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
       };
       kind: 'page';
       name: undefined;
@@ -107,6 +101,27 @@ const _default: FrontendPlugin<
         routeRef?: RouteRef<AnyRouteRefParams> | undefined;
       };
     }>;
+    'nav-item:search': ExtensionDefinition<{
+      kind: 'nav-item';
+      name: undefined;
+      config: {};
+      configInput: {};
+      output: ConfigurableExtensionDataRef<
+        {
+          title: string;
+          icon: IconComponent;
+          routeRef: RouteRef<undefined>;
+        },
+        'core.nav-item.target',
+        {}
+      >;
+      inputs: {};
+      params: {
+        title: string;
+        icon: IconComponent;
+        routeRef: RouteRef<undefined>;
+      };
+    }>;
   }
 >;
 export default _default;
@@ -184,6 +199,21 @@ export const searchPage: ExtensionDefinition<{
         optional: false;
       }
     >;
+    resultTypes: ExtensionInput<
+      ConfigurableExtensionDataRef<
+        {
+          value: string;
+          name: string;
+          icon: JSX.Element;
+        },
+        'search.filters.result-types.type',
+        {}
+      >,
+      {
+        singleton: false;
+        optional: false;
+      }
+    >;
   };
   kind: 'page';
   name: undefined;

plugins/search/src/alpha.tsx

@@ -61,7 +61,10 @@ import {
 } from '@backstage/plugin-search-react';
 import { SearchResult } from '@backstage/plugin-search-common';
 import { searchApiRef } from '@backstage/plugin-search-react';
-import { SearchResultListItemBlueprint } from '@backstage/plugin-search-react/alpha';
+import {
+  SearchResultListItemBlueprint,
+  SearchFilterResultTypeBlueprint,
+} from '@backstage/plugin-search-react/alpha';
 
 import { rootRouteRef } from './plugin';
 import { SearchClient } from './apis';
@@ -106,6 +109,9 @@ export const searchPage = PageBlueprint.makeWithOverrides({
   },
   inputs: {
     items: createExtensionInput([SearchResultListItemBlueprint.dataRefs.item]),
+    resultTypes: createExtensionInput([
+      SearchFilterResultTypeBlueprint.dataRefs.resultType,
+    ]),
   },
   factory(originalFactory, { config, inputs }) {
     return originalFactory({
@@ -124,6 +130,10 @@ export const searchPage = PageBlueprint.makeWithOverrides({
           );
         };
 
+        const resultTypes = inputs.resultTypes.map(item =>
+          item.get(SearchFilterResultTypeBlueprint.dataRefs.resultType),
+        );
+
         const Component = () => {
           const classes = useSearchPageStyles();
           const { isMobile } = useSidebarPinState();
@@ -155,7 +165,7 @@ export const searchPage = PageBlueprint.makeWithOverrides({
                             name: 'Documentation',
                             icon: <DocsIcon />,
                           },
-                        ]}
+                        ].concat(resultTypes)}
                       />
                       <Paper className={classes.filters}>
                         {types.includes('techdocs') && (