Currently I'm trying to setup a nextjs app with firebase as backend. Because firebase cant handle a fulltext search, I want to use typesense. They provide a really nice documentation how to set it up: https://typesense.org/docs/guide/firebase-full-text-search.html
For typesene I already set up docker containers for all my 3 environment (the docker typesense provides). To request information back from the docker I use the typesense-instantsearch-adapter- npm Package. In the app I have different user roles, so not everyone can see all indexed data - therefore I use a scoped search which is possible through the apiKey I generate when the users logs in (scoped api key). The apiKey therefore is variable depending on the user and the user role. My current setup works fine and also the search is already working.
The only problem I have is, that I cannot catch the errors the <InstantSearch>-Component is throwing. For example if the docker is offline or if the generated apiKey is not valid.
I tried multiple solutions, but could not find a proper solution:
- Error boundary around the component (react docu)
- Error boundary npm package
- Try/catch block around the component
I found a codesandbox that has a quit similar setup. The sandbox is using algolia instead of typesense, but the error that pops up is the same: https://codesandbox.io/s/fib6jm?file=/App.tsx:1043-1056
- Go to App.tsx
- line 38
- remove string
Uncaught, unspecified "error" event. ([object Object])pops up
How can I catch / access this error to reroute or show an error screen?