From 3e612cad1ca4d58a0339c534181e025ab048413a Mon Sep 17 00:00:00 2001 From: Lukasz Ostrowski Date: Wed, 1 Mar 2023 15:24:16 +0100 Subject: [PATCH] Add Sentry to data-importer (#226) --- .changeset/spicy-scissors-report.md | 5 + .gitignore | 4 +- apps/data-importer/next.config.js | 8 ++ apps/data-importer/package.json | 11 +- apps/data-importer/sentry.client.config.js | 17 +++ apps/data-importer/sentry.edge.config.js | 17 +++ apps/data-importer/sentry.properties | 3 + apps/data-importer/sentry.server.config.js | 17 +++ apps/data-importer/src/pages/_error.js | 39 +++++++ pnpm-lock.yaml | 123 +++++++++++++++++++++ 10 files changed, 238 insertions(+), 6 deletions(-) create mode 100644 .changeset/spicy-scissors-report.md create mode 100644 apps/data-importer/sentry.client.config.js create mode 100644 apps/data-importer/sentry.edge.config.js create mode 100644 apps/data-importer/sentry.properties create mode 100644 apps/data-importer/sentry.server.config.js create mode 100644 apps/data-importer/src/pages/_error.js diff --git a/.changeset/spicy-scissors-report.md b/.changeset/spicy-scissors-report.md new file mode 100644 index 0000000..2847a6d --- /dev/null +++ b/.changeset/spicy-scissors-report.md @@ -0,0 +1,5 @@ +--- +"saleor-app-data-importer": minor +--- + +App now is configured with Sentry Wizard and will log to sentry if proper env variables are set diff --git a/.gitignore b/.gitignore index dd84142..774408c 100644 --- a/.gitignore +++ b/.gitignore @@ -39,4 +39,6 @@ yarn-error.log* test-invoice.pdf coverage/ apps/**/generated -.eslintcache \ No newline at end of file +.eslintcache + +.sentryclirc \ No newline at end of file diff --git a/apps/data-importer/next.config.js b/apps/data-importer/next.config.js index ceb38dc..f5a78fa 100644 --- a/apps/data-importer/next.config.js +++ b/apps/data-importer/next.config.js @@ -1,3 +1,9 @@ +// This file sets a custom webpack configuration to use your Next.js app +// with Sentry. +// https://nextjs.org/docs/api-reference/next.config.js/introduction +// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/ +const { withSentryConfig } = require("@sentry/nextjs"); + /** * @type {import('next').NextConfig} */ @@ -8,3 +14,5 @@ module.exports = { }, transpilePackages: ["nuvo-react", "@saleor/apps-shared"], }; + +module.exports = withSentryConfig(module.exports, { silent: true }, { hideSourcemaps: true }); diff --git a/apps/data-importer/package.json b/apps/data-importer/package.json index 26c2e3b..02a10b3 100644 --- a/apps/data-importer/package.json +++ b/apps/data-importer/package.json @@ -20,7 +20,9 @@ "@material-ui/icons": "^4.11.3", "@material-ui/lab": "4.0.0-alpha.61", "@saleor/app-sdk": "0.29.0", + "@saleor/apps-shared": "workspace:*", "@saleor/macaw-ui": "^0.7.2", + "@sentry/nextjs": "^7.39.0", "@urql/exchange-auth": "^1.0.0", "@vitejs/plugin-react": "^3.1.0", "clsx": "^1.2.1", @@ -37,11 +39,9 @@ "usehooks-ts": "^2.9.1", "vite": "^4.1.1", "vitest": "^0.28.4", - "zod": "^3.20.2", - "@saleor/apps-shared": "workspace:*" + "zod": "^3.20.2" }, "devDependencies": { - "eslint": "^8.33.0", "@graphql-codegen/cli": "2.13.3", "@graphql-codegen/introspection": "2.2.1", "@graphql-codegen/typed-document-node": "^2.3.3", @@ -56,9 +56,10 @@ "@types/node": "^18.8.1", "@types/react": "^18.0.27", "@types/react-dom": "^18.0.10", - "typescript": "4.9.5", + "@vitest/coverage-c8": "^0.28.4", + "eslint": "^8.33.0", "eslint-config-saleor": "workspace:*", - "@vitest/coverage-c8": "^0.28.4" + "typescript": "4.9.5" }, "lint-staged": { "*.{js,ts,tsx}": "eslint --cache --fix", diff --git a/apps/data-importer/sentry.client.config.js b/apps/data-importer/sentry.client.config.js new file mode 100644 index 0000000..d480b2d --- /dev/null +++ b/apps/data-importer/sentry.client.config.js @@ -0,0 +1,17 @@ +// This file configures the initialization of Sentry on the browser. +// The config you add here will be used whenever a page is visited. +// https://docs.sentry.io/platforms/javascript/guides/nextjs/ + +import * as Sentry from "@sentry/nextjs"; + +const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN; + +Sentry.init({ + dsn: SENTRY_DSN, + // Adjust this value in production, or use tracesSampler for greater control + tracesSampleRate: 1.0, + // ... + // Note: if you want to override the automatic release value, do not set a + // `release` value here - use the environment variable `SENTRY_RELEASE`, so + // that it will also get attached to your source maps +}); diff --git a/apps/data-importer/sentry.edge.config.js b/apps/data-importer/sentry.edge.config.js new file mode 100644 index 0000000..1c3e861 --- /dev/null +++ b/apps/data-importer/sentry.edge.config.js @@ -0,0 +1,17 @@ +// This file configures the initialization of Sentry on the server. +// The config you add here will be used whenever middleware or an Edge route handles a request. +// https://docs.sentry.io/platforms/javascript/guides/nextjs/ + +import * as Sentry from "@sentry/nextjs"; + +const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN; + +Sentry.init({ + dsn: SENTRY_DSN, + // Adjust this value in production, or use tracesSampler for greater control + tracesSampleRate: 1.0, + // ... + // Note: if you want to override the automatic release value, do not set a + // `release` value here - use the environment variable `SENTRY_RELEASE`, so + // that it will also get attached to your source maps +}); diff --git a/apps/data-importer/sentry.properties b/apps/data-importer/sentry.properties new file mode 100644 index 0000000..19fba99 --- /dev/null +++ b/apps/data-importer/sentry.properties @@ -0,0 +1,3 @@ +defaults.url=https://sentry.io/ +defaults.org=saleor +defaults.project=saleor-app-data-importer diff --git a/apps/data-importer/sentry.server.config.js b/apps/data-importer/sentry.server.config.js new file mode 100644 index 0000000..a7e581b --- /dev/null +++ b/apps/data-importer/sentry.server.config.js @@ -0,0 +1,17 @@ +// This file configures the initialization of Sentry on the server. +// The config you add here will be used whenever the server handles a request. +// https://docs.sentry.io/platforms/javascript/guides/nextjs/ + +import * as Sentry from "@sentry/nextjs"; + +const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN; + +Sentry.init({ + dsn: SENTRY_DSN, + // Adjust this value in production, or use tracesSampler for greater control + tracesSampleRate: 1.0, + // ... + // Note: if you want to override the automatic release value, do not set a + // `release` value here - use the environment variable `SENTRY_RELEASE`, so + // that it will also get attached to your source maps +}); diff --git a/apps/data-importer/src/pages/_error.js b/apps/data-importer/src/pages/_error.js new file mode 100644 index 0000000..55c3486 --- /dev/null +++ b/apps/data-importer/src/pages/_error.js @@ -0,0 +1,39 @@ +/** + * NOTE: This requires `@sentry/nextjs` version 7.3.0 or higher. + * + * NOTE: If using this with `next` version 12.2.0 or lower, uncomment the + * penultimate line in `CustomErrorComponent`. + * + * This page is loaded by Nextjs: + * - on the server, when data-fetching methods throw or reject + * - on the client, when `getInitialProps` throws or rejects + * - on the client, when a React lifecycle method throws or rejects, and it's + * caught by the built-in Nextjs error boundary + * + * See: + * - https://nextjs.org/docs/basic-features/data-fetching/overview + * - https://nextjs.org/docs/api-reference/data-fetching/get-initial-props + * - https://reactjs.org/docs/error-boundaries.html + */ + +import * as Sentry from "@sentry/nextjs"; +import NextErrorComponent from "next/error"; + +const CustomErrorComponent = (props) => { + // If you're using a Nextjs version prior to 12.2.1, uncomment this to + // compensate for https://github.com/vercel/next.js/issues/8592 + // Sentry.captureUnderscoreErrorException(props); + + return ; +}; + +CustomErrorComponent.getInitialProps = async (contextData) => { + // In case this is running in a serverless function, await this in order to give Sentry + // time to send the error before the lambda exits + await Sentry.captureUnderscoreErrorException(contextData); + + // This will contain the status code of the response + return NextErrorComponent.getInitialProps(contextData); +}; + +export default CustomErrorComponent; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6e397a4..42d9912 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -36,6 +36,7 @@ importers: '@saleor/app-sdk': 0.29.0 '@saleor/apps-shared': workspace:* '@saleor/macaw-ui': ^0.7.2 + '@sentry/nextjs': ^7.39.0 '@testing-library/react': ^13.4.0 '@testing-library/react-hooks': ^8.0.1 '@types/dot-object': ^2.1.2 @@ -70,6 +71,7 @@ importers: '@saleor/app-sdk': 0.29.0_3vryta7zmbcsw4rrqf4axjqggm '@saleor/apps-shared': link:../../packages/shared '@saleor/macaw-ui': 0.7.2_pmlnlm755hlzzzocw2qhf3a34e + '@sentry/nextjs': 7.39.0_next@13.1.6+react@18.2.0 '@urql/exchange-auth': 1.0.0_graphql@16.6.0 '@vitejs/plugin-react': 3.1.0_vite@4.1.1 clsx: 1.2.1 @@ -4186,6 +4188,17 @@ packages: tslib: 1.14.1 dev: false + /@sentry/browser/7.39.0: + resolution: {integrity: sha512-LSa89bLDfGK33ArrgutVU8p4UDb809BgOn29qe/YPUL/Wor+cO59XoEmKVmXEqMZYEVjsaUVoBanUoxXKSlYgw==} + engines: {node: '>=8'} + dependencies: + '@sentry/core': 7.39.0 + '@sentry/replay': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + tslib: 1.14.1 + dev: false + /@sentry/cli/1.74.6: resolution: {integrity: sha512-pJ7JJgozyjKZSTjOGi86chIngZMLUlYt2HOog+OJn+WGvqEkVymu8m462j1DiXAnex9NspB4zLLNuZ/R6rTQHg==} engines: {node: '>= 8'} @@ -4213,6 +4226,15 @@ packages: tslib: 1.14.1 dev: false + /@sentry/core/7.39.0: + resolution: {integrity: sha512-45WJIcWWCQnZ8zhHtcrkJjQ4YydmzMWY4pmRuBG7Qp+zrCT6ISoyODcjY+SCHFdvXkiYFi8+bFZa1qG3YQnnYw==} + engines: {node: '>=8'} + dependencies: + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + tslib: 1.14.1 + dev: false + /@sentry/integrations/7.36.0: resolution: {integrity: sha512-wrRoUqdeGi64NNimGVk8U8DBiXamxTYPBux0/faFDyau8EJyQFcv8zOyB78Za4W2Ss3ZXNaE/WtFF8UxalHzBQ==} engines: {node: '>=8'} @@ -4223,6 +4245,16 @@ packages: tslib: 1.14.1 dev: false + /@sentry/integrations/7.39.0: + resolution: {integrity: sha512-NJzPSAI8/YqlHj0ZbrIQrRRb4CE0IhH2UAmp96HbSqXyfiSBrGrEjPurgjKPjkYiWDpUiSolN5bhAxRG5xbe/w==} + engines: {node: '>=8'} + dependencies: + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + localforage: 1.10.0 + tslib: 1.14.1 + dev: false + /@sentry/nextjs/7.36.0_next@13.1.0+react@18.2.0: resolution: {integrity: sha512-7IUwBjCjo3rWuvEG16D1wKb0D+aMyCU920VGCAQVZaqTZAgrgAKfpTa1Sk0fmDxYglW1EBI9QM+WEnOa9RleLw==} engines: {node: '>=8'} @@ -4283,6 +4315,36 @@ packages: - supports-color dev: false + /@sentry/nextjs/7.39.0_next@13.1.6+react@18.2.0: + resolution: {integrity: sha512-CXd9aQD/ekDqzzI8FEPatDJ6tFHuQy127zaECRmi4D40nmYzVLvskS2/i3LoozeCHUZcIwOJSimMZZOc3CjlvQ==} + engines: {node: '>=8'} + peerDependencies: + next: ^10.0.8 || ^11.0 || ^12.0 || ^13.0 + react: 16.x || 17.x || 18.x + webpack: '>= 4.0.0' + peerDependenciesMeta: + webpack: + optional: true + dependencies: + '@rollup/plugin-commonjs': 24.0.0_rollup@2.78.0 + '@sentry/core': 7.39.0 + '@sentry/integrations': 7.39.0 + '@sentry/node': 7.39.0 + '@sentry/react': 7.39.0_react@18.2.0 + '@sentry/tracing': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + '@sentry/webpack-plugin': 1.20.0 + chalk: 3.0.0 + next: 13.1.6_biqbaboplfbrettd7655fr4n2y + react: 18.2.0 + rollup: 2.78.0 + tslib: 1.14.1 + transitivePeerDependencies: + - encoding + - supports-color + dev: false + /@sentry/node/7.36.0: resolution: {integrity: sha512-nAHAY+Rbn5OlTpNX/i6wYrmw3hT/BtwPZ/vNU52cKgw7CpeE1UrCeFjnPn18rQPB7lIh7x0vNvoaPrfemRzpSQ==} engines: {node: '>=8'} @@ -4298,6 +4360,21 @@ packages: - supports-color dev: false + /@sentry/node/7.39.0: + resolution: {integrity: sha512-oe1OBxgs6t/FizjxkSPtuvJv5wJMO+mLENZkiE0PpBD56JyZrWK48kYIt2ccWAfk6Vh235/oIpmqET150xB4lQ==} + engines: {node: '>=8'} + dependencies: + '@sentry/core': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + cookie: 0.4.2 + https-proxy-agent: 5.0.1 + lru_map: 0.3.3 + tslib: 1.14.1 + transitivePeerDependencies: + - supports-color + dev: false + /@sentry/react/7.36.0_react@18.2.0: resolution: {integrity: sha512-ttrRqbgeqvkV3DwkDRZC/V8OEnBKGpQf4dKpG8oMlfdVbMTINzrxYUgkhi9xAkxkH9O+vj3Md8L3Rdqw/SDwKQ==} engines: {node: '>=8'} @@ -4312,6 +4389,20 @@ packages: tslib: 1.14.1 dev: false + /@sentry/react/7.39.0_react@18.2.0: + resolution: {integrity: sha512-hoElDK2Z5RwBlXiIQEjmZcxImP6ZjZRAKvycVq6dEDwghmL2bJeTVyCTqCh+YnyYzUXVW+WJRaWHexSZuTHbvg==} + engines: {node: '>=8'} + peerDependencies: + react: 15.x || 16.x || 17.x || 18.x + dependencies: + '@sentry/browser': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + hoist-non-react-statics: 3.3.2 + react: 18.2.0 + tslib: 1.14.1 + dev: false + /@sentry/replay/7.36.0: resolution: {integrity: sha512-wNbME74/2GtkqdDXz7NaStyfPWVLjYmN9TFWvu6E9sNl9pkDDvii/Qc8F6ps1wa7bozkKcWRHgNvYiGCxUBHcg==} engines: {node: '>=12'} @@ -4321,6 +4412,15 @@ packages: '@sentry/utils': 7.36.0 dev: false + /@sentry/replay/7.39.0: + resolution: {integrity: sha512-pL5JMk/fOx9KFbNBnqoJQwx7X0ZM4BrypWMzkGKsoENjm5sn6pB/dtO4N4k3gmIy929a89d1qL+HbxHAAxFylQ==} + engines: {node: '>=12'} + dependencies: + '@sentry/core': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + dev: false + /@sentry/tracing/7.36.0: resolution: {integrity: sha512-5R5mfWMDncOcTMmmyYMjgus1vZJzIFw4LHaSbrX7e1IRNT/6vFyNeVxATa2ePXb9mI3XHo5f2p7YrnreAtaSXw==} engines: {node: '>=8'} @@ -4331,11 +4431,26 @@ packages: tslib: 1.14.1 dev: false + /@sentry/tracing/7.39.0: + resolution: {integrity: sha512-bSRdUMzp/n54J+Qf4hHC4WVvdv4vZEv3NEbNNsnIZNAhnVAq6QB9VzsGRJZ12PqxJU3StDuqLiZFVOmGxETCkQ==} + engines: {node: '>=8'} + dependencies: + '@sentry/core': 7.39.0 + '@sentry/types': 7.39.0 + '@sentry/utils': 7.39.0 + tslib: 1.14.1 + dev: false + /@sentry/types/7.36.0: resolution: {integrity: sha512-uvfwUn3okAWSZ948D/xqBrkc3Sn6TeHUgi3+p/dTTNGAXXskzavgfgQ4rSW7f3YD4LL+boZojpoIARVLodMGuA==} engines: {node: '>=8'} dev: false + /@sentry/types/7.39.0: + resolution: {integrity: sha512-5Y83Y8O3dT5zT2jTKEIPMcpn5lUm05KRMaCXuw0sRsv4r9TbBUKeqiSU1LjowT8rB/XNy8m7DHav8+NmogPaJw==} + engines: {node: '>=8'} + dev: false + /@sentry/utils/7.36.0: resolution: {integrity: sha512-mgDi5X5Bm0sydCzXpnyKD/sD98yc2qnKXyRdNX4HRRwruhC/P53LT0hGhZXsyqsB/l8OAMl0zWXJLg0xONQsEw==} engines: {node: '>=8'} @@ -4344,6 +4459,14 @@ packages: tslib: 1.14.1 dev: false + /@sentry/utils/7.39.0: + resolution: {integrity: sha512-/ZxlPgm1mGgmuMckCTc9iyqDuFTEYNEoMB53IjVFz8ann+37OiWB7Py/QV1rEEsv3xKrGbA8thhRhV9E1sjTlQ==} + engines: {node: '>=8'} + dependencies: + '@sentry/types': 7.39.0 + tslib: 1.14.1 + dev: false + /@sentry/webpack-plugin/1.20.0: resolution: {integrity: sha512-Ssj1mJVFsfU6vMCOM2d+h+KQR7QHSfeIP16t4l20Uq/neqWXZUQ2yvQfe4S3BjdbJXz/X4Rw8Hfy1Sd0ocunYw==} engines: {node: '>= 8'}