- saving progress;

src/components/ErrorBoundary/index.js

@@ -0,0 +1,41 @@
+import React, { Component } from 'react';
+import * as Sentry from '@sentry/browser';
+
+const LOCAL_DEVELOPMENT = process.env.REACT_APP_LOCAL_DEVELOPMENT;
+
+class ErrorBoundary extends Component {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            builderError: false
+        };
+    }
+
+    static getDerivedStateFromError(error) {
+        try {
+            if (LOCAL_DEVELOPMENT !== '1') {
+                Sentry.init({
+                    dsn: "https://e7b2134f7d816f663bb83e51b106a694@o4508381921738752.ingest.de.sentry.io/4508381935501392",
+                    environment: process.env.NODE_ENV || "development"
+                });
+
+                Sentry.captureException(error);
+            }
+        } catch (err) {
+            console.log('err')
+            console.log(err);
+        }
+        return { builderError: true };
+    }
+
+    render() {
+        if (this.state.builderError) {
+            return <div>Error</div>;
+        }
+
+        return this.props.children;
+    }
+}
+
+export default ErrorBoundary;

src/components/ProtectedRoute/index.js

@@ -3,6 +3,7 @@ import { Navigate, Outlet } from 'react-router-dom';
 
 // tools
 import AuthenticationService from '../../service/authentication-service';
+import ErrorBoundary from '../ErrorBoundary';
 
 const ProtectedRoute = () => {
 
@@ -22,7 +23,7 @@ const ProtectedRoute = () => {
         return (<Navigate to={'/'} replace/>);
     }*/
 
-    return <Outlet/>;
+    return <ErrorBoundary><Outlet/></ErrorBoundary>;
 }
 
 export default ProtectedRoute;