paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 40 Packages Projects Releases Wiki Activity

[Search] Standardizes input search components (#8532)

Browse Source 
* refactor(plugin-search): customize search bar components

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* refactor(plugin-search): use search bar in search modal

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* refactor(plugin-search): customize home page search bar

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* chore(plugin-search): update api reports

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* chore: add changeset file

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* apply review suggestions

Signed-off-by: Camila Belo <camilaibs@gmail.com>

* increase default debounceTime and remove prop from SearchBar in SearchModal + SearchPage in app

Signed-off-by: Emma Indal <emmai@spotify.com>

* update test using default debounce time

Signed-off-by: Emma Indal <emmai@spotify.com>

* add changeset for create-app

Signed-off-by: Emma Indal <emmai@spotify.com>

* fix exports after rebase

Signed-off-by: Emma Indal <emmai@spotify.com>

Co-authored-by: Emma Indal <emmai@spotify.com>
This commit is contained in:
Camila Belo
2021-12-23 12:05:26 +01:00
committed by GitHub
parent 9d31470853
commit 49a696d720
12 changed files with 215 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/bright-dancers-tickle.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/create-app': patch
---
debounceTime prop is removed from the SearchBar component in the SearchPage as the default is set to 200. The prop is safe to remove and makes it easier to stay up to date with any changes in the future.
.changeset/search-seahorses-tie.md
+15
View File
@@ -0,0 +1,15 @@
---
'@backstage/plugin-search': patch
---
Standardizes the component used as a search box in the search modal and in the composable home page.
After these changes, all search boxes exported by the search plugin are based on the `<SearchBarBase />` component, and this one is based on the `<InputBase />` component of the Material UI. This means that when you use SearchBarBase or one of its derived components (like `SearchBar` and `HomePageSearchBar`) you can pass all properties accepted by InputBase that have not been replaced by the props type of those components.
For example:
```jsx
<SearchInputBase color="secondary" debouceTime={500} />
```
The `color` property is inherited from `InputBaseProps` type and `debouceTime` defined by `SearchBarBaseProps`.