Merge pull request #56 from sensebox/feat/add-sentry

Feat/add sentry
2021-01-20 11:56:27 +01:00 · 2021-01-20 11:56:27 +01:00 · 1963ca3051
commit 1963ca3051
parent 126dc3ecf4 0d8c30c1ee
5 changed files with 122 additions and 17 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -1502,6 +1502,88 @@
      "resolved": "https://registry.npmjs.org/@rooks/use-mutation-observer/-/use-mutation-observer-3.4.0.tgz",
      "integrity": "sha512-q10+v3WbvSt5fj55VMikTPaUZ9Yl+IYDsymodWr2+cKx0PD97VBeWYjk3xHJPqJgejBHwnrwiNkJKGFY5iW+WQ=="
    },
+    "@sentry/browser": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.0.0.tgz",
+      "integrity": "sha512-R4+MHb5FyVZCz3EVnaquvT1mwOM2MWP4gBqjYEADY5m0XWoHiJf0skFkWt8iEKJanzGbhl4PMb9gHuJj6YfVLw==",
+      "requires": {
+        "@sentry/core": "6.0.0",
+        "@sentry/types": "6.0.0",
+        "@sentry/utils": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/core": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.0.0.tgz",
+      "integrity": "sha512-afAiOachs/WfGWc9LsJBFnJMhqQVENyzfSMnf7sLRvxPAw8n7IrXY0R09MKmG0SlAnTKN2pWoQFzFF+J3NuHBA==",
+      "requires": {
+        "@sentry/hub": "6.0.0",
+        "@sentry/minimal": "6.0.0",
+        "@sentry/types": "6.0.0",
+        "@sentry/utils": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/hub": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.0.0.tgz",
+      "integrity": "sha512-s8IsW6LvEH7ACnniQcxxb/9uEyjmoQ/TAoryTJN2qyPzzrHTw8NCyMuJvK+8ivUvRViz5AvtuOFf8AJlh9lzeA==",
+      "requires": {
+        "@sentry/types": "6.0.0",
+        "@sentry/utils": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/minimal": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.0.0.tgz",
+      "integrity": "sha512-daYdEzTr+ERMwViu6RpWHOfk0oZrSNqdx+7bejTqmFHqO4pt+9ZrMiw3vinL+MWQcKXwD95uXBz6O/ryrVdPtg==",
+      "requires": {
+        "@sentry/hub": "6.0.0",
+        "@sentry/types": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/react": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-6.0.0.tgz",
+      "integrity": "sha512-GYX110NSodd8wGUbnyxemndTijM+U7dI/WjFSPOyJdLB2hzzPjJ9kUqtuobT/JlGzbWE2278WysAuySne6bUGw==",
+      "requires": {
+        "@sentry/browser": "6.0.0",
+        "@sentry/minimal": "6.0.0",
+        "@sentry/types": "6.0.0",
+        "@sentry/utils": "6.0.0",
+        "hoist-non-react-statics": "^3.3.2",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/tracing": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-6.0.0.tgz",
+      "integrity": "sha512-7Qes5godGCuvcEBxynFuRT5iiFR5aOfBdvdPmWnx29XbZKQvhjvBsDtdoVSQUmv/nCLtpH6UWeLwddFvXh3A2w==",
+      "requires": {
+        "@sentry/hub": "6.0.0",
+        "@sentry/minimal": "6.0.0",
+        "@sentry/types": "6.0.0",
+        "@sentry/utils": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "@sentry/types": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.0.0.tgz",
+      "integrity": "sha512-yueRSRGPCahuju/UMdtOt8LIIncbpwLINQd9Q8E4OXtoPpMHR6Oun8sMKCPd+Wq3piI5yRDzKkGCl+sH7mHVrA=="
+    },
+    "@sentry/utils": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.0.0.tgz",
+      "integrity": "sha512-dMMWOT69bQ4CF1R33dOnXIOyiHRWsUAON3nFVljV1JNNTDA69YwaF9f5FIT0DKpO4qhgTlElsm8WgHI9prAVEQ==",
+      "requires": {
+        "@sentry/types": "6.0.0",
+        "tslib": "^1.9.3"
+      }
+    },
    "@sheerun/mutationobserver-shim": {
      "version": "0.3.3",
      "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.3.tgz",
--- a/package.json
+++ b/package.json
@ -10,6 +10,8 @@
    "@fortawesome/free-solid-svg-icons": "^5.14.0",
    "@fortawesome/react-fontawesome": "^0.1.11",
    "@material-ui/core": "^4.11.0",
+    "@sentry/react": "^6.0.0",
+    "@sentry/tracing": "^6.0.0",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
--- a/src/components/Home.js
+++ b/src/components/Home.js
@ -125,7 +125,6 @@ class Home extends Component {
            </Grid>
            : null}
        </Grid>
-
        <HintTutorialExists />
        <Snackbar
          open={this.state.snackbar}
--- a/src/components/User/Account.js
+++ b/src/components/User/Account.js
@ -16,15 +16,15 @@ import Link from '@material-ui/core/Link';
 import Typography from '@material-ui/core/Typography';
 import Tooltip from '@material-ui/core/Tooltip';

-import { faUser, faAt, faMapMarkerAlt, faCloudSunRain, faBox } from "@fortawesome/free-solid-svg-icons";
+import { faUser, faAt, faMapMarkerAlt, faCloudSunRain, faBox, faUserTag } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";


 export class Account extends Component {

-  render(){
-    const {user} = this.props;
-    return(
+  render() {
+    const { user } = this.props;
+    return (
      <div>
        <Breadcrumbs content={[{ link: '/user', title: 'Account' }]} />

@ -32,7 +32,7 @@ export class Account extends Component {
        <Alert>
          Alle Angaben stammen von <Link color='primary' rel="noreferrer" target="_blank" href={'https://opensensemap.org/'}>openSenseMap</Link> und können dort verwaltet werden.
        </Alert>
-        <Paper style={{width: 'max-content', maxWidth: '100%'}}>
+        <Paper style={{ width: 'max-content', maxWidth: '100%' }}>
          <List>
            <ListItem>
              <Tooltip title='Nutzername'>
@ -40,7 +40,7 @@ export class Account extends Component {
                  <FontAwesomeIcon icon={faUser} />
                </ListItemIcon>
              </Tooltip>
-              <ListItemText primary={user.name} />
+              <ListItemText primary={`Name: ${user.name}`} />
            </ListItem>
            <ListItem>
              <Tooltip title='Email'>
@ -48,30 +48,36 @@ export class Account extends Component {
                  <FontAwesomeIcon icon={faAt} />
                </ListItemIcon>
              </Tooltip>
-              <ListItemText primary={user.email} />
+              <ListItemText primary={`Email: ${user.email}`} />
+            </ListItem>
+            <ListItem>
+              <ListItemIcon>
+                <FontAwesomeIcon icon={faUserTag} />
+              </ListItemIcon>
+              <ListItemText primary={`Userrolle: ${user.blocklyRole}`} />
            </ListItem>
          </List>
        </Paper>
-        <Divider style={{marginBottom: '16px', marginTop: '16px'}}/>
-        <div style={{marginBottom: '8px'}}>
+        <Divider style={{ marginBottom: '16px', marginTop: '16px' }} />
+        <div style={{ marginBottom: '8px' }}>
          {this.props.user.boxes.length < 1 ?
            <Typography>
              Du hast noch keine senseBox registriert. Besuche <Link color='primary' rel="noreferrer" target="_blank" href={'https://opensensemap.org/'}>openSenseMap</Link> um eine senseBox zu registrieren.
            </Typography>
-          : <Typography style={{fontWeight: 'bold', fontSize: '1.1rem'}}>
-            Du hast {this.props.user.boxes.length} {this.props.user.boxes.length === 1 ? 'senseBox' : 'senseBoxen'} registriert:
+            : <Typography style={{ fontWeight: 'bold', fontSize: '1.1rem' }}>
+              Du hast {this.props.user.boxes.length} {this.props.user.boxes.length === 1 ? 'senseBox' : 'senseBoxen'} registriert:
          </Typography>}
        </div>
        <Grid container spacing={2}>
          {this.props.user.boxes.map((box, i) => {
-            var sensors = box.sensors.map(sensor => sensor.title );
+            var sensors = box.sensors.map(sensor => sensor.title);
            return (
              <Grid item xs={12} sm={6} md={4} xl={3} key={i}>
                <Link rel="noreferrer" target="_blank" href={`https://opensensemap.org/explore/${box._id}`} color="primary" style={{ textDecoration: 'none', color: 'inherit' }}>
                  <Paper>
                    <List>
                      <ListItem>
-                        <Typography style={{fontWeight: 'bold', fontSize: '1.6rem'}}>{box.name}</Typography>
+                        <Typography style={{ fontWeight: 'bold', fontSize: '1.6rem' }}>{box.name}</Typography>
                      </ListItem>
                      <ListItem>
                        <Tooltip title='Modell'>
@ -80,7 +86,7 @@ export class Account extends Component {
                          </ListItemIcon>
                        </Tooltip>
                        <div>
-                          <Typography style={{fontWeight: 'bold', marginRight: '4px'}}>Modell: </Typography>
+                          <Typography style={{ fontWeight: 'bold', marginRight: '4px' }}>Modell: </Typography>
                          <Typography>{box.model}</Typography>
                        </div>
                      </ListItem>
@ -91,7 +97,7 @@ export class Account extends Component {
                          </ListItemIcon>
                        </Tooltip>
                        <div>
-                          <Typography style={{fontWeight: 'bold', marginRight: '4px'}}>Standort: </Typography>
+                          <Typography style={{ fontWeight: 'bold', marginRight: '4px' }}>Standort: </Typography>
                          <Typography>{`${box.exposure} (lon: ${box.currentLocation.coordinates[0]}, lat: ${box.currentLocation.coordinates[1]})`}</Typography>
                        </div>
                      </ListItem>
@ -102,7 +108,7 @@ export class Account extends Component {
                          </ListItemIcon>
                        </Tooltip>
                        <div>
-                          <Typography style={{fontWeight: 'bold', marginRight: '4px'}}>Sensoren: </Typography>
+                          <Typography style={{ fontWeight: 'bold', marginRight: '4px' }}>Sensoren: </Typography>
                          <Typography>{sensors.join(', ')}</Typography>
                        </div>
                      </ListItem>
--- a/src/index.js
+++ b/src/index.js
@ -3,6 +3,22 @@ import ReactDOM from 'react-dom';
 import './index.css';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
+import * as Sentry from "@sentry/react";
+import { Integrations } from "@sentry/tracing";
+
+
+Sentry.init({
+  dsn: "https://ffe5d54461f64c46b4bed5d77c130d6f@o507523.ingest.sentry.io/5598758",
+  autoSessionTracking: true,
+  integrations: [
+    new Integrations.BrowserTracing(),
+  ],
+
+  // We recommend adjusting this value in production, or using tracesSampler
+  // for finer control
+  tracesSampleRate: 1.0,
+});
+

 ReactDOM.render(
  <React.StrictMode>