Merge branch 'GREG-227-frontend-sentry' into 'master'

Report frontend errors to sentry

See merge request !305

frontend/package-lock.json

@@ -16,6 +16,7 @@
         "@mui/system": "^5.0.5",
         "@mui/utils": "^5.0.1",
         "@navikt/fnrvalidator": "^1.1.4",
+        "@sentry/browser": "^6.18.2",
         "@testing-library/jest-dom": "^5.14.1",
         "@testing-library/react": "^12.1.2",
         "@testing-library/user-event": "^13.5.0",
@@ -3704,6 +3705,106 @@
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
       "integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw=="
     },
+    "node_modules/@sentry/browser": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.18.2.tgz",
+      "integrity": "sha512-EsqKSNboi2gOiMuEwQranLucxrARi00y2vgUnaPXcqTKTlVlHDetoWHvq8/r29idA1JHGka5tDrwrmWccWIkrg==",
+      "dependencies": {
+        "@sentry/core": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
+    "node_modules/@sentry/core": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.18.2.tgz",
+      "integrity": "sha512-r5ad/gq5S/JHc9sd5CUhZQT9ojQ+f+thk/AoGeGawX/8HURZYAgIqD565d6FK0VsZEDkdRMl58z1Qon20h3y1g==",
+      "dependencies": {
+        "@sentry/hub": "6.18.2",
+        "@sentry/minimal": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/core/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
+    "node_modules/@sentry/hub": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.18.2.tgz",
+      "integrity": "sha512-d0AugekMkbnN12b4EXMjseJxtLPc9S20DGobCPUb4oAQT6S2oDQEj1jwP6PQ5vtgyy+GMYWxBMgqAQ4pjVYISQ==",
+      "dependencies": {
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/hub/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
+    "node_modules/@sentry/minimal": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.18.2.tgz",
+      "integrity": "sha512-n7KYuo34W2LxE+3dnZ47of7XHuORINCnXq66XH72eoj67tf0XeWbIhEJrYGmoLRyRfoCYYrBLWiDl/uTjLzrzQ==",
+      "dependencies": {
+        "@sentry/hub": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/minimal/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
+    "node_modules/@sentry/types": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.18.2.tgz",
+      "integrity": "sha512-WzpJf/Q5aORTzrSwer/As1NlO90dBAQpaHV2ikDDKqOyMWEgjKb5/4gh59p9gH8JMMnLetP1AvQel0fOj5UnUw==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/utils": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.18.2.tgz",
+      "integrity": "sha512-EC619jesknyu4xpwud5WC/5odYLz6JUy7OSFy5405PpdGeh/m8XUvuJAx4zDx0Iz/Mlk0S1Md+ZcQwqkv39dkw==",
+      "dependencies": {
+        "@sentry/types": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/utils/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "node_modules/@sinonjs/commons": {
       "version": "1.8.3",
       "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-1.8.3.tgz",
@@ -26654,6 +26755,98 @@
         }
       }
     },
+    "@sentry/browser": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.18.2.tgz",
+      "integrity": "sha512-EsqKSNboi2gOiMuEwQranLucxrARi00y2vgUnaPXcqTKTlVlHDetoWHvq8/r29idA1JHGka5tDrwrmWccWIkrg==",
+      "requires": {
+        "@sentry/core": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "@sentry/core": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.18.2.tgz",
+      "integrity": "sha512-r5ad/gq5S/JHc9sd5CUhZQT9ojQ+f+thk/AoGeGawX/8HURZYAgIqD565d6FK0VsZEDkdRMl58z1Qon20h3y1g==",
+      "requires": {
+        "@sentry/hub": "6.18.2",
+        "@sentry/minimal": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "@sentry/hub": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.18.2.tgz",
+      "integrity": "sha512-d0AugekMkbnN12b4EXMjseJxtLPc9S20DGobCPUb4oAQT6S2oDQEj1jwP6PQ5vtgyy+GMYWxBMgqAQ4pjVYISQ==",
+      "requires": {
+        "@sentry/types": "6.18.2",
+        "@sentry/utils": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "@sentry/minimal": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.18.2.tgz",
+      "integrity": "sha512-n7KYuo34W2LxE+3dnZ47of7XHuORINCnXq66XH72eoj67tf0XeWbIhEJrYGmoLRyRfoCYYrBLWiDl/uTjLzrzQ==",
+      "requires": {
+        "@sentry/hub": "6.18.2",
+        "@sentry/types": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "@sentry/types": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.18.2.tgz",
+      "integrity": "sha512-WzpJf/Q5aORTzrSwer/As1NlO90dBAQpaHV2ikDDKqOyMWEgjKb5/4gh59p9gH8JMMnLetP1AvQel0fOj5UnUw=="
+    },
+    "@sentry/utils": {
+      "version": "6.18.2",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.18.2.tgz",
+      "integrity": "sha512-EC619jesknyu4xpwud5WC/5odYLz6JUy7OSFy5405PpdGeh/m8XUvuJAx4zDx0Iz/Mlk0S1Md+ZcQwqkv39dkw==",
+      "requires": {
+        "@sentry/types": "6.18.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
     "@sinonjs/commons": {
       "version": "1.8.3",
       "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-1.8.3.tgz",

frontend/package.json

@@ -11,6 +11,7 @@
     "@mui/system": "^5.0.5",
     "@mui/utils": "^5.0.1",
     "@navikt/fnrvalidator": "^1.1.4",
+    "@sentry/browser": "^6.18.2",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^12.1.2",
     "@testing-library/user-event": "^13.5.0",

frontend/src/appConfig.ts

@@ -62,3 +62,10 @@ export const documentationLinkEn: string =
   env.REACT_APP_DOCUMENTATION_LINK_EN as string
 export const responsibleOrganizationLinkEn: string =
   env.REACT_APP_RESPONSIBLE_ORGANIZATION_LINK_EN as string
+
+/* Sentry */
+const sentryPublicKey: string = env.REACT_APP_SENTRY_PUBLIC_KEY as string
+const sentryProjectId: string = env.REACT_APP_SENTRY_PROJECT_ID as string
+const sentryHost: string = env.REACT_APP_SENTRY_HOST as string
+export const sentryEnabled: boolean = sentryHost !== undefined
+export const sentryDsn: string = `https://${sentryPublicKey}@${sentryHost}/${sentryProjectId}`

frontend/src/index.tsx

@@ -6,15 +6,25 @@ import AdapterDateFns from '@mui/lab/AdapterDateFns'
 import { LocalizationProvider } from '@mui/lab'
 import { BrowserRouter as Router } from 'react-router-dom'
 import 'i18n'
+import * as Sentry from '@sentry/browser'
 
 import getTheme from 'themes'
 import App from 'routes'
 import { UserProvider } from 'providers'
+import { sentryEnabled, sentryDsn, appVersion } from 'appConfig'
 import reportWebVitals from './reportWebVitals'
 import FeatureProvider from './providers/featureProvider'
 
 import './index.css'
 
+// Initialize sentry
+if (sentryEnabled) {
+  Sentry.init({
+    dsn: sentryDsn,
+    release: appVersion,
+  })
+}
+
 function appRoot() {
   return (
     <React.StrictMode>