Clean up content-search component and re-search when content types change
Fixes #213
Description of the Change
This makes several changes that will improve the performance of the ContentSearch component and make it behave more predictably. It also modifies the component to account for changes to the contentTypes prop. I think this should just be phase 1 because the component is still too large, and the use of useRef to detect changes to the contentTypes prop is not ideal (component should be rearchitected to handle changes to the prop with effect hooks).
I recommend covering this with tests. I made an attempt but could tell it was going to be a rabbit-hole so didn't stick with it 😄 With the size of this change I would understand holding this until I or someone else can write those tests.
Changes:
- Reduce unnecessary renders by (a) moving variables not reliant upon state or props up to the top level of the module, and (b) move some functions to the top level of the module (what were previously useCallback dependencies now passed in as arguments).
- Put the mounted ref to use (it was previously never used)
- Added
fetchedInitialResultsstate to eliminate the need to ignore the exhaustive deps ESLint rule - Replaced .then Promise syntax with async/await
- Wrap some complex logic that was running on every render in a useMemo
How to test the Change
See the test block I shared in #213. A new query should run when you change the content type.
Additionally, some regression testing should be performed with this branch against existing features using the ContentSearch omponent.
Changelog Entry
Clean up ContentSearch component and handle changes to the contentType prop
Credits
Props @johnwatkins0
Checklist:
- [x] I agree to follow this project's Code of Conduct.
- [ ] I have updated the documentation accordingly.
- [ ] I have added tests to cover my change.
- [ ] All new and existing tests pass.
Size Change: +507 B (+1%)
Total Size: 52.7 kB
| Filename | Size | Change |
|---|---|---|
dist/index.js |
52.7 kB | +507 B (+1%) |
Closing in favor of #326