Skip to main content
Version: 8.3

Sentry

Setup Sentry error and performance monitoring across your Redwood application.

From your command line, run:

yarn redwood setup monitoring sentry

This command installs and sets up @sentry/node and @sentry/react, enabling Prisma and Browser tracing to capture 100% of events. The following sections detail how you may further integrate Sentry in your Redwood application.

Sentry Envelop Plugin

The setup command will install and attempt to setup the @envelop/sentry plugin in your application's GraphQL handler. If there is a problem installing it, the following can be used to do so manually.

api/src/functions/graphql.js
import { useSentry } from '@envelop/sentry'

import { createGraphQLHandler } from '@redwoodjs/graphql-server'

import directives from 'src/directives/**/*.{js,ts}'
import sdls from 'src/graphql/**/*.sdl.{js,ts}'
import services from 'src/services/**/*.{js,ts}'

import 'src/lib/sentry'

...

export const handler = createGraphQLHandler({
directives,
sdls,
services,
extraPlugins: [useSentry()],
...
})

Setting the current user

You can associate error and performance events with a unique identity using Sentry.setUser. Below is an example of doing so on the API by setting the identity to the user returned by getCurrentUser.

api/src/lib/auth.js
import Sentry from 'src/lib/sentry'

export const getCurrentUser = async (...) => {
const user = await db.user.findUnique(...)

Sentry.setUser(user)

...
}

Below we set the current user on the web-side from within a layout. Note that the useEffect dependency array may vary depending on where you place Sentry.setUser in your own application.

web/src/layouts/SentryLayout/SentryLayout.jsx
import { useEffect } from 'react'

import { useAuth } from 'src/lib/auth'
import Sentry from 'src/lib/sentry'

const SentryLayout = ({ children }) => {
const { currentUser } = useAuth()

useEffect(() => Sentry.setUser(currentUser), [currentUser])

return <>{children}</>
}

export default SentryLayout

Capturing exceptions

You can make use of Sentry to capture exceptions which occur while executing API Functions.

api/src/functions/foo.{js,ts}
import Sentry from 'src/lib/sentry'

export const handler = async (event, context) => {
try {
...
} catch (err) {
Sentry.captureException(err)
}
}