From 7fee17f135281d736d01382deefb3511a2689942 Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Tue, 15 Aug 2023 09:09:24 -0700 Subject: [PATCH 1/9] frontend: Adding bugsnag setup --- frontend/package.json | 3 +- frontend/packages/core/package.json | 2 + .../packages/core/src/AppProvider/index.tsx | 16 +- frontend/packages/tools/package.json | 4 +- frontend/packages/tools/upload-sourcemaps.ts | 12 ++ frontend/yarn.lock | 175 ++++++++++++++++++ 6 files changed, 209 insertions(+), 3 deletions(-) create mode 100644 frontend/packages/tools/upload-sourcemaps.ts diff --git a/frontend/package.json b/frontend/package.json index feda678ee9..86e2b93dab 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -91,5 +91,6 @@ "engines": { "node": ">=16.0.0 <17", "yarn": "^1.22.11" - } + }, + "dependencies": {} } diff --git a/frontend/packages/core/package.json b/frontend/packages/core/package.json index d1cfcc357c..6f7f4b1c3f 100644 --- a/frontend/packages/core/package.json +++ b/frontend/packages/core/package.json @@ -28,6 +28,8 @@ "@mui/base": "5.0.0-alpha.86" }, "dependencies": { + "@bugsnag/js": "^7.21.0", + "@bugsnag/plugin-react": "^7.19.0", "@clutch-sh/api": "^2.0.0-beta", "@date-io/core": "^1.3.6", "@emotion/jest": "^11.0.0", diff --git a/frontend/packages/core/src/AppProvider/index.tsx b/frontend/packages/core/src/AppProvider/index.tsx index b24b452ade..1ca7b22877 100644 --- a/frontend/packages/core/src/AppProvider/index.tsx +++ b/frontend/packages/core/src/AppProvider/index.tsx @@ -1,5 +1,7 @@ import React from "react"; import { BrowserRouter as Router, Outlet, Route, Routes } from "react-router-dom"; +import Bugsnag from "@bugsnag/js"; +import BugsnagPluginReact from "@bugsnag/plugin-react"; import AppLayout from "../AppLayout"; import { ApplicationContext, ShortLinkContext } from "../Contexts"; @@ -127,7 +129,7 @@ const ClutchApp: React.FC = ({ [discoverableWorkflows, triggeredHeaderData] ); - return ( + const appLayout = ( {/* TODO: use the ThemeProvider for proper theming in the future See https://github.com/lyft/clutch/commit/f6c6706b9ba29c4d4c3e5d0ac0c5d0f038203937 */} @@ -203,6 +205,18 @@ const ClutchApp: React.FC = ({ ); + + if (process.env.REACT_APP_BUGSNAG_API_TOKEN) { + Bugsnag.start({ + apiKey: process.env.REACT_APP_BUGSNAG_API_TOKEN, + plugins: [new BugsnagPluginReact()], + releaseStage: process.env.APPLICATION_ENV || "production", + }); + const BugsnagBoundary = Bugsnag.getPlugin("react").createErrorBoundary(React); + return {appLayout}; + } + + return appLayout; }; export default ClutchApp; diff --git a/frontend/packages/tools/package.json b/frontend/packages/tools/package.json index a6b975da35..006b35288a 100644 --- a/frontend/packages/tools/package.json +++ b/frontend/packages/tools/package.json @@ -10,7 +10,8 @@ "lint": "eslint --ext .js,.jsx,.ts,.tsx .", "lint:fix": "yarn run lint --fix", "publishBeta": "../../../tools/publish-frontend.sh tools", - "registerWorkflows": "node workflow-registrar.js" + "registerWorkflows": "node workflow-registrar.js", + "upload-bugsnag-sourcemaps": "node upload-sourcemaps.ts" }, "dependencies": { "@babel/cli": "^7.7.5", @@ -22,6 +23,7 @@ "@babel/preset-env": "^7.16.4", "@babel/preset-react": "^7.16.0", "@babel/preset-typescript": "^7.16.0", + "@bugsnag/source-maps": "^2.3.1", "@types/enzyme": "^3.10.8", "@types/jest": "^29.0.0", "@types/mocha": "^10.0.0", diff --git a/frontend/packages/tools/upload-sourcemaps.ts b/frontend/packages/tools/upload-sourcemaps.ts new file mode 100644 index 0000000000..5d6eb6357a --- /dev/null +++ b/frontend/packages/tools/upload-sourcemaps.ts @@ -0,0 +1,12 @@ +const { browser } = require("@bugsnag/source-maps"); + +// interface browser { +// async function uploadOne (UploadSingleOpts): Promise +// async function uploadMultiple (UploadMultipleOpts): Promise +// } + +console.log("PROCESS", process.env.REACT_APP_BUGSNAG_API_TOKEN); + +// browser.uploadOne({ + +// }) diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 44df59fc35..a2d1263204 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -2969,6 +2969,72 @@ resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39" integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== +"@bugsnag/browser@^7.21.0": + version "7.21.0" + resolved "https://registry.yarnpkg.com/@bugsnag/browser/-/browser-7.21.0.tgz#ee623ffa57c0fe2e2e4644a24bfc2008f18f83ef" + integrity sha512-mJ6r6SXpts+hdSnDNmTR35lZ+95BthqXpgBrDwquDCoY++zQ4OuzrkA/HZYD/rfpdSpgb7lO+AAlD7qrd9IylA== + dependencies: + "@bugsnag/core" "^7.19.0" + +"@bugsnag/core@^7.19.0": + version "7.19.0" + resolved "https://registry.yarnpkg.com/@bugsnag/core/-/core-7.19.0.tgz#7663a4addb1322e8315a4012dc9db2aad3fea53b" + integrity sha512-2KGwdaLD9PhR7Wk7xPi3jGuGsKTatc/28U4TOZIDU3CgC2QhGjubwiXSECel5gwxhZ3jACKcMKSV2ovHhv1NrA== + dependencies: + "@bugsnag/cuid" "^3.0.0" + "@bugsnag/safe-json-stringify" "^6.0.0" + error-stack-parser "^2.0.3" + iserror "0.0.2" + stack-generator "^2.0.3" + +"@bugsnag/cuid@^3.0.0": + version "3.0.2" + resolved "https://registry.yarnpkg.com/@bugsnag/cuid/-/cuid-3.0.2.tgz#544f8e6e7e3768c8cb618ca5c5fb1eea6aacbb7e" + integrity sha512-cIwzC93r3PQ/INeuwtZwkZIG2K8WWN0rRLZQhu+mr48Ay+i6sEki4GYfTsflse7hZ1BeDWrNb/Q9vgY3B31xHQ== + +"@bugsnag/js@^7.21.0": + version "7.21.0" + resolved "https://registry.yarnpkg.com/@bugsnag/js/-/js-7.21.0.tgz#0a8a9a61a43cf9b552dc70341ed49ee9da46a8f3" + integrity sha512-fFTR7cRBSlLtwa1wPTse92igZUEX2V95KyGGCXq2qb2F2w6hJ6oJDxA0BMPS8qqsciYXRjbfn8HX+TFgO1oErg== + dependencies: + "@bugsnag/browser" "^7.21.0" + "@bugsnag/node" "^7.19.0" + +"@bugsnag/node@^7.19.0": + version "7.19.0" + resolved "https://registry.yarnpkg.com/@bugsnag/node/-/node-7.19.0.tgz#6a8e5d0f5e73a1d0bad19537def1a7ff65e19787" + integrity sha512-c4snyxx5d/fsMogmgehFBGc//daH6+4XCplia4zrEQYltjaQ+l8ud0dPx623DgJl/2j1+2zlRc7y7IHSd7Gm5w== + dependencies: + "@bugsnag/core" "^7.19.0" + byline "^5.0.0" + error-stack-parser "^2.0.2" + iserror "^0.0.2" + pump "^3.0.0" + stack-generator "^2.0.3" + +"@bugsnag/plugin-react@^7.19.0": + version "7.19.0" + resolved "https://registry.yarnpkg.com/@bugsnag/plugin-react/-/plugin-react-7.19.0.tgz#3f86c6ed2745cd60a4099d0e14ca46f2b9cf501f" + integrity sha512-owC4QXYJWGllMoOPcH5P7sbDIDuFLMCbjGAU6FwH5mBMObSQo+1ViSKImlTJQUFXATM8ySISTBVt7w3C6FFHng== + +"@bugsnag/safe-json-stringify@^6.0.0": + version "6.0.0" + resolved "https://registry.yarnpkg.com/@bugsnag/safe-json-stringify/-/safe-json-stringify-6.0.0.tgz#22abdcd83e008c369902976730c34c150148a758" + integrity sha512-htzFO1Zc57S8kgdRK9mLcPVTW1BY2ijfH7Dk2CeZmspTWKdKqSo1iwmqrq2WtRjFlo8aRZYgLX0wFrDXF/9DLA== + +"@bugsnag/source-maps@^2.3.1": + version "2.3.1" + resolved "https://registry.yarnpkg.com/@bugsnag/source-maps/-/source-maps-2.3.1.tgz#3caa33b7b9879e58e233eae017726852c50b1106" + integrity sha512-9xJTcf5+W7+y1fQBftSOste/3ORi+d5EeCCMdvaHSX69MKQP0lrDiSYpLwX/ErcXrTbvu7nimGGKJP2vBdF7zQ== + dependencies: + command-line-args "^5.1.1" + command-line-usage "^6.1.0" + concat-stream "^2.0.0" + consola "^2.15.0" + form-data "^3.0.0" + glob "^7.1.6" + read-pkg-up "^7.0.1" + "@cnakazawa/watch@^1.0.3": version "1.0.4" resolved "https://registry.yarnpkg.com/@cnakazawa/watch/-/watch-1.0.4.tgz#f864ae85004d0fcab6f50be9141c4da368d1656a" @@ -7877,6 +7943,16 @@ arr-union@^3.1.0: resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-3.1.0.tgz#e39b09aea9def866a8f206e288af63919bae39c4" integrity sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ= +array-back@^3.0.1, array-back@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/array-back/-/array-back-3.1.0.tgz#b8859d7a508871c9a7b2cf42f99428f65e96bfb0" + integrity sha512-TkuxA4UCOvxuDK6NZYXCalszEzj+TLszyASooky+i742l9TqsOdYCMJJupxRic61hwquNtppB3hgcuq9SVSH1Q== + +array-back@^4.0.1, array-back@^4.0.2: + version "4.0.2" + resolved "https://registry.yarnpkg.com/array-back/-/array-back-4.0.2.tgz#8004e999a6274586beeb27342168652fdb89fa1e" + integrity sha512-NbdMezxqf94cnNfWLL7V/im0Ub+Anbb0IoZhvzie8+4HJ4nMQuzHuy49FkGYCJK2yAloZ3meiB6AVMClbrI1vg== + array-differ@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/array-differ/-/array-differ-3.0.0.tgz#3cbb3d0f316810eafcc47624734237d6aee4ae6b" @@ -9527,6 +9603,26 @@ comma-separated-tokens@^1.0.0: resolved "https://registry.yarnpkg.com/comma-separated-tokens/-/comma-separated-tokens-1.0.8.tgz#632b80b6117867a158f1080ad498b2fbe7e3f5ea" integrity sha512-GHuDRO12Sypu2cV70d1dkA2EUmXHgntrzbpvOB+Qy+49ypNfGgFQIC2fhhXbnyrJRynDCAARsT7Ou0M6hirpfw== +command-line-args@^5.1.1: + version "5.2.1" + resolved "https://registry.yarnpkg.com/command-line-args/-/command-line-args-5.2.1.tgz#c44c32e437a57d7c51157696893c5909e9cec42e" + integrity sha512-H4UfQhZyakIjC74I9d34fGYDwk3XpSr17QhEd0Q3I9Xq1CETHo4Hcuo87WyWHpAF1aSLjLRf5lD9ZGX2qStUvg== + dependencies: + array-back "^3.1.0" + find-replace "^3.0.0" + lodash.camelcase "^4.3.0" + typical "^4.0.0" + +command-line-usage@^6.1.0: + version "6.1.3" + resolved "https://registry.yarnpkg.com/command-line-usage/-/command-line-usage-6.1.3.tgz#428fa5acde6a838779dfa30e44686f4b6761d957" + integrity sha512-sH5ZSPr+7UStsloltmDh7Ce5fb8XPlHyoPzTpyyMuYCtervL65+ubVZ6Q61cFtFl62UyJlc8/JwERRbAFPUqgw== + dependencies: + array-back "^4.0.2" + chalk "^2.4.2" + table-layout "^1.0.2" + typical "^5.2.0" + commander@^2.19.0, commander@^2.20.0: version "2.20.3" resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33" @@ -9653,6 +9749,11 @@ connect-history-api-fallback@^1.6.0: resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc" integrity sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg== +consola@^2.15.0: + version "2.15.3" + resolved "https://registry.yarnpkg.com/consola/-/consola-2.15.3.tgz#2e11f98d6a4be71ff72e0bdf07bd23e12cb61550" + integrity sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw== + console-browserify@^1.1.0: version "1.2.0" resolved "https://registry.yarnpkg.com/console-browserify/-/console-browserify-1.2.0.tgz#67063cef57ceb6cf4993a2ab3a55840ae8c49336" @@ -10572,6 +10673,11 @@ deep-equal@^2.0.5: which-collection "^1.0.1" which-typed-array "^1.1.8" +deep-extend@~0.6.0: + version "0.6.0" + resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac" + integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA== + deep-is@^0.1.3, deep-is@~0.1.3: version "0.1.3" resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34" @@ -11295,6 +11401,13 @@ error-ex@^1.2.0, error-ex@^1.3.1: dependencies: is-arrayish "^0.2.1" +error-stack-parser@^2.0.2, error-stack-parser@^2.0.3: + version "2.1.4" + resolved "https://registry.yarnpkg.com/error-stack-parser/-/error-stack-parser-2.1.4.tgz#229cb01cdbfa84440bfa91876285b94680188286" + integrity sha512-Sk5V6wVazPhq5MhpO+AUxJn5x7XSXGl1R93Vn7i+zS15KDVxQijejNCrz8340/2bgLBjR9GtEG8ZVKONDjcqGQ== + dependencies: + stackframe "^1.3.4" + error-stack-parser@^2.0.6: version "2.0.6" resolved "https://registry.yarnpkg.com/error-stack-parser/-/error-stack-parser-2.0.6.tgz#5a99a707bd7a4c58a797902d48d82803ede6aad8" @@ -12436,6 +12549,13 @@ find-cache-dir@^3.3.1: make-dir "^3.0.2" pkg-dir "^4.1.0" +find-replace@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/find-replace/-/find-replace-3.0.0.tgz#3e7e23d3b05167a76f770c9fbd5258b0def68c38" + integrity sha512-6Tb2myMioCAgv5kfvP5/PkZZ/ntTpVK39fHY7WkWBgvbeE+VHd/tZuZ4mrC+bxh4cfOZeYKVPaJIZtZXV7GNCQ== + dependencies: + array-back "^3.0.1" + find-root@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4" @@ -14645,6 +14765,11 @@ isarray@^2.0.5: resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723" integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw== +iserror@0.0.2, iserror@^0.0.2: + version "0.0.2" + resolved "https://registry.yarnpkg.com/iserror/-/iserror-0.0.2.tgz#bd53451fe2f668b9f2402c1966787aaa2c7c0bf5" + integrity sha512-oKGGrFVaWwETimP3SiWwjDeY27ovZoyZPHtxblC4hCq9fXxed/jasx+ATWFFjCVSRZng8VTMsN1nDnGo6zMBSw== + isexe@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10" @@ -15956,6 +16081,11 @@ lodash._reinterpolate@^3.0.0: resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d" integrity sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0= +lodash.camelcase@^4.3.0: + version "4.3.0" + resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6" + integrity sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA== + lodash.curry@^4.0.1: version "4.1.1" resolved "https://registry.yarnpkg.com/lodash.curry/-/lodash.curry-4.1.1.tgz#248e36072ede906501d75966200a86dab8b23170" @@ -19718,6 +19848,11 @@ reduce-css-calc@^2.1.8: css-unit-converter "^1.1.1" postcss-value-parser "^3.3.0" +reduce-flatten@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/reduce-flatten/-/reduce-flatten-2.0.0.tgz#734fd84e65f375d7ca4465c69798c25c9d10ae27" + integrity sha512-EJ4UNY/U1t2P/2k6oqotuX2Cc3T6nxJwsM0N0asT7dhrtH1ltUxDn4NalSYmPE2rCkVpcf/X6R0wDwcFpzhd4w== + redux@^4.0.0, redux@^4.0.4: version "4.2.0" resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.0.tgz#46f10d6e29b6666df758780437651eeb2b969f13" @@ -21037,6 +21172,13 @@ stable@^0.1.8: resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf" integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w== +stack-generator@^2.0.3: + version "2.0.10" + resolved "https://registry.yarnpkg.com/stack-generator/-/stack-generator-2.0.10.tgz#8ae171e985ed62287d4f1ed55a1633b3fb53bb4d" + integrity sha512-mwnua/hkqM6pF4k8SnmZ2zfETsRUpWXREfA/goT8SLCV4iOFa4bzOX2nDipWAZFPTjLvQB82f5yaodMVhK0yJQ== + dependencies: + stackframe "^1.3.4" + stack-utils@^2.0.3: version "2.0.5" resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.5.tgz#d25265fca995154659dbbfba3b49254778d2fdd5" @@ -21054,6 +21196,11 @@ stackframe@^1.1.1: resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.2.0.tgz#52429492d63c62eb989804c11552e3d22e779303" integrity sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA== +stackframe@^1.3.4: + version "1.3.4" + resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.3.4.tgz#b881a004c8c149a5e8efef37d51b16e412943310" + integrity sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw== + state-toggle@^1.0.0: version "1.0.3" resolved "https://registry.yarnpkg.com/state-toggle/-/state-toggle-1.0.3.tgz#e123b16a88e143139b09c6852221bc9815917dfe" @@ -21553,6 +21700,16 @@ synchronous-promise@^2.0.15: resolved "https://registry.yarnpkg.com/synchronous-promise/-/synchronous-promise-2.0.16.tgz#669b75e86b4295fdcc1bb0498de9ac1af6fd51a9" integrity sha512-qImOD23aDfnIDNqlG1NOehdB9IYsn1V9oByPjKY1nakv2MQYCEMyX033/q+aEtYCpmYK1cv2+NTmlH+ra6GA5A== +table-layout@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/table-layout/-/table-layout-1.0.2.tgz#c4038a1853b0136d63365a734b6931cf4fad4a04" + integrity sha512-qd/R7n5rQTRFi+Zf2sk5XVVd9UQl6ZkduPFC3S7WEGJAmetDTjY3qPN50eSKzwuzEyQKy5TN2TiZdkIjos2L6A== + dependencies: + array-back "^4.0.1" + deep-extend "~0.6.0" + typical "^5.2.0" + wordwrapjs "^4.0.0" + tailwindcss@^3.0.2: version "3.0.24" resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.0.24.tgz#22e31e801a44a78a1d9a81ecc52e13b69d85704d" @@ -22134,6 +22291,16 @@ typescript@^4.2.3: resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.3.tgz#39062d8019912d43726298f09493d598048c1ce3" integrity sha512-qOcYwxaByStAWrBf4x0fibwZvMRG+r4cQoTjbPtUlrWjBHbmCAww1i448U0GJ+3cNNEtebDteo/cHOR3xJ4wEw== +typical@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/typical/-/typical-4.0.0.tgz#cbeaff3b9d7ae1e2bbfaf5a4e6f11eccfde94fc4" + integrity sha512-VAH4IvQ7BDFYglMd7BPRDfLgxZZX4O4TFcRDA6EN5X7erNJJq+McIEp8np9aVtxrCJ6qx4GTYVfOWNjcqwZgRw== + +typical@^5.2.0: + version "5.2.0" + resolved "https://registry.yarnpkg.com/typical/-/typical-5.2.0.tgz#4daaac4f2b5315460804f0acf6cb69c52bb93066" + integrity sha512-dvdQgNDNJo+8B2uBQoqdb11eUCE1JQXhvjC/CZtgvZseVd5TYMXnq0+vuUemXbd/Se29cTaUuPX3YIc2xgbvIg== + ua-parser-js@^0.7.30: version "0.7.32" resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.32.tgz#cd8c639cdca949e30fa68c44b7813ef13e36d211" @@ -23120,6 +23287,14 @@ wordwrap@^1.0.0: resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-1.0.0.tgz#27584810891456a4171c8d0226441ade90cbcaeb" integrity sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q== +wordwrapjs@^4.0.0: + version "4.0.1" + resolved "https://registry.yarnpkg.com/wordwrapjs/-/wordwrapjs-4.0.1.tgz#d9790bccfb110a0fc7836b5ebce0937b37a8b98f" + integrity sha512-kKlNACbvHrkpIw6oPeYDSmdCTu2hdMHoyXLTcUKala++lx5Y+wjJ/e474Jqv5abnVmwxw08DiTuHmw69lJGksA== + dependencies: + reduce-flatten "^2.0.0" + typical "^5.2.0" + workbox-background-sync@6.5.3: version "6.5.3" resolved "https://registry.yarnpkg.com/workbox-background-sync/-/workbox-background-sync-6.5.3.tgz#7c66c1836aeca6f3762dc48d17a1852a33b3168c" From 4451dfb7d0ad6350a19f3569935478e36d09fc55 Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Tue, 15 Aug 2023 10:03:24 -0700 Subject: [PATCH 2/9] Upload file --- frontend/packages/tools/package.json | 3 +- frontend/packages/tools/upload-sourcemaps.js | 52 ++++++++++++++++++++ frontend/packages/tools/upload-sourcemaps.ts | 12 ----- frontend/yarn.lock | 5 ++ 4 files changed, 59 insertions(+), 13 deletions(-) create mode 100644 frontend/packages/tools/upload-sourcemaps.js delete mode 100644 frontend/packages/tools/upload-sourcemaps.ts diff --git a/frontend/packages/tools/package.json b/frontend/packages/tools/package.json index 006b35288a..4e1d77d1a6 100644 --- a/frontend/packages/tools/package.json +++ b/frontend/packages/tools/package.json @@ -11,7 +11,7 @@ "lint:fix": "yarn run lint --fix", "publishBeta": "../../../tools/publish-frontend.sh tools", "registerWorkflows": "node workflow-registrar.js", - "upload-bugsnag-sourcemaps": "node upload-sourcemaps.ts" + "uploadSourcemaps": "node upload-sourcemaps.js" }, "dependencies": { "@babel/cli": "^7.7.5", @@ -36,6 +36,7 @@ "babel-jest": "^27.4.2", "babel-plugin-module-resolver": "^4.0.0", "cypress": "9.7.0", + "dotenv": "^16.3.1", "enzyme": "^3.11.0", "esbuild": "^0.18.0", "eslint": "^8.3.0", diff --git a/frontend/packages/tools/upload-sourcemaps.js b/frontend/packages/tools/upload-sourcemaps.js new file mode 100644 index 0000000000..94ce1575cc --- /dev/null +++ b/frontend/packages/tools/upload-sourcemaps.js @@ -0,0 +1,52 @@ +const { browser } = require("@bugsnag/source-maps"); +const path = require("path"); +const fs = require("fs"); +const srcDir = process.argv[2]; +const buildDir = process.argv[3]; +const envFile = process.argv[4]; +const { config } = require("dotenv"); + +const dotEnvFile = `${srcDir}/${envFile}`; + +config({ path: dotEnvFile }); + +const uploadToBugsnag = async ({ apiKey, baseUrl, distDir: directory }) => { + try { + await browser.uploadMultiple({ + apiKey, + baseUrl, + directory, + overwrite: true, + }); + console.info(`[BugSnag] Successfully uploaded source maps ${directory} to BugSnag`); + } catch (err) { + console.error(`[BugSnag] Error uploading source maps to BugSnag: ${err}`); + } +}; + +const uploadBugsnagSourcemaps = () => { + const apiKey = process.env.REACT_APP_BUGSNAG_API_TOKEN || ""; + const baseUrl = process.env.REACT_APP_BASE_URL || ""; + if (!apiKey || apiKey === "") { + console.error(`[BugSnag] No API token found in ${dotEnvFile} file. Skipping upload.`); + return Promise.reject(new Error("[BugSnag] API Key missing")); + } + + if (!baseUrl || baseUrl === "") { + console.error( + `[BugSnag] No BaseUrl defined in process.env.BASE_URL in ${dotEnvFile}. Skipping Upload` + ); + return Promise.reject(new Error("[BugSnag] BaseUrl missing")); + } + + const options = { + apiKey, + baseUrl: `${baseUrl}${process.env.REACT_APP_BASE_URL_PATH ?? "/static/js/"}`, + distDir: process.env.SOURCEMAPS_DIR || `${srcDir}/${buildDir}`, + serviceName: process.env.REACT_APP_SERVICE_NAME ?? "clutch", + }; + + return uploadToBugsnag(options); +}; + +uploadBugsnagSourcemaps(); diff --git a/frontend/packages/tools/upload-sourcemaps.ts b/frontend/packages/tools/upload-sourcemaps.ts deleted file mode 100644 index 5d6eb6357a..0000000000 --- a/frontend/packages/tools/upload-sourcemaps.ts +++ /dev/null @@ -1,12 +0,0 @@ -const { browser } = require("@bugsnag/source-maps"); - -// interface browser { -// async function uploadOne (UploadSingleOpts): Promise -// async function uploadMultiple (UploadMultipleOpts): Promise -// } - -console.log("PROCESS", process.env.REACT_APP_BUGSNAG_API_TOKEN); - -// browser.uploadOne({ - -// }) diff --git a/frontend/yarn.lock b/frontend/yarn.lock index a2d1263204..8fa3ba7936 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -11146,6 +11146,11 @@ dotenv@^10.0.0: resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-10.0.0.tgz#3d4227b8fb95f81096cdd2b66653fb2c7085ba81" integrity sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q== +dotenv@^16.3.1: + version "16.3.1" + resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.3.1.tgz#369034de7d7e5b120972693352a3bf112172cc3e" + integrity sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ== + dotenv@^8.0.0: version "8.2.0" resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-8.2.0.tgz#97e619259ada750eea3e4ea3e26bceea5424b16a" From 266d908b34bc913f62d1049b15ca724ead6a7995 Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Tue, 15 Aug 2023 11:34:17 -0700 Subject: [PATCH 3/9] Some changes --- frontend/packages/core/src/AppProvider/index.tsx | 12 +++++++----- frontend/packages/tools/upload-sourcemaps.js | 9 ++------- 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/frontend/packages/core/src/AppProvider/index.tsx b/frontend/packages/core/src/AppProvider/index.tsx index 1ca7b22877..eddeadd706 100644 --- a/frontend/packages/core/src/AppProvider/index.tsx +++ b/frontend/packages/core/src/AppProvider/index.tsx @@ -207,11 +207,13 @@ const ClutchApp: React.FC = ({ ); if (process.env.REACT_APP_BUGSNAG_API_TOKEN) { - Bugsnag.start({ - apiKey: process.env.REACT_APP_BUGSNAG_API_TOKEN, - plugins: [new BugsnagPluginReact()], - releaseStage: process.env.APPLICATION_ENV || "production", - }); + if (!(Bugsnag as any)._client) { + Bugsnag.start({ + apiKey: process.env.REACT_APP_BUGSNAG_API_TOKEN, + plugins: [new BugsnagPluginReact()], + releaseStage: process.env.APPLICATION_ENV || "production", + }); + } const BugsnagBoundary = Bugsnag.getPlugin("react").createErrorBoundary(React); return {appLayout}; } diff --git a/frontend/packages/tools/upload-sourcemaps.js b/frontend/packages/tools/upload-sourcemaps.js index 94ce1575cc..5ac619b59c 100644 --- a/frontend/packages/tools/upload-sourcemaps.js +++ b/frontend/packages/tools/upload-sourcemaps.js @@ -1,6 +1,4 @@ const { browser } = require("@bugsnag/source-maps"); -const path = require("path"); -const fs = require("fs"); const srcDir = process.argv[2]; const buildDir = process.argv[3]; const envFile = process.argv[4]; @@ -39,14 +37,11 @@ const uploadBugsnagSourcemaps = () => { return Promise.reject(new Error("[BugSnag] BaseUrl missing")); } - const options = { + return uploadToBugsnag({ apiKey, baseUrl: `${baseUrl}${process.env.REACT_APP_BASE_URL_PATH ?? "/static/js/"}`, distDir: process.env.SOURCEMAPS_DIR || `${srcDir}/${buildDir}`, - serviceName: process.env.REACT_APP_SERVICE_NAME ?? "clutch", - }; - - return uploadToBugsnag(options); + }); }; uploadBugsnagSourcemaps(); From 944439ef266778213cbff303a7311fbc94a8b436 Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Thu, 17 Aug 2023 13:56:47 -0700 Subject: [PATCH 4/9] Update wrapper for bugsnag around clutch app --- frontend/packages/core/src/AppProvider/index.tsx | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/frontend/packages/core/src/AppProvider/index.tsx b/frontend/packages/core/src/AppProvider/index.tsx index eddeadd706..eb926828c6 100644 --- a/frontend/packages/core/src/AppProvider/index.tsx +++ b/frontend/packages/core/src/AppProvider/index.tsx @@ -129,7 +129,7 @@ const ClutchApp: React.FC = ({ [discoverableWorkflows, triggeredHeaderData] ); - const appLayout = ( + return ( {/* TODO: use the ThemeProvider for proper theming in the future See https://github.com/lyft/clutch/commit/f6c6706b9ba29c4d4c3e5d0ac0c5d0f038203937 */} @@ -205,7 +205,9 @@ const ClutchApp: React.FC = ({ ); +}; +const BugSnagApp = props => { if (process.env.REACT_APP_BUGSNAG_API_TOKEN) { if (!(Bugsnag as any)._client) { Bugsnag.start({ @@ -215,10 +217,14 @@ const ClutchApp: React.FC = ({ }); } const BugsnagBoundary = Bugsnag.getPlugin("react").createErrorBoundary(React); - return {appLayout}; + return ( + + + + ); } - return appLayout; + return ; }; -export default ClutchApp; +export default BugSnagApp; From e57b2df6bfdcc57f4f2a9411e5e2f809fff6bcbe Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Fri, 18 Aug 2023 10:53:45 -0700 Subject: [PATCH 5/9] Adding bugsnag documentation --- docs/development/frontend/bugsnag.md | 31 ++++++++++++++++++++++++++++ docs/sidebars.json | 1 + 2 files changed, 32 insertions(+) create mode 100644 docs/development/frontend/bugsnag.md diff --git a/docs/development/frontend/bugsnag.md b/docs/development/frontend/bugsnag.md new file mode 100644 index 0000000000..9946efbdeb --- /dev/null +++ b/docs/development/frontend/bugsnag.md @@ -0,0 +1,31 @@ +--- +title: BugSnag +{{ .EditURL }} +--- + +The frontend code in Clutch allows a user to utilize BugSnag for their bug catching abilities. The setup when using a Gateway or the normal clutch app is quite simple as it just requires the usage of environment variables. + +An example is below + +## Structure +``` +frontend +├─ package.json +├─ .env.production +├─ ... +``` + +### Example Script in package.json +```json +"upload-sourcemaps": "yarn workspace @clutch-sh/tools uploadSourcemaps $PWD build/static .env.production --" +``` + +### Example .env.production +```bash +REACT_APP_SERVICE_NAME= +REACT_APP_BUGSNAG_API_TOKEN=.... +REACT_APP_BASE_URL=https://.net +APPLICATION_ENV=production +``` + +And thats it, after setting up these few items Clutch will wrap the application in a BugSnag error boundary and report errors as it catches them. \ No newline at end of file diff --git a/docs/sidebars.json b/docs/sidebars.json index dc3da216b1..3a96561299 100644 --- a/docs/sidebars.json +++ b/docs/sidebars.json @@ -37,6 +37,7 @@ "items": [ "development/frontend/overview", "development/frontend/storybook", + "development/frontend/bugsnag", { "type": "link", "label": "Clutch's Storybook", From 71e2969a4e29eaa2bf88442acbac668c87467dbd Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Fri, 18 Aug 2023 11:04:48 -0700 Subject: [PATCH 6/9] Fixing lint --- frontend/packages/core/src/AppProvider/index.tsx | 1 + frontend/packages/tools/upload-sourcemaps.js | 4 +++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/packages/core/src/AppProvider/index.tsx b/frontend/packages/core/src/AppProvider/index.tsx index eb926828c6..f5fd526f4f 100644 --- a/frontend/packages/core/src/AppProvider/index.tsx +++ b/frontend/packages/core/src/AppProvider/index.tsx @@ -209,6 +209,7 @@ const ClutchApp: React.FC = ({ const BugSnagApp = props => { if (process.env.REACT_APP_BUGSNAG_API_TOKEN) { + // eslint-disable-next-line no-underscore-dangle if (!(Bugsnag as any)._client) { Bugsnag.start({ apiKey: process.env.REACT_APP_BUGSNAG_API_TOKEN, diff --git a/frontend/packages/tools/upload-sourcemaps.js b/frontend/packages/tools/upload-sourcemaps.js index 5ac619b59c..334c357673 100644 --- a/frontend/packages/tools/upload-sourcemaps.js +++ b/frontend/packages/tools/upload-sourcemaps.js @@ -1,8 +1,10 @@ +/* eslint-disable no-console */ const { browser } = require("@bugsnag/source-maps"); +const { config } = require("dotenv"); + const srcDir = process.argv[2]; const buildDir = process.argv[3]; const envFile = process.argv[4]; -const { config } = require("dotenv"); const dotEnvFile = `${srcDir}/${envFile}`; From c73e0fb1bb388c8a7f2d627d70d0c36a901d2001 Mon Sep 17 00:00:00 2001 From: Josh Slaughter Date: Fri, 18 Aug 2023 11:10:40 -0700 Subject: [PATCH 7/9] Fixing sort issue --- frontend/package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/package.json b/frontend/package.json index 86e2b93dab..0a8c12930d 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -59,6 +59,7 @@ "last 1 safari version" ] }, + "dependencies": {}, "devDependencies": { "@babel/core": "^7.16.0", "@mui/material": "^5.8.5", @@ -91,6 +92,5 @@ "engines": { "node": ">=16.0.0 <17", "yarn": "^1.22.11" - }, - "dependencies": {} + } } From 086f99763c30b6aece6046f6068409a69a775f47 Mon Sep 17 00:00:00 2001 From: Josh Slaughter <8338893+jdslaugh@users.noreply.github.com> Date: Mon, 21 Aug 2023 11:01:56 -0700 Subject: [PATCH 8/9] Update frontend/packages/tools/upload-sourcemaps.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Jorge Cortés --- frontend/packages/tools/upload-sourcemaps.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/packages/tools/upload-sourcemaps.js b/frontend/packages/tools/upload-sourcemaps.js index 334c357673..505b21ad30 100644 --- a/frontend/packages/tools/upload-sourcemaps.js +++ b/frontend/packages/tools/upload-sourcemaps.js @@ -27,7 +27,7 @@ const uploadToBugsnag = async ({ apiKey, baseUrl, distDir: directory }) => { const uploadBugsnagSourcemaps = () => { const apiKey = process.env.REACT_APP_BUGSNAG_API_TOKEN || ""; const baseUrl = process.env.REACT_APP_BASE_URL || ""; - if (!apiKey || apiKey === "") { + if (!apiKey) { console.error(`[BugSnag] No API token found in ${dotEnvFile} file. Skipping upload.`); return Promise.reject(new Error("[BugSnag] API Key missing")); } From 55e9d44a4b4ef3a5397e73a2dc596c980ab8d134 Mon Sep 17 00:00:00 2001 From: Josh Slaughter <8338893+jdslaugh@users.noreply.github.com> Date: Mon, 21 Aug 2023 11:02:01 -0700 Subject: [PATCH 9/9] Update frontend/packages/tools/upload-sourcemaps.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Jorge Cortés --- frontend/packages/tools/upload-sourcemaps.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/packages/tools/upload-sourcemaps.js b/frontend/packages/tools/upload-sourcemaps.js index 505b21ad30..fceb4713cc 100644 --- a/frontend/packages/tools/upload-sourcemaps.js +++ b/frontend/packages/tools/upload-sourcemaps.js @@ -32,7 +32,7 @@ const uploadBugsnagSourcemaps = () => { return Promise.reject(new Error("[BugSnag] API Key missing")); } - if (!baseUrl || baseUrl === "") { + if (!baseUrl) { console.error( `[BugSnag] No BaseUrl defined in process.env.BASE_URL in ${dotEnvFile}. Skipping Upload` );