I was curious what the best pattern for adding functionality to loaders and actions was? For instance, say if I wanted to wrap all of them with a Sentry context and error system, or if I wanted to capture logs to forward them somewhere. If you'll forgive the parallel, with Next the solution is to add withSystem() wrappers in the next.config.js file, but I'm not sure what the recommended Remix pattern is!
#Loader Wrappers or Middleware
keen chasm
green tree
@keen chasm there's an official Sentry adapter for Remix: https://docs.sentry.io/platforms/javascript/guides/remix/
AFAIK there is no middleware system in Remix (yet). Basically, you handle all of your stuff manually in either: the action or loader itself, error boundary, or catch boundary.
If you're using Express, you could catch all responses in your server.ts coming through Remix, and do some additional work like handling responses with specific status codes/specific routes/etc.
keen chasm
gotcha, I'll look at how they did it! Thanks 😄
green tree
That's what Sentry is basically doing under the hood:
You're welcome! Digging up their source code might help as well 😉
final nova
you can't wrap loaders and actions in high order functions, it's part of the server-side constrains Remix has https://remix.run/docs/en/v1/guides/constraints#higher-order-functions
so doing withSentry(loader) will cause compiler issues