Sentry improvements (#652)

* Update Sentry in CMS

update turbo

Add test logs for cms

test sentry

Update sentry config and next config

* resolve conflict

* Add changesets

* Remove test code

.changeset/short-ligers-dance.md

@@ -0,0 +1,14 @@
+---
+"saleor-app-emails-and-messages": patch
+"saleor-app-data-importer": patch
+"saleor-app-products-feed": patch
+"saleor-app-invoices": patch
+"saleor-app-klaviyo": patch
+"saleor-app-search": patch
+"saleor-app-slack": patch
+"saleor-app-taxes": patch
+"saleor-app-cms": patch
+"saleor-app-crm": patch
+---
+
+Updated Sentry package and config. Set Sentry release to match package.json version. Now Sentry will use semver version instead a commit

apps/cms/.gitignore

@@ -0,0 +1,3 @@
+
+# Sentry Auth Token
+.sentryclirc

apps/cms/next.config.js

@@ -1,20 +1,28 @@
-// 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");
 
 const isSentryPropertiesInEnvironment =
   process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
 /** @type {import('next').NextConfig} */
-module.exports = {
+const nextConfig = {
   reactStrictMode: true,
-  sentry: {
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
-  },
   transpilePackages: ["@saleor/apps-shared"],
 };
 
-module.exports = withSentryConfig(module.exports, { silent: true }, { hideSourcemaps: true });
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
+  },
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/cms/package.json

@@ -20,7 +20,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "^0.7.2",
-    "@sentry/nextjs": "^7.43.0",
+    "@sentry/nextjs": "7.55.2",
     "@urql/exchange-auth": "^2.1.4",
     "clsx": "^1.2.1",
     "graphql": "16.6.0",

apps/cms/sentry.client.config.js

@@ -1,17 +0,0 @@
-// 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
-});

apps/cms/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/cms/sentry.edge.config.js

@@ -1,17 +0,0 @@
-// 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
-});

apps/cms/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/cms/sentry.server.config.js

@@ -1,17 +0,0 @@
-// 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
-});

apps/cms/sentry.server.config.ts

@@ -5,17 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
-
-const SENTRY_DSN = process.env.SENTRY_DSN
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_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
-   */
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/cms/src/modules/provider-instances/ui/provider-instance-configuration-form.tsx

@@ -60,6 +60,7 @@ export const ProviderInstanceConfigurationForm = <TProvider extends CMSProviderS
 
   React.useEffect(() => {
     resetField("providerName" as Path<ProvidersSchema[TProvider]>, {
+      // @ts-ignore todo
       defaultValue: provider.name,
     });
 

apps/cms/turbo.json

@@ -12,7 +12,13 @@
         "VERCEL_URL",
         "REST_APL_ENDPOINT",
         "REST_APL_TOKEN",
-        "ALLOWED_DOMAIN_PATTERN"
+        "ALLOWED_DOMAIN_PATTERN",
+        "NEXT_PUBLIC_SENTRY_DSN",
+        "SENTRY_ENV",
+        "SENTRY_PROJECT",
+        "SENTRY_ORG",
+        "SENTRY_AUTH_TOKEN",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/crm/next.config.js

@@ -1,4 +1,5 @@
 const { z } = require("zod");
+const { withSentryConfig } = require("@sentry/nextjs");
 
 const RequiredEnvs = z.object({
   MAILCHIMP_CLIENT_ID: z.string().min(5),
@@ -6,7 +7,7 @@ const RequiredEnvs = z.object({
 });
 
 /** @type {import('next').NextConfig} */
-module.exports = () => {
+const nextConfig = () => {
   try {
     RequiredEnvs.parse(process.env);
   } catch (e) {
@@ -21,49 +22,23 @@ module.exports = () => {
   };
 };
 
-const isSentryEnvAvailable =
-  process.env.SENTRY_AUTH_TOKEN &&
-  process.env.SENTRY_PROJECT &&
-  process.env.SENTRY_ORG &&
-  process.env.SENTRY_AUTH_TOKEN;
+const isSentryPropertiesInEnvironment =
+  process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
-const { withSentryConfig } = require("@sentry/nextjs");
-
-module.exports = withSentryConfig(
-  module.exports,
+const configWithSentry = withSentryConfig(
+  nextConfig,
   {
-    /*
-     * For all available options, see:
-     * https://github.com/getsentry/sentry-webpack-plugin#options
-     */
-
-    // Suppresses source map uploading logs during build
     silent: true,
-
     org: process.env.SENTRY_ORG,
     project: process.env.SENTRY_PROJECT,
   },
   {
-    disableClientWebpackPlugin: !isSentryEnvAvailable,
-    disableServerWebpackPlugin: !isSentryEnvAvailable,
-    /*
-     * For all available options, see:
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
-     */
-
-    // Upload a larger set of source maps for prettier stack traces (increases build time)
     widenClientFileUpload: true,
-
-    // Transpiles SDK to be compatible with IE11 (increases bundle size)
     transpileClientSDK: true,
-
-    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
     tunnelRoute: "/monitoring",
-
-    // Hides source maps from generated client bundles
     hideSourceMaps: true,
-
-    // Automatically tree-shake Sentry logger statements to reduce bundle size
     disableLogger: true,
   }
 );
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/crm/package.json

@@ -16,7 +16,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "0.8.0-pre.95",
-    "@sentry/nextjs": "^7.52.1",
+    "@sentry/nextjs": "7.55.2",
     "@tanstack/react-query": "^4.28.0",
     "@trpc/client": "^10.18.0",
     "@trpc/next": "^10.18.0",

apps/crm/sentry.client.config.ts

@@ -5,12 +5,13 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
@@ -31,4 +32,6 @@ Sentry.init({
       blockAllMedia: true,
     }),
   ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/crm/sentry.edge.config.ts

@@ -6,13 +6,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/crm/sentry.server.config.ts

@@ -5,13 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/crm/turbo.json

@@ -18,7 +18,8 @@
         "NEXT_PUBLIC_SENTRY_DSN",
         "SENTRY_PROJECT",
         "SENTRY_AUTH_TOKEN",
-        "SENTRY_ORG"
+        "SENTRY_ORG",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/data-importer/next.config.js

@@ -1,27 +1,28 @@
-/*
- * 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");
 
 const isSentryPropertiesInEnvironment =
   process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
-/**
- * @type {import('next').NextConfig}
- */
-module.exports = {
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   reactStrictMode: true,
-  experimental: {
-    esmExternals: true,
-  },
-  transpilePackages: ["nuvo-react", "@saleor/apps-shared"],
-  sentry: {
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
-  },
+  transpilePackages: ["@saleor/apps-shared", "nuvo-react"],
 };
 
-module.exports = withSentryConfig(module.exports, { silent: true }, { hideSourcemaps: true });
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
+  },
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/data-importer/package.json

@@ -18,7 +18,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "^0.7.2",
-    "@sentry/nextjs": "^7.39.0",
+    "@sentry/nextjs": "7.55.2",
     "@urql/exchange-auth": "^2.1.4",
     "@vitejs/plugin-react": "4.0.0",
     "clsx": "^1.2.1",

apps/data-importer/sentry.client.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/data-importer/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/data-importer/sentry.edge.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/data-importer/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/data-importer/sentry.server.config.ts

@@ -5,17 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
-
-const SENTRY_DSN = process.env.SENTRY_DSN
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_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
-   */
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/data-importer/turbo.json

@@ -20,7 +20,9 @@
         "SENTRY_AUTH_TOKEN",
         "SENTRY_PROJECT",
         "SENTRY_ORG",
-        "SENTRY_DSN"
+        "SENTRY_DSN",
+        "SENTRY_ENVIRONMENT",
+        "NEXT_PUBLIC_SENTRY_DSN"
       ]
     }
   }

apps/emails-and-messages/next.config.js

@@ -1,52 +1,28 @@
+const { withSentryConfig } = require("@sentry/nextjs");
+
+const isSentryPropertiesInEnvironment =
+  process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
+
 /** @type {import('next').NextConfig} */
-module.exports = {
+const nextConfig = {
   reactStrictMode: true,
   transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
 };
 
-const isSentryEnvAvailable =
-  process.env.SENTRY_AUTH_TOKEN &&
-  process.env.SENTRY_PROJECT &&
-  process.env.SENTRY_ORG &&
-  process.env.SENTRY_AUTH_TOKEN;
-
-const { withSentryConfig } = require("@sentry/nextjs");
-
-module.exports = withSentryConfig(
-  module.exports,
+const configWithSentry = withSentryConfig(
+  nextConfig,
   {
-    /*
-     * For all available options, see:
-     * https://github.com/getsentry/sentry-webpack-plugin#options
-     */
-
-    // Suppresses source map uploading logs during build
     silent: true,
-
     org: process.env.SENTRY_ORG,
     project: process.env.SENTRY_PROJECT,
   },
   {
-    disableClientWebpackPlugin: !isSentryEnvAvailable,
-    disableServerWebpackPlugin: !isSentryEnvAvailable,
-    /*
-     * For all available options, see:
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
-     */
-
-    // Upload a larger set of source maps for prettier stack traces (increases build time)
     widenClientFileUpload: true,
-
-    // Transpiles SDK to be compatible with IE11 (increases bundle size)
     transpileClientSDK: true,
-
-    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
     tunnelRoute: "/monitoring",
-
-    // Hides source maps from generated client bundles
     hideSourceMaps: true,
-
-    // Automatically tree-shake Sentry logger statements to reduce bundle size
     disableLogger: true,
   }
 );
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/emails-and-messages/package.json

@@ -21,7 +21,7 @@
     "@saleor/react-hook-form-macaw": "workspace:*",
     "@sendgrid/client": "^7.7.0",
     "@sendgrid/mail": "^7.7.0",
-    "@sentry/nextjs": "^7.52.1",
+    "@sentry/nextjs": "7.55.2",
     "@tanstack/react-query": "^4.24.4",
     "@trpc/client": "^10.13.0",
     "@trpc/next": "^10.13.0",

apps/emails-and-messages/sentry.client.config.ts

@@ -5,12 +5,13 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
@@ -31,4 +32,6 @@ Sentry.init({
       blockAllMedia: true,
     }),
   ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/emails-and-messages/sentry.edge.config.ts

@@ -6,13 +6,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/emails-and-messages/sentry.server.config.ts

@@ -5,13 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/emails-and-messages/turbo.json

@@ -17,7 +17,9 @@
         "SENTRY_ORG",
         "SENTRY_PROJECT",
         "SENTRY_DSN",
-        "SENTRY_AUTH_TOKEN"
+        "SENTRY_AUTH_TOKEN",
+        "NEXT_PUBLIC_SENTRY_DSN",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/invoices/next.config.js

@@ -1,54 +1,28 @@
-/*
- * 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/
- */
-
 const { withSentryConfig } = require("@sentry/nextjs");
 
 const isSentryPropertiesInEnvironment =
   process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
-/**
- * @type import("@sentry/nextjs").ExportedNextConfig
- */
-const moduleExports = {
-  sentry: {
-    /*
-     * Use `hidden-source-map` rather than `source-map` as the Webpack `devtool`
-     * for client-side builds. (This will be the default starting in
-     * `@sentry/nextjs` version 8.0.0.) See
-     * https://webpack.js.org/configuration/devtool/ and
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-hidden-source-map
-     * for more information.
-     */
-    hideSourceMaps: true,
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
-  },
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   reactStrictMode: true,
-  transpilePackages: ["@saleor/apps-shared"],
+  transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
 };
 
-const sentryWebpackPluginOptions = {
-  /*
-   * Additional config options for the Sentry Webpack plugin. Keep in mind that
-   * the following options are set automatically, and overriding them is not
-   * recommended:
-   *   release, url, org, project, authToken, configFile, stripPrefix,
-   *   urlPrefix, include, ignore
-   */
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
+  },
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
 
-  silent: true, // Suppresses all logs
-  /*
-   * For all available options, see:
-   * https://github.com/getsentry/sentry-webpack-plugin#options.
-   */
-};
-
-/*
- * Make sure adding Sentry options is the last code to run before exporting, to
- * ensure that your source maps include changes from all other Webpack plugins
- */
-module.exports = withSentryConfig(moduleExports, sentryWebpackPluginOptions);
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/invoices/package.json

@@ -16,7 +16,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "0.8.0-pre.95",
-    "@sentry/nextjs": "^7.36.0",
+    "@sentry/nextjs": "7.55.2",
     "@tanstack/react-query": "^4.24.4",
     "@trpc/client": "^10.10.0",
     "@trpc/next": "^10.10.0",

apps/invoices/sentry.client.config.js

@@ -1,21 +0,0 @@
-/*
- * 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;
-
-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
-   */
-});

apps/invoices/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/invoices/sentry.edge.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/invoices/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/invoices/sentry.server.config.ts

@@ -5,17 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
-
-const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN;
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_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
-   */
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/invoices/turbo.json

@@ -18,7 +18,9 @@
         "SENTRY_PROJECT",
         "SENTRY_DSN",
         "SENTRY_ORG",
-        "SENTRY_AUTH_TOKEN"
+        "SENTRY_AUTH_TOKEN",
+        "NEXT_PUBLIC_SENTRY_DSN",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/klaviyo/next.config.js

@@ -1,5 +1,3 @@
-/** @type {import('next').NextConfig} */
-
 const { withSentryConfig } = require("@sentry/nextjs");
 
 const isSentryPropertiesInEnvironment =
@@ -8,11 +6,7 @@ const isSentryPropertiesInEnvironment =
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  sentry: {
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
-  },
-  transpilePackages: ["@saleor/apps-shared"],
+  transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
   redirects() {
     return [
       {
@@ -24,24 +18,20 @@ const nextConfig = {
   },
 };
 
-const sentryWebpackPluginOptions = {
-  /*
-   * Additional config options for the Sentry Webpack plugin. Keep in mind that
-   * the following options are set automatically, and overriding them is not
-   * recommended:
-   *   release, url, org, project, authToken, configFile, stripPrefix,
-   *   urlPrefix, include, ignore
-   */
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
+  },
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
 
-  silent: true, // Suppresses all logs
-  /*
-   * For all available options, see:
-   * https://github.com/getsentry/sentry-webpack-plugin#options.
-   */
-};
-
-/*
- * Make sure adding Sentry options is the last code to run before exporting, to
- * ensure that your source maps include changes from all other Webpack plugins
- */
-module.exports = withSentryConfig(nextConfig, sentryWebpackPluginOptions);
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/klaviyo/package.json

@@ -17,7 +17,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "^0.7.2",
-    "@sentry/nextjs": "^7.36.0",
+    "@sentry/nextjs": "7.55.2",
     "@urql/exchange-auth": "^2.1.4",
     "clsx": "^1.2.1",
     "graphql": "16.6.0",

apps/klaviyo/sentry.client.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-   */
-});

apps/klaviyo/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/klaviyo/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/klaviyo/sentry.server.config.ts

@@ -5,17 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
-
-const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN;
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_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
-   */
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/klaviyo/turbo.json

@@ -17,7 +17,8 @@
         "SENTRY_ORG",
         "SENTRY_PROJECT",
         "SENTRY_AUTH_TOKEN",
-        "NEXT_PUBLIC_VERCEL_ENV"
+        "NEXT_PUBLIC_VERCEL_ENV",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/products-feed/next.config.js

@@ -1,53 +1,28 @@
+const { withSentryConfig } = require("@sentry/nextjs");
+
+const isSentryPropertiesInEnvironment =
+  process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
+
 /** @type {import('next').NextConfig} */
-module.exports = {
+const nextConfig = {
   reactStrictMode: true,
   transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
 };
 
-const isSentryEnvAvailable =
-  process.env.SENTRY_AUTH_TOKEN &&
-  process.env.SENTRY_PROJECT &&
-  process.env.SENTRY_ORG &&
-  process.env.SENTRY_AUTH_TOKEN &&
-  process.env.NEXT_PUBLIC_SENTRY_DSN;
-
-const { withSentryConfig } = require("@sentry/nextjs");
-
-module.exports = withSentryConfig(
-  module.exports,
+const configWithSentry = withSentryConfig(
+  nextConfig,
   {
-    /*
-     * For all available options, see:
-     * https://github.com/getsentry/sentry-webpack-plugin#options
-     */
-
-    // Suppresses source map uploading logs during build
     silent: true,
-
     org: process.env.SENTRY_ORG,
     project: process.env.SENTRY_PROJECT,
   },
   {
-    disableServerWebpackPlugin: !isSentryEnvAvailable,
-    disableClientWebpackPlugin: !isSentryEnvAvailable,
-    /*
-     * For all available options, see:
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
-     */
-
-    // Upload a larger set of source maps for prettier stack traces (increases build time)
     widenClientFileUpload: true,
-
-    // Transpiles SDK to be compatible with IE11 (increases bundle size)
     transpileClientSDK: true,
-
-    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
     tunnelRoute: "/monitoring",
-
-    // Hides source maps from generated client bundles
     hideSourceMaps: true,
-
-    // Automatically tree-shake Sentry logger statements to reduce bundle size
     disableLogger: true,
   }
 );
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/products-feed/package.json

@@ -19,7 +19,7 @@
     "@saleor/apps-ui": "workspace:*",
     "@saleor/macaw-ui": "0.8.0-pre.95",
     "@saleor/react-hook-form-macaw": "workspace:*",
-    "@sentry/nextjs": "^7.52.1",
+    "@sentry/nextjs": "7.55.2",
     "@tanstack/react-query": "^4.24.2",
     "@trpc/client": "^10.9.0",
     "@trpc/next": "^10.9.0",

apps/products-feed/sentry.client.config.ts

@@ -5,12 +5,13 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
@@ -31,4 +32,6 @@ Sentry.init({
       blockAllMedia: true,
     }),
   ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/products-feed/sentry.edge.config.ts

@@ -6,13 +6,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/products-feed/sentry.server.config.ts

@@ -5,13 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/products-feed/turbo.json

@@ -19,7 +19,8 @@
         "NEXT_PUBLIC_VERCEL_ENV",
         "FEED_CACHE_MAX_AGE",
         "VERCEL_URL",
-        "PORT"
+        "PORT",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/search/next.config.js

@@ -1,62 +1,28 @@
-/*
- * 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/
- */
-
 const { withSentryConfig } = require("@sentry/nextjs");
 
 const isSentryPropertiesInEnvironment =
   process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
-/**
- * @type {import('next').NextConfig}
- */
-const moduleExports = {
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   reactStrictMode: true,
-  images: {
-    remotePatterns: [
-      {
-        protocol: "https",
-        hostname: "**",
-      },
-    ],
-  },
   transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
-  sentry: {
-    /*
-     * Use `hidden-source-map` rather than `source-map` as the Webpack `devtool`
-     * for client-side builds. (This will be the default starting in
-     * `@sentry/nextjs` version 8.0.0.) See
-     * https://webpack.js.org/configuration/devtool/ and
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-hidden-source-map
-     * for more information.
-     */
-    hideSourceMaps: true,
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
+};
+
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
   },
-};
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
 
-const sentryWebpackPluginOptions = {
-  /*
-   * Additional config options for the Sentry Webpack plugin. Keep in mind that
-   * the following options are set automatically, and overriding them is not
-   * recommended:
-   *   release, url, org, project, authToken, configFile, stripPrefix,
-   *   urlPrefix, include, ignore
-   */
-
-  silent: true, // Suppresses all logs
-  /*
-   * For all available options, see:
-   * https://github.com/getsentry/sentry-webpack-plugin#options.
-   */
-};
-
-/*
- * Make sure adding Sentry options is the last code to run before exporting, to
- * ensure that your source maps include changes from all other Webpack plugins
- */
-module.exports = withSentryConfig(moduleExports, sentryWebpackPluginOptions);
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/search/package.json

@@ -18,7 +18,7 @@
     "@saleor/apps-ui": "workspace:*",
     "@saleor/macaw-ui": "0.8.0-pre.95",
     "@saleor/react-hook-form-macaw": "workspace:*",
-    "@sentry/nextjs": "^7.46.0",
+    "@sentry/nextjs": "7.55.2",
     "@types/debug": "^4.1.7",
     "@urql/exchange-auth": "^2.1.4",
     "algoliasearch": "4.14.2",

apps/search/sentry.client.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/search/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/search/sentry.edge.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/search/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/search/sentry.server.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-
-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
-   */
-});

apps/search/sentry.server.config.ts

@@ -0,0 +1,20 @@
+/*
+ * 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";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/search/turbo.json

@@ -15,7 +15,9 @@
         "SENTRY_PROJECT",
         "SENTRY_DSN",
         "SENTRY_ORG",
-        "NEXT_PUBLIC_VERCEL_ENV"
+        "NEXT_PUBLIC_VERCEL_ENV",
+        "NEXT_PUBLIC_SENTRY_DSN",
+        "SENTRY_ENVIRONMENT"
       ]
     }
   }

apps/slack/next.config.js

@@ -1,52 +1,28 @@
-/*
- * 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/
- */
-
 const { withSentryConfig } = require("@sentry/nextjs");
 
 const isSentryPropertiesInEnvironment =
   process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
 
-const moduleExports = {
-  transpilePackages: ["@saleor/apps-shared"],
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   reactStrictMode: true,
+  transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
+};
 
-  sentry: {
-    disableServerWebpackPlugin: !isSentryPropertiesInEnvironment,
-    disableClientWebpackPlugin: !isSentryPropertiesInEnvironment,
-    /*
-     * Use `hidden-source-map` rather than `source-map` as the Webpack `devtool`
-     * for client-side builds. (This will be the default starting in
-     * `@sentry/nextjs` version 8.0.0.) See
-     * https://webpack.js.org/configuration/devtool/ and
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-hidden-source-map
-     * for more information.
-     */
-    hideSourceMaps: true,
+const configWithSentry = withSentryConfig(
+  nextConfig,
+  {
+    silent: true,
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
   },
-};
+  {
+    widenClientFileUpload: true,
+    transpileClientSDK: true,
+    tunnelRoute: "/monitoring",
+    hideSourceMaps: true,
+    disableLogger: true,
+  }
+);
 
-const sentryWebpackPluginOptions = {
-  /*
-   * Additional config options for the Sentry Webpack plugin. Keep in mind that
-   * the following options are set automatically, and overriding them is not
-   * recommended:
-   *   release, url, org, project, authToken, configFile, stripPrefix,
-   *   urlPrefix, include, ignore
-   */
-
-  silent: true, // Suppresses all logs
-  /*
-   * For all available options, see:
-   * https://github.com/getsentry/sentry-webpack-plugin#options.
-   */
-};
-
-/*
- * Make sure adding Sentry options is the last code to run before exporting, to
- * ensure that your source maps include changes from all other Webpack plugins
- */
-module.exports = withSentryConfig(moduleExports, sentryWebpackPluginOptions);
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/slack/package.json

@@ -17,7 +17,7 @@
     "@saleor/app-sdk": "0.40.1",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/macaw-ui": "^0.7.2",
-    "@sentry/nextjs": "^7.30.0",
+    "@sentry/nextjs": "7.55.2",
     "@urql/exchange-auth": "^2.1.4",
     "clsx": "^1.2.1",
     "eslint": "8.42.0",

apps/slack/sentry.client.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-   */
-});

apps/slack/sentry.client.config.ts

@@ -0,0 +1,37 @@
+/*
+ * This file configures the initialization of Sentry on the client.
+ * The config you add here will be used whenever a users loads a page in their browser.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+
+  replaysOnErrorSampleRate: 1.0,
+
+  /*
+   * 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,
+
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  integrations: [
+    new Sentry.Replay({
+      // Additional Replay configuration goes in here, for example:
+      maskAllText: true,
+      blockAllMedia: true,
+    }),
+  ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/slack/sentry.edge.config.js

@@ -1,21 +0,0 @@
-/*
- * 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
-   */
-});

apps/slack/sentry.edge.config.ts

@@ -0,0 +1,21 @@
+/*
+ * This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+ * The config you add here will be used whenever one of the edge features is loaded.
+ * Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+ * https://docs.sentry.io/platforms/javascript/guides/nextjs/
+ */
+
+import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/slack/sentry.server.config.ts

@@ -0,0 +1,20 @@
+/*
+ * 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";
+import pkg from "./package.json";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 0.5,
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
+});

apps/slack/turbo.json

@@ -17,6 +17,7 @@
         "SENTRY_ORG",
         "SENTRY_PROJECT",
         "SENTRY_AUTH_TOKEN",
+        "SENTRY_ENVIRONMENT",
         "NEXT_PUBLIC_VERCEL_ENV"
       ]
     }

apps/taxes/next.config.js

@@ -1,52 +1,28 @@
+const { withSentryConfig } = require("@sentry/nextjs");
+
+const isSentryPropertiesInEnvironment =
+  process.env.SENTRY_AUTH_TOKEN && process.env.SENTRY_PROJECT && process.env.SENTRY_ORG;
+
 /** @type {import('next').NextConfig} */
-const config = {
+const nextConfig = {
   reactStrictMode: true,
   transpilePackages: ["@saleor/apps-shared", "@saleor/apps-ui", "@saleor/react-hook-form-macaw"],
 };
 
-const isSentryEnvAvailable =
-  process.env.SENTRY_AUTH_TOKEN &&
-  process.env.SENTRY_PROJECT &&
-  process.env.SENTRY_ORG &&
-  process.env.SENTRY_AUTH_TOKEN;
-
-const { withSentryConfig } = require("@sentry/nextjs");
-
-module.exports = withSentryConfig(
-  config,
+const configWithSentry = withSentryConfig(
+  nextConfig,
   {
-    /*
-     * For all available options, see:
-     * https://github.com/getsentry/sentry-webpack-plugin#options
-     */
-
-    // Suppresses source map uploading logs during build
     silent: true,
-
     org: process.env.SENTRY_ORG,
     project: process.env.SENTRY_PROJECT,
   },
   {
-    disableClientWebpackPlugin: !isSentryEnvAvailable,
-    disableServerWebpackPlugin: !isSentryEnvAvailable,
-    /*
-     * For all available options, see:
-     * https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
-     */
-
-    // Upload a larger set of source maps for prettier stack traces (increases build time)
     widenClientFileUpload: true,
-
-    // Transpiles SDK to be compatible with IE11 (increases bundle size)
     transpileClientSDK: true,
-
-    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
     tunnelRoute: "/monitoring",
-
-    // Hides source maps from generated client bundles
     hideSourceMaps: true,
-
-    // Automatically tree-shake Sentry logger statements to reduce bundle size
     disableLogger: true,
   }
 );
+
+module.exports = isSentryPropertiesInEnvironment ? configWithSentry : nextConfig;

apps/taxes/package.json

@@ -18,7 +18,7 @@
     "@saleor/apps-ui": "workspace:*",
     "@saleor/macaw-ui": "^0.8.0-pre.84",
     "@saleor/react-hook-form-macaw": "workspace:*",
-    "@sentry/nextjs": "^7.45.0",
+    "@sentry/nextjs": "7.55.2",
     "@tanstack/react-query": "^4.19.1",
     "@trpc/client": "^10.9.0",
     "@trpc/next": "^10.9.0",
@@ -28,7 +28,7 @@
     "avatax": "^23.3.2",
     "clsx": "^1.2.1",
     "dotenv": "^16.0.3",
-    "graphql": "^16.6.0",
+    "graphql": "16.6.0",
     "graphql-tag": "^2.12.6",
     "jotai": "^2.0.0",
     "jsdom": "^20.0.3",

apps/taxes/sentry.client.config.ts

@@ -5,12 +5,13 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
@@ -31,4 +32,6 @@ Sentry.init({
       blockAllMedia: true,
     }),
   ],
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/taxes/sentry.edge.config.ts

@@ -6,13 +6,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/taxes/sentry.server.config.ts

@@ -5,13 +5,16 @@
  */
 
 import * as Sentry from "@sentry/nextjs";
+import pkg from "./package.json";
 
 Sentry.init({
-  dsn: process.env.SENTRY_DSN,
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1,
+  tracesSampleRate: 0.5,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  environment: process.env.SENTRY_ENVIRONMENT,
+  release: `${pkg.name}@${pkg.version}`,
 });

apps/taxes/turbo.json

@@ -16,7 +16,9 @@
         "SENTRY_ORG",
         "SENTRY_PROJECT",
         "SENTRY_DSN",
-        "SENTRY_AUTH_TOKEN"
+        "SENTRY_AUTH_TOKEN",
+        "SENTRY_ENVIRONMENT",
+        "NEXT_PUBLIC_SENTRY_DSN"
       ]
     }
   }

package.json

@@ -25,7 +25,7 @@
     "next": "13.3.0",
     "prettier": "^2.8.4",
     "syncpack": "10.5.1",
-    "turbo": "1.10.1"
+    "turbo": "1.10.3"
   },
   "engines": {
     "node": ">=18.0.0"

packages/eslint-config-saleor/package.json

@@ -5,7 +5,7 @@
     "eslint": "8.42.0",
     "eslint-config-next": "13.3.4",
     "eslint-config-prettier": "8.8.0",
-    "eslint-config-turbo": "1.10.1",
+    "eslint-config-turbo": "1.10.3",
     "eslint-plugin-react": "7.32.2",
     "next": "13.3.0",
     "typescript": "5.1.3"