Add Honeybadger Application Monitoring/Error Tracking

.github/workflows/deploy.yml

@@ -24,5 +24,7 @@ jobs:
         user_email: 'github-actions[bot]@users.noreply.github.com'
         github_token: ${{ secrets.SYT_DEPLOY_PERSONAL_ACCESS_TOKEN }}
         repository: ${{ github.repository }}
+        REACT_APP_HONEYBADGER_API_KEY: ${{ secrets.HONEYBADGER_API_KEY }}
+
     - name: Updating Domain
       run: echo "Update domain"

README.md

@@ -3,6 +3,7 @@
   - [Run App](#run-app)
   - [Run Tests](#run-tests)
 - [Deployment](#deployment)
+- [Error Tracking](#error-tracking)
 - [Helpful Links](#helpful-links)
 
 # Local Development
@@ -31,6 +32,12 @@ The [deploy.yml](.github/workflows/deploy.yml) GitHub Action runs automatically
 
 The latest commit SHA of the branch that is deployed will be recorded in a `meta` tag with name `ui-version` in the index.html of the app.
 
+# Error Tracking
+
+Honeybadger is used to track errors from the front-end [SYT Front End](https://app.honeybadger.io/projects/126525/faults).
+
+The API key is added in [deploy.yml](.github/workflows/deploy.yml), so running deploy from local will need to set this `.env` variable to enable error tracking on that deployment.
+
 # Helpful Links
 
 - [React Player](https://github.com/cookpete/react-player), used to interface with Youtube

package.json

@@ -4,6 +4,8 @@
   "private": true,
   "homepage": "https://syt.hebron.wtf",
   "dependencies": {
+    "@honeybadger-io/js": "^6.9.3",
+    "@honeybadger-io/react": "^6.1.23",
     "@tomplum/react-textfit": "^1.1.5",
     "axios": "^1.6.0",
     "gh-pages": "^5.0.0",
@@ -49,4 +51,4 @@
     "postcss-normalize": "^10.0.1",
     "react-test-renderer": "^17.0.2"
   }
-}
+}

src/index.js

@@ -3,5 +3,13 @@ import ReactDOM from 'react-dom';
 import './index.css';
 import './normalize.css';
 import AppRoot from './AppRoot';
+import { Honeybadger, HoneybadgerErrorBoundary } from "@honeybadger-io/react"
 
-ReactDOM.render(<AppRoot />, document.getElementById("root"));
+const config = {
+    apiKey: process.env.REACT_APP_HONEYBADGER_API_KEY,
+    environment: "production"
+}
+
+const honeybadger = Honeybadger.configure(config)
+
+ReactDOM.render(<HoneybadgerErrorBoundary honeybadger={honeybadger}><AppRoot /></HoneybadgerErrorBoundary >, document.getElementById("root"));

yarn.lock

@@ -1296,6 +1296,28 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
+"@honeybadger-io/core@^6.6.0":
+  version "6.6.0"
+  resolved "https://registry.yarnpkg.com/@honeybadger-io/core/-/core-6.6.0.tgz#a18782ffdb4b8bdc0c36076bd330fb6c6ada1060"
+  integrity sha512-B5X05huAsDs7NJOYm4bwHf2v0tMuTjBWLfumHH9DCblq8E1XrujlbbNkIdEHlzc01K9oAXuvsaBwVkE7G5+aLQ==
+  dependencies:
+    json-nd "^1.0.0"
+    stacktrace-parser "^0.1.10"
+
+"@honeybadger-io/js@^6.9.3":
+  version "6.9.3"
+  resolved "https://registry.yarnpkg.com/@honeybadger-io/js/-/js-6.9.3.tgz#0e7c60d602934765e44228974122031e5da66141"
+  integrity sha512-Un5WFiJ9anpnKKHYINvCTkXiIK18gILbiwJjJWKxio3Tc1HHmF7/GoSxoK4QUok5jpk1ja7Fi2FiG/YCqk+Bog==
+  dependencies:
+    "@honeybadger-io/core" "^6.6.0"
+    "@types/aws-lambda" "^8.10.89"
+    "@types/express" "^4.17.13"
+
+"@honeybadger-io/react@^6.1.23":
+  version "6.1.23"
+  resolved "https://registry.yarnpkg.com/@honeybadger-io/react/-/react-6.1.23.tgz#b02b9401e6c23b0df46a7a743d8cf58e7b6c604f"
+  integrity sha512-40PtgTro6eGGhpWhc/J1qupfJlpw8b9J3CZoKIxwYLCUA10uWoiM/u+Fz95fHxAQ/QPm6vo+qkVZxMc3Bxuvlg==
+
 "@humanwhocodes/config-array@^0.10.5":
   version "0.10.7"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.10.7.tgz#6d53769fd0c222767e6452e8ebda825c22e9f0dc"
@@ -1891,6 +1913,11 @@
   resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.2.tgz#ed4e0ad92306a704f9fb132a0cfcf77486dbe2bc"
   integrity sha512-HnYpAE1Y6kRyKM/XkEuiRQhTHvkzMBurTHnpFLYLBGPIylZNPs9jJcuOOYWxPLJCSEtmZT0Y8rHDokKN7rRTig==
 
+"@types/aws-lambda@^8.10.89":
+  version "8.10.143"
+  resolved "https://registry.yarnpkg.com/@types/aws-lambda/-/aws-lambda-8.10.143.tgz#383693fbaadc6994a71d64a7c09e8c244fad8dff"
+  integrity sha512-u5vzlcR14ge/4pMTTMDQr3MF0wEe38B2F9o84uC4F43vN5DGTy63npRrB6jQhyt+C0lGv4ZfiRcRkqJoZuPnmg==
+
 "@types/babel__core@^7.0.0", "@types/babel__core@^7.1.14":
   version "7.1.19"
   resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.19.tgz#7b497495b7d1b4812bdb9d02804d0576f43ee460"
@@ -5845,6 +5872,11 @@ jsesc@~0.5.0:
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
   integrity sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==
 
+json-nd@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/json-nd/-/json-nd-1.0.0.tgz#e52283b7ee3f5e6f9920f668c94044bda912120c"
+  integrity sha512-8TIp0HZAY0VVrwRQJJPb4+nOTSPoOWZeEKBTLizUfQO4oym5Fc/MKqN8vEbLCxcyxDf2vwNxOQ1q84O49GWPyQ==
+
 json-parse-even-better-errors@^2.3.0, json-parse-even-better-errors@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
@@ -8131,6 +8163,13 @@ stackframe@^1.3.4:
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.3.4.tgz#b881a004c8c149a5e8efef37d51b16e412943310"
   integrity sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw==
 
+stacktrace-parser@^0.1.10:
+  version "0.1.10"
+  resolved "https://registry.yarnpkg.com/stacktrace-parser/-/stacktrace-parser-0.1.10.tgz#29fb0cae4e0d0b85155879402857a1639eb6051a"
+  integrity sha512-KJP1OCML99+8fhOHxwwzyWrlUuVX5GQ0ZpJTd1DFXhdkrvg1szxfHhawXUZ3g9TkXORQd4/WG68jMlQZ2p8wlg==
+  dependencies:
+    type-fest "^0.7.1"
+
 [email protected]:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-2.0.1.tgz#55cb000ccf1d48728bd23c685a063998cf1a1b63"
@@ -8586,6 +8625,11 @@ type-fest@^0.21.3:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
   integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
 
+type-fest@^0.7.1:
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.7.1.tgz#8dda65feaf03ed78f0a3f9678f1869147f7c5c48"
+  integrity sha512-Ne2YiiGN8bmrmJJEuTWTLJR32nh/JdL1+PSicowtNb0WFpn59GK8/lfD61bVtzguz7b3PBt74nxpv/Pw5po5Rg==
+
 type-is@~1.6.18:
   version "1.6.18"
   resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.18.tgz#4e552cd05df09467dcbc4ef739de89f2cf37c131"