feat: sentry

package.json

@@ -66,8 +66,10 @@
     "@kleros/archon": "^2.2.0",
     "@kleros/pnk-merkle-drop-contracts": "^0.1.0",
     "@loadable/component": "^5.5.0",
+    "@reality.eth/contracts": "3.0.0",
     "@reality.eth/reality-eth-lib": "^3.0.0",
-    "@sentry/browser": "^4.6.4",
+    "@sentry/react": "^7.37.2",
+    "@sentry/tracing": "^7.37.2",
     "antd": "^3.10.8",
     "clsx": "^1.1.1",
     "dataloader": "^1.4.0",
@@ -88,7 +90,7 @@
     "react-markdown": "^4.0.4",
     "react-minimal-pie-chart": "^3.3.0",
     "react-router-dom": "^5.2.0",
-    "react-scripts": "2.1.1",
+    "react-scripts": "^2.1.1",
     "react-time-ago": "^3.0.3",
     "shallowequal": "^1.1.0",
     "styled-components": "^5.3.0",

src/bootstrap/sentry.js

@@ -1,24 +1,15 @@
-import React, { PureComponent } from "react";
-import { init as sentryInit, showReportDialog } from "@sentry/browser";
+import React from "react";
+import * as Sentry from "@sentry/react";
+import { BrowserTracing } from "@sentry/tracing";
 import { version } from "../../package.json";
 import App from "./app";
-import ErrorBoundary from "../components/error-boundary";
 import DefaultFallback from "../components/error-fallback";
 
-export default class SentryApp extends PureComponent {
-  render() {
-    return (
-      <ErrorBoundary fallback={fallback}>
-        <App />
-      </ErrorBoundary>
-    );
-  }
-}
-
-const fallback = () => <DefaultFallback onClick={showReportDialog} />;
-
-sentryInit({
-  dsn: "https://[email protected]/1412425",
+Sentry.init({
+  dsn: process.env.REACT_APP_SENTRY_ENDPOINT,
   environment: process.env.REACT_APP_CONTEXT,
   release: `court@${version}`,
+  integrations: [new BrowserTracing()],
 });
+
+Sentry.withErrorBoundary(App, { fallback: <DefaultFallback onClick={Sentry.showReportDialog} /> });

src/index.js

@@ -1,8 +1,9 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import { register } from "./bootstrap/service-worker";
-import SentryApp from "./bootstrap/sentry";
+import "./bootstrap/sentry";
+import App from "./bootstrap/app";
 
 register();
 
-ReactDOM.render(<SentryApp />, document.getElementById("root"));
+ReactDOM.render(<App />, document.getElementById("root"));