WIP: Update sentry

app/client.js

@@ -29,7 +29,7 @@ import { setRelayEnvironment } from '@digitransit-search-util/digitransit-search
 
 import { historyMiddlewares, render } from './routes';
 
-import Raven from './util/Raven';
+import Sentry from './util/Sentry';
 import configureMoment from './util/configure-moment';
 import StoreListeningIntlProvider from './util/StoreListeningIntlProvider';
 import MUITheme from './MuiTheme';
@@ -57,18 +57,18 @@ window.debug = debug; // Allow _debug.enable('*') in browser console
 // TODO: this is an ugly hack, but required due to cyclical processing in app
 const { config } = window.state.context.plugins['extra-context-plugin'];
 const app = appCreator(config);
-const raven = Raven(config.SENTRY_DSN);
-const addRaven = c => {
-  c.raven = raven; // eslint-disable-line no-param-reassign
+const sentry = Sentry(config.SENTRY_DSN);
+const addSentry = c => {
+  c.sentry = sentry; // eslint-disable-line no-param-reassign
 };
 
-const ravenPlugin = {
-  name: 'RavenPlugin',
-  plugContext: plugContext(addRaven),
+const sentryPlugin = {
+  name: 'SentryPlugin',
+  plugContext: plugContext(addSentry),
 };
 
 // Add plugins
-app.plug(ravenPlugin);
+app.plug(sentryPlugin);
 
 const getParams = query => {
   if (!query) {
@@ -215,7 +215,7 @@ async function init() {
   });
 
   const ContextProvider = provideContext(StoreListeningIntlProvider, {
-    raven: PropTypes.object,
+    sentry: PropTypes.object,
     config: PropTypes.object,
     headers: PropTypes.object,
   });

app/component/ErrorBoundary.js

@@ -8,7 +8,7 @@ export default class ErrorBoundary extends React.Component {
   static propTypes = { children: PropTypes.node.isRequired };
 
   static contextTypes = {
-    raven: PropTypes.shape({
+    sentry: PropTypes.shape({
       captureException: PropTypes.func.isRequired,
     }),
   };
@@ -24,8 +24,11 @@ export default class ErrorBoundary extends React.Component {
       return;
     }
     this.setState({ error });
-    if (this.context.raven) {
-      this.context.raven.captureException(error, { extra: errorInfo });
+    if (this.context.sentry) {
+      this.context.sentry.withScope(scope => {
+        scope.setExtra(errorInfo);
+        this.context.sentry.captureException(error);
+      });
     }
   }
 
@@ -45,7 +48,7 @@ export default class ErrorBoundary extends React.Component {
               <FormattedMessage id="try-again" defaultMessage="Try again ›" />
             </button>
             {/*
-              <button onClick(() => this.context.raven.lastEventId() && this.context.raven.showReportDialog())>
+              <button onClick(() => this.context.sentry.getCurrentHub().lastEventId() && this.context.sentry.showReportDialog())>
                 <FormattedMessage id="tell-us-what-happened" defaultMessage="Tell us what happened" />
               </button>
               */}

app/util/Sentry.js

@@ -0,0 +1,17 @@
+import { COMMIT_ID } from '../buildInfo';
+
+export default function getSentry(sentryDsn) {
+  if (sentryDsn) {
+    /* eslint-disable global-require */
+    const Sentry = require('@sentry/browser');
+    Sentry.init({
+      dsn: sentryDsn,
+      release: COMMIT_ID,
+      attachStacktrace: true,
+      tracesSampleRate: 0.1,
+    });
+
+    return Sentry;
+  }
+  return undefined;
+}

package.json

@@ -132,6 +132,8 @@
     "@hsl-fi/site-header": "1.0.1",
     "@mapbox/sphericalmercator": "1.1.0",
     "@mapbox/vector-tile": "1.3.1",
+    "@sentry/node": "5.27.3",
+    "@sentry/browser": "5.27.3",
     "babel-plugin-dynamic-import-node": "2.3.3",
     "babel-plugin-relay": "10.0.1",
     "body-parser": "1.19.0",
@@ -176,8 +178,6 @@
     "polyfill-library": "3.96.0",
     "polyline-encoded": "0.0.9",
     "prop-types": "15.7.2",
-    "raven": "2.6.4",
-    "raven-js": "3.27.0",
     "react": "16.13.0",
     "react-autosuggest": "10.0.3",
     "react-autowhatever": "10.2.1",

server/server.js

@@ -18,14 +18,14 @@ const proxy = require('express-http-proxy');
 
 global.self = { fetch: global.fetch };
 
-let Raven;
+let Sentry;
 const devhost = '';
 
 if (process.env.NODE_ENV === 'production' && process.env.SENTRY_SECRET_DSN) {
-  Raven = require('raven');
-  Raven.config(process.env.SENTRY_SECRET_DSN, {
-    captureUnhandledRejections: true,
-  }).install();
+  Sentry = require('@sentry/node');
+  Sentry.init({
+    dsn: process.env.SENTRY_SECRET_DSN,
+  });
 } else {
   process.on('unhandledRejection', (reason, p) => {
     console.log('Unhandled Rejection at:', p, 'reason:', reason);
@@ -126,15 +126,15 @@ function onError(err, req, res) {
   res.end(err.message + err.stack);
 }
 
-function setUpRaven() {
+function setUpSentry() {
   if (process.env.NODE_ENV === 'production' && process.env.SENTRY_SECRET_DSN) {
-    app.use(Raven.requestHandler());
+    app.use(Sentry.Handlers.requestHandler());
   }
 }
 
 function setUpErrorHandling() {
   if (process.env.NODE_ENV === 'production' && process.env.SENTRY_SECRET_DSN) {
-    app.use(Raven.errorHandler());
+    app.use(Sentry.Handlers.errorHandler());
   }
 
   app.use(onError);
@@ -272,7 +272,7 @@ function startServer() {
 if (process.env.OIDC_CLIENT_ID) {
   setUpOpenId();
 }
-setUpRaven();
+setUpSentry();
 setUpStaticFolders();
 setUpMiddleware();
 setUpRoutes();