- Merge and update

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/App/App.container.jsx

@@ -9,6 +9,7 @@ import {useTranslation} from "react-i18next";
 import GlobalLoadingBar from "../components/global-loading-bar/global-loading-bar.component";
 import client from "../utils/GraphQLClient";
 import App from "./App";
+import * as Sentry from "@sentry/react";
 
 import themeProvider from "./themeProvider";
 
@@ -23,7 +24,7 @@ const config = {
 export const factory = SplitSdk(config);
 
 
-export default function AppContainer() {
+function AppContainer() {
     const {t} = useTranslation();
 
     return (
@@ -48,3 +49,5 @@ export default function AppContainer() {
         </ApolloProvider>
     );
 }
+
+export default Sentry.withProfiler(AppContainer);

client/src/components/error-boundary/error-boundary.component.jsx

@@ -2,7 +2,7 @@ import { Button, Col, Collapse, Result, Row, Space } from "antd";
 import React from "react";
 import { withTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
-
+import * as Sentry from "@sentry/react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import {
@@ -138,7 +138,6 @@ class ErrorBoundary extends React.Component {
   }
 }
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(withTranslation()(ErrorBoundary));
+export default Sentry.withErrorBoundary(
+  connect(mapStateToProps, mapDispatchToProps)(withTranslation()(ErrorBoundary))
+);

client/src/components/production-board-kanban/production-board-kanban.component.jsx

@@ -116,7 +116,7 @@ export function ProductionBoardKanbanComponent({
       // console.log("==> New Card is somewhere in the middle");
       movedCardNewKanbanParent = newChildCard.kanbanparent;
     } else {
-      throw new Error("==> !!!!!!Couldn't find a parent.!!!! <==");
+      console.log("==> !!!!!!Couldn't find a parent.!!!! <==");
     }
     const newChildCardNewParent = newChildCard ? card.id : null;
     const update = await client.mutate({
@@ -154,7 +154,7 @@ export function ProductionBoardKanbanComponent({
       0
     )
     .toFixed(1);
-    const totalLAB = data
+  const totalLAB = data
     .reduce(
       (acc, val) => acc + (val.labhrs?.aggregate?.sum?.mod_lb_hrs || 0),
       0

client/src/graphql/apollo-error-handling.js

@@ -1,17 +1,21 @@
 import { onError } from "@apollo/client/link/error";
 //https://stackoverflow.com/questions/57163454/refreshing-a-token-with-apollo-client-firebase-auth
+import * as Sentry from "@sentry/react";
 
 const errorLink = onError(
   ({ graphQLErrors, networkError, operation, forward }) => {
-    if (graphQLErrors)
-      graphQLErrors.forEach(({ message, locations, path }) =>
+    if (graphQLErrors) {
+      graphQLErrors.forEach(({ message, locations, path }) => {
         console.log(
           `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
-        )
-      );
+        );
+        Sentry.captureException({ message, locations, path });
+      });
+    }
     if (networkError)
       console.log(`[Network error]: ${JSON.stringify(networkError)}`);
     console.log(operation.getContext());
+    return forward(operation);
   }
 );
 

client/src/index.js

@@ -13,6 +13,7 @@ import reportWebVitals from "./reportWebVitals";
 import "./translations/i18n";
 import "./utils/CleanAxios";
 import { ConfigProvider } from "antd";
+
 //import { BrowserTracing } from "@sentry/tracing";
 //import "antd/dist/antd.css";
 // import "antd/dist/antd.less";
@@ -25,24 +26,20 @@ if (process.env.NODE_ENV !== "development") {
   Sentry.init({
     dsn: "https://fd7e89369b6b4bdc9c6c4c9f22fa4ee4@o492140.ingest.sentry.io/5651027",
     ignoreErrors: [
-
+        "ResizeObserver loop",
+        "Module specifier, 'fs' does not start",
+        "Module specifier, 'zlib' does not start with",
     ],
     integrations: [
-      // new BrowserTracing(),
-      // new Sentry.Integrations.Breadcrumbs({ console: true }),
-      //  new Sentry.Replay(),
+        Sentry.replayIntegration({
+            maskAllText: false,
+            blockAllMedia: true,
+        }),
+        new Sentry.BrowserTracing(),
     ],
-    // This sets the sample rate to be 10%. You may want this to be 100% while
-    // in development and sample at a lower rate in production
-    // replaysSessionSampleRate: 0.1,
-    // // If the entire session is not sampled, use the below sample rate to sample
-    // // sessions when an error occurs.
-    // replaysOnErrorSampleRate: 1.0,
+    tracesSampleRate: 1.0,
+    replaysOnErrorSampleRate: 1.0,
     environment: process.env.NODE_ENV,
-    // tracesSampleRate: 0.2,
-    // We recommend adjusting this value in production, or using tracesSampler
-    // for finer control
-    //  tracesSampleRate: 0.5,
   });
 }
 

client/src/utils/GraphQLClient.js

@@ -12,6 +12,8 @@ import apolloLogger from "apollo-link-logger";
 //import axios from "axios";
 import { auth } from "../firebase/firebase.utils";
 import errorLink from "../graphql/apollo-error-handling";
+import { SentryLink } from "apollo-link-sentry";
+
 //import { store } from "../redux/store";
 const httpLink = new HttpLink({
   uri: process.env.REACT_APP_GRAPHQL_ENDPOINT,
@@ -105,18 +107,30 @@ const link = split(
 const authLink = setContext((_, { headers }) => {
   return (
     auth.currentUser &&
-    auth.currentUser.getIdToken().then((token) => {
-      if (token) {
-        return {
-          headers: {
-            ...headers,
-            authorization: token ? `Bearer ${token}` : "",
-          },
-        };
-      } else {
+    auth.currentUser
+      .getIdToken()
+      .then((token) => {
+        if (token) {
+          return {
+            headers: {
+              ...headers,
+              authorization: token ? `Bearer ${token}` : "",
+            },
+          };
+        } else {
+          console.error(
+            "Authentication error. Unable to add authorization token because it was empty."
+          );
+          return { headers };
+        }
+      })
+      .catch((error) => {
+        console.error(
+          "Authentication error. Unable to add authorization token.",
+          error.message
+        );
         return { headers };
-      }
-    })
+      })
   );
 });
 
@@ -138,8 +152,10 @@ if (process.env.NODE_ENV === "development") {
 }
 
 middlewares.push(
-  roundTripLink.concat(
-    retryLink.concat(errorLink.concat(authLink.concat(link)))
+  new SentryLink().concat(
+    roundTripLink.concat(
+      retryLink.concat(errorLink.concat(authLink.concat(link)))
+    )
   )
 );