Skip to main content
Version: 7.x

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)
  }
}