diff --git a/.changeset/afraid-carpets-know.md b/.changeset/afraid-carpets-know.md
new file mode 100644
index 0000000000..94a5452606
--- /dev/null
+++ b/.changeset/afraid-carpets-know.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-search': patch
+---
+
+Add Optional Props to Override Icon for SidebarSearch and SidebarSearchModal Component
diff --git a/plugins/search/api-report.md b/plugins/search/api-report.md
index 3db26579e3..13a9b15ea1 100644
--- a/plugins/search/api-report.md
+++ b/plugins/search/api-report.md
@@ -8,6 +8,7 @@
import { ApiRef } from '@backstage/core-plugin-api';
import { AsyncState } from 'react-use/lib/useAsync';
import { BackstagePlugin } from '@backstage/core-plugin-api';
+import { IconComponent } from '@backstage/core-plugin-api';
import { IndexableDocument } from '@backstage/search-common';
import { JsonObject } from '@backstage/types';
import { default as React_2 } from 'react';
@@ -213,12 +214,28 @@ export const SearchType: ({
// Warning: (ae-missing-release-tag) "SidebarSearch" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
//
// @public (undocumented)
-export const SidebarSearch: () => JSX.Element;
+export const SidebarSearch: (props: SidebarSearchProps) => JSX.Element;
// Warning: (ae-missing-release-tag) "SidebarSearchModal" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
//
// @public (undocumented)
-export const SidebarSearchModal: () => JSX.Element;
+export const SidebarSearchModal: (
+ props: SidebarSearchModalProps,
+) => JSX.Element;
+
+// Warning: (ae-missing-release-tag) "SidebarSearchModalProps" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
+//
+// @public (undocumented)
+export type SidebarSearchModalProps = {
+ icon?: IconComponent;
+};
+
+// Warning: (ae-missing-release-tag) "SidebarSearchProps" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
+//
+// @public (undocumented)
+export type SidebarSearchProps = {
+ icon?: IconComponent;
+};
// Warning: (ae-forgotten-export) The symbol "SearchContextValue" needs to be exported by the entry point index.d.ts
// Warning: (ae-missing-release-tag) "useSearch" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
diff --git a/plugins/search/src/components/SidebarSearch/SidebarSearch.tsx b/plugins/search/src/components/SidebarSearch/SidebarSearch.tsx
index 883829d44e..9f6be2333f 100644
--- a/plugins/search/src/components/SidebarSearch/SidebarSearch.tsx
+++ b/plugins/search/src/components/SidebarSearch/SidebarSearch.tsx
@@ -19,9 +19,13 @@ import { useNavigate } from 'react-router-dom';
import { rootRouteRef } from '../../plugin';
import { SidebarSearchField } from '@backstage/core-components';
-import { useRouteRef } from '@backstage/core-plugin-api';
+import { useRouteRef, IconComponent } from '@backstage/core-plugin-api';
-export const SidebarSearch = () => {
+export type SidebarSearchProps = {
+ icon?: IconComponent;
+};
+
+export const SidebarSearch = (props: SidebarSearchProps) => {
const searchRoute = useRouteRef(rootRouteRef);
const navigate = useNavigate();
const handleSearch = useCallback(
@@ -33,5 +37,11 @@ export const SidebarSearch = () => {
[navigate, searchRoute],
);
- return ;
+ return (
+
+ );
};
diff --git a/plugins/search/src/components/SidebarSearch/index.ts b/plugins/search/src/components/SidebarSearch/index.ts
index 437234c5b4..1340bfaa9a 100644
--- a/plugins/search/src/components/SidebarSearch/index.ts
+++ b/plugins/search/src/components/SidebarSearch/index.ts
@@ -14,3 +14,4 @@
* limitations under the License.
*/
export { SidebarSearch } from './SidebarSearch';
+export type { SidebarSearchProps } from './SidebarSearch';
diff --git a/plugins/search/src/components/SidebarSearchModal/SidebarSearchModal.tsx b/plugins/search/src/components/SidebarSearchModal/SidebarSearchModal.tsx
index ae38526c9d..b8f20de67d 100644
--- a/plugins/search/src/components/SidebarSearchModal/SidebarSearchModal.tsx
+++ b/plugins/search/src/components/SidebarSearchModal/SidebarSearchModal.tsx
@@ -16,17 +16,23 @@
import React from 'react';
import SearchIcon from '@material-ui/icons/Search';
import { SidebarItem } from '@backstage/core-components';
+import { IconComponent } from '@backstage/core-plugin-api';
import { SearchModal } from '../SearchModal';
import { useSearch } from '../SearchContext';
-export const SidebarSearchModal = () => {
+export type SidebarSearchModalProps = {
+ icon?: IconComponent;
+};
+
+export const SidebarSearchModal = (props: SidebarSearchModalProps) => {
const { open, toggleModal } = useSearch();
+ const Icon = props.icon ? props.icon : SearchIcon;
return (
<>
diff --git a/plugins/search/src/components/SidebarSearchModal/index.ts b/plugins/search/src/components/SidebarSearchModal/index.ts
index 849180878d..f667f20da2 100644
--- a/plugins/search/src/components/SidebarSearchModal/index.ts
+++ b/plugins/search/src/components/SidebarSearchModal/index.ts
@@ -14,3 +14,4 @@
* limitations under the License.
*/
export { SidebarSearchModal } from './SidebarSearchModal';
+export type { SidebarSearchModalProps } from './SidebarSearchModal';
diff --git a/plugins/search/src/index.ts b/plugins/search/src/index.ts
index f5c58450fc..bfc9c52b74 100644
--- a/plugins/search/src/index.ts
+++ b/plugins/search/src/index.ts
@@ -36,7 +36,11 @@ export {
SidebarSearch,
useSearch,
} from './components';
-export type { SearchModalProps } from './components';
+export type {
+ SearchModalProps,
+ SidebarSearchModalProps,
+ SidebarSearchProps,
+} from './components';
export type { FiltersState } from './components';
export {
DefaultResultListItem,