use error.tsx .
But, if you build it, the error details won't be shown for security reasons.
https://nextjs.org/docs/app/building-your-application/routing/error-handling#handling-server-errors

But wouldn't the error.tsx be for the entire screen? I didn't want to block the entire screen if there was an error in just one component.

I see. Can we use ErrorBoundary, or maybe return an error component with try..catch?

If an error is returned in catch, render an error component?

Yes

Do you have any example you can give me?

Try {
return ()
} Catch {
return (error)
}

we are using next app router and are showing errors in componentA that’s being thrown in componentB. We do this by using a context/provider and assign each error with an id that is added or removed from a string array. Then use functions such as clearError, setError and hasGlobalError to handle. Feel free to reach out for more info