Sentry middleware for Redux toolkit

sentryMiddleware.ts

// FYI. I added this as history data but I don't use it on actual project because `createAsyncThunk` did serialize on error object.

import { isRejected, isRejectedWithValue } from '@reduxjs/toolkit'
import type { AnyAction, Middleware, MiddlewareAPI } from '@reduxjs/toolkit'
import * as Sentry from '@sentry/react'

/**
 * Log a error and send to sentry
 */
export const sentryMiddleware: Middleware =
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  (store: MiddlewareAPI) => (next) => (action: AnyAction) => {
    if (isRejected(action) || isRejectedWithValue(action)) {
      const { error, ...reduxAction } = action
      Sentry.captureException(error.message, {
        tags: {
          action: 'redux',
        },
        extra: {
          error: error,
          reduxAction,
        },
      })
    }

    return next(action)
  }