feat(search): use new Orama components #8175
Conversation
Co-authored-by: Aviv Keller <[email protected]> Signed-off-by: Aileen Villanueva Lecuona <[email protected]>
Co-authored-by: Aviv Keller <[email protected]> Signed-off-by: Aileen Villanueva Lecuona <[email protected]>
Co-authored-by: Aviv Keller <[email protected]> Signed-off-by: Aileen Villanueva Lecuona <[email protected]>
Co-authored-by: Aviv Keller <[email protected]> Signed-off-by: Aileen Villanueva Lecuona <[email protected]>
Co-authored-by: Aviv Keller <[email protected]> Signed-off-by: Aileen Villanueva Lecuona <[email protected]>
| > | ||
| <DocumentTextIcon /> | ||
| <div> | ||
| {typeof hit.document?.pageSectionTitle === |
There was a problem hiding this comment.
Can you extract this to a proper function? Too much complexity in a single component.
| } = useSearch(); | ||
| const containerRef = useRef<HTMLDivElement>(null); | ||
|
|
||
| const clearAll = useCallback(() => { |
| dispatch({ type: 'SET_RESULTS', payload: { results: [] } }); | ||
| }, [dispatch]); | ||
|
|
||
| useEffect(() => { |
| }; | ||
| }, [clearAll]); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
I'm strongly against using querySelectors within React, it breaks the nature of React.
There was a problem hiding this comment.
Good point. I revisited the logic and removed the querySelectorAll.
I double-checked that I have access to all interactive elements directly, so each of them now handles its own tabIndex. Thanks for catching that!
There was a problem hiding this comment.
This component is just too big, please break it down into smaller parts 🙇
There was a problem hiding this comment.
I’ve refactored the component and split it into smaller, more focused parts. Let me know if you think this structure works better now!
|
|
||
| const oramaLogo = `https://website-assets.oramasearch.com/orama-when-${resolvedTheme}.svg`; | ||
|
|
||
| const clearAll = useCallback(() => { |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
There was a problem hiding this comment.
Searching on this branch is broken?
There are a few things here and there I believe need to be addressed. Some components are too big, some have way too many Effects that can become React Reducers for Lifecycle management.
I genuinely appreciate the effort done here ❤️ and 100% value the effort and time Orama team is spending on this PR 🙇
Hey @ovflowd! Thank you for your review ❤️ I'll try to manage everything soon, I'll keep you posted. |
@avivkeller I updated the workflow. Can you please confirm that you also set this env vars on github/vercel? Thanks! |
|
|
@nodejs/web-infra Can you copy the |
|
Apologies for the delays here! I was at JSConf. @g-francesca Can you please "Resolve" all the conversations that you believe have been resolved, and then re-request a review from @ovflowd? |
I've set these as |
6 participants
This PR supersedes #7971 and integrates the new Orama components, powered by the new OramaCore backend.
Description
New components - React-based to replace the old WebComponents-based ones. New backend (OramaCore instead of old Orama Cloud), all hosted and maintained on https://app.orama.com. Credentials have been shared privately with the repository maintainers on Slack.
Validation
Tested locally and on remote demo environment.
Related Issues
Check List
pnpm formatto ensure the code follows the style guide.pnpm testto check if all tests are passing.pnpm buildto check if the website builds without errors.