React error boundary component with Sentry integration

ErrorBoundary.js

import React from "react";
import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: process.env.REACT_APP_SENTRY_DNS
});

export default class ErrorBoundary extends React.Component {
  state = {
    hasError: false,
    errorInfo: "",
    error: ""
  };

  componentDidCatch(error, errorInfo) {
    this.setState({
      error,
      errorInfo,
      hasError: true
    });

    Sentry.withScope(scope => {
      Object.keys(errorInfo).forEach(key => {
        scope.setExtra(key, errorInfo[key]);
      });
      Sentry.captureException(error);
    });
  }

  render() {
    return this.state.hasError ? (
      <div>
        Something went wrong!
      </div>
    ) : (
      this.props.children
    );
  }
}