@sentry/wizard 4.0.0 → 4.0.1

package/src/remix/codemods/root-v2.ts

@@ -1,153 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unsafe-member-access */
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-call */
-/* eslint-disable @typescript-eslint/no-unsafe-argument */
-
-import * as recast from 'recast';
-import * as path from 'path';
-
-import type { ExportNamedDeclaration, Program } from '@babel/types';
-
-// @ts-expect-error - magicast is ESM and TS complains about that. It works though
-import { loadFile, writeFile } from 'magicast';
-
-import { ERROR_BOUNDARY_TEMPLATE_V2 } from '../templates';
-import { hasSentryContent } from '../utils';
-import { wrapAppWithSentry } from './root-common';
-
-export async function instrumentRootRouteV2(
-  rootFileName: string,
-): Promise<void> {
-  const rootRouteAst = await loadFile(
-    path.join(process.cwd(), 'app', rootFileName),
-  );
-
-  const exportsAst = rootRouteAst.exports.$ast as Program;
-
-  const namedExports = exportsAst.body.filter(
-    (node) => node.type === 'ExportNamedDeclaration',
-  ) as ExportNamedDeclaration[];
-
-  let foundErrorBoundary = false;
-
-  namedExports.forEach((namedExport) => {
-    const declaration = namedExport.declaration;
-
-    if (!declaration) {
-      return;
-    }
-
-    if (declaration.type === 'FunctionDeclaration') {
-      if (declaration.id?.name === 'ErrorBoundary') {
-        foundErrorBoundary = true;
-      }
-    } else if (declaration.type === 'VariableDeclaration') {
-      const declarations = declaration.declarations;
-
-      declarations.forEach((declaration) => {
-        // @ts-expect-error - id should always have a name in this case
-        if (declaration.id?.name === 'ErrorBoundary') {
-          foundErrorBoundary = true;
-        }
-      });
-    }
-  });
-
-  if (!foundErrorBoundary) {
-    rootRouteAst.imports.$add({
-      from: '@sentry/remix',
-      imported: 'captureRemixErrorBoundaryError',
-      local: 'captureRemixErrorBoundaryError',
-    });
-
-    rootRouteAst.imports.$add({
-      from: '@remix-run/react',
-      imported: 'useRouteError',
-      local: 'useRouteError',
-    });
-
-    recast.visit(rootRouteAst.$ast, {
-      visitExportDefaultDeclaration(path) {
-        const implementation = recast.parse(ERROR_BOUNDARY_TEMPLATE_V2).program
-          .body[0];
-
-        path.insertBefore(
-          recast.types.builders.exportDeclaration(false, implementation),
-        );
-
-        this.traverse(path);
-      },
-    });
-    // If there is already a ErrorBoundary export, and it doesn't have Sentry content
-  } else if (!hasSentryContent(rootFileName, rootRouteAst.$code)) {
-    rootRouteAst.imports.$add({
-      from: '@sentry/remix',
-      imported: 'captureRemixErrorBoundaryError',
-      local: 'captureRemixErrorBoundaryError',
-    });
-
-    wrapAppWithSentry(rootRouteAst, rootFileName);
-
-    recast.visit(rootRouteAst.$ast, {
-      visitExportNamedDeclaration(path) {
-        // Find ErrorBoundary export
-        if (path.value.declaration?.id?.name === 'ErrorBoundary') {
-          const errorBoundaryExport = path.value.declaration;
-
-          let errorIdentifier;
-
-          // check if useRouteError is called
-          recast.visit(errorBoundaryExport, {
-            visitVariableDeclaration(path) {
-              const variableDeclaration = path.value.declarations[0];
-              const initializer = variableDeclaration.init;
-
-              if (
-                initializer.type === 'CallExpression' &&
-                initializer.callee.name === 'useRouteError'
-              ) {
-                errorIdentifier = variableDeclaration.id.name;
-              }
-
-              this.traverse(path);
-            },
-          });
-
-          // We don't have an errorIdentifier, which means useRouteError is not called / imported
-          // We need to add it and capture the error
-          if (!errorIdentifier) {
-            rootRouteAst.imports.$add({
-              from: '@remix-run/react',
-              imported: 'useRouteError',
-              local: 'useRouteError',
-            });
-
-            const useRouteErrorCall = recast.parse(
-              `const error = useRouteError();`,
-            ).program.body[0];
-
-            // Insert at the top of ErrorBoundary body
-            errorBoundaryExport.body.body.splice(0, 0, useRouteErrorCall);
-          }
-
-          const captureErrorCall = recast.parse(
-            `captureRemixErrorBoundaryError(error);`,
-          ).program.body[0];
-
-          // Insert just before the the fallback page is returned
-          errorBoundaryExport.body.body.splice(
-            errorBoundaryExport.body.body.length - 1,
-            0,
-            captureErrorCall,
-          );
-        }
-        this.traverse(path);
-      },
-    });
-  }
-
-  await writeFile(
-    rootRouteAst.$ast,
-    path.join(process.cwd(), 'app', rootFileName),
-  );
-}

package/src/remix/remix-wizard.ts

@@ -1,261 +0,0 @@
-// @ts-expect-error - clack is ESM and TS complains about that. It works though
-import clack from '@clack/prompts';
-import chalk from 'chalk';
-
-import {
-  addSentryCliConfig,
-  askShouldCreateExamplePage,
-  confirmContinueIfNoOrDirtyGitRepo,
-  ensurePackageIsInstalled,
-  featureSelectionPrompt,
-  getOrAskForProjectData,
-  getPackageDotJson,
-  installPackage,
-  isUsingTypeScript,
-  printWelcome,
-  rcCliSetupConfig,
-  runPrettierIfInstalled,
-} from '../utils/clack-utils';
-import { hasPackageInstalled } from '../utils/package-json';
-import type { WizardOptions } from '../utils/types';
-import {
-  initializeSentryOnEntryClient,
-  instrumentSentryOnEntryServer,
-  updateBuildScript,
-  instrumentRootRoute,
-  isRemixV2,
-  loadRemixConfig,
-  runRemixReveal,
-  insertServerInstrumentationFile,
-  createServerInstrumentationFile,
-  updateStartScript,
-} from './sdk-setup';
-import { debug } from '../utils/debug';
-import { traceStep, withTelemetry } from '../telemetry';
-import { isHydrogenApp } from './utils';
-import { DEFAULT_URL } from '../../lib/Constants';
-import { findFile } from '../utils/ast-utils';
-import { configureVitePlugin } from '../sourcemaps/tools/vite';
-import { createExamplePage } from './sdk-example';
-
-export async function runRemixWizard(options: WizardOptions): Promise<void> {
-  return withTelemetry(
-    {
-      enabled: options.telemetryEnabled,
-      integration: 'remix',
-      wizardOptions: options,
-    },
-    () => runRemixWizardWithTelemetry(options),
-  );
-}
-
-async function runRemixWizardWithTelemetry(
-  options: WizardOptions,
-): Promise<void> {
-  const { promoCode, telemetryEnabled, forceInstall } = options;
-
-  printWelcome({
-    wizardName: 'Sentry Remix Wizard',
-    promoCode,
-    telemetryEnabled,
-  });
-
-  await confirmContinueIfNoOrDirtyGitRepo();
-
-  const remixConfig = await loadRemixConfig();
-  const packageJson = await getPackageDotJson();
-
-  // We expect `@remix-run/dev` to be installed for every Remix project
-  await ensurePackageIsInstalled(packageJson, '@remix-run/dev', 'Remix');
-
-  const { selectedProject, authToken, sentryUrl, selfHosted } =
-    await getOrAskForProjectData(options, 'javascript-remix');
-
-  await installPackage({
-    packageName: '@sentry/remix@^9',
-    packageNameDisplayLabel: '@sentry/remix',
-    alreadyInstalled: hasPackageInstalled('@sentry/remix', packageJson),
-    forceInstall,
-  });
-
-  const dsn = selectedProject.keys[0].dsn.public;
-
-  const isTS = isUsingTypeScript();
-  const isV2 = isRemixV2(remixConfig, packageJson);
-  const viteConfig = findFile('vite.config');
-  const selectedFeatures = await featureSelectionPrompt([
-    {
-      id: 'performance',
-      prompt: `Do you want to enable ${chalk.bold(
-        'Tracing',
-      )} to track the performance of your application?`,
-      enabledHint: 'recommended',
-    },
-    {
-      id: 'replay',
-      prompt: `Do you want to enable ${chalk.bold(
-        'Sentry Session Replay',
-      )} to get a video-like reproduction of errors during a user session?`,
-      enabledHint: 'recommended, but increases bundle size',
-    },
-  ] as const);
-
-  if (viteConfig) {
-    await traceStep(
-      'Update vite configuration for sourcemap uploads',
-      async () => {
-        try {
-          await configureVitePlugin({
-            orgSlug: selectedProject.organization.slug,
-            projectSlug: selectedProject.slug,
-            url: sentryUrl,
-            selfHosted,
-            authToken,
-          });
-        } catch (e) {
-          clack.log
-            .warn(`Could not update vite configuration to generate and upload sourcemaps.
-    Please update your vite configuration manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/sourcemaps/`);
-          debug(e);
-        }
-      },
-    );
-  } else {
-    await traceStep('Update build script for sourcemap uploads', async () => {
-      try {
-        await updateBuildScript({
-          org: selectedProject.organization.slug,
-          project: selectedProject.slug,
-          url: sentryUrl === DEFAULT_URL ? undefined : sentryUrl,
-          isHydrogen: isHydrogenApp(packageJson),
-        });
-
-        await addSentryCliConfig({ authToken }, rcCliSetupConfig);
-      } catch (e) {
-        clack.log
-          .warn(`Could not update build script to generate and upload sourcemaps.
-  Please update your build script manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/sourcemaps/`);
-        debug(e);
-      }
-    });
-  }
-
-  await traceStep('Instrument root route', async () => {
-    try {
-      await instrumentRootRoute(isV2, isTS);
-    } catch (e) {
-      clack.log.warn(`Could not instrument root route.
-  Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/`);
-      debug(e);
-    }
-  });
-
-  traceStep('Reveal missing entry files', () => {
-    try {
-      runRemixReveal(isTS);
-    } catch (e) {
-      clack.log.warn(`Could not run 'npx remix reveal'.
-  Please create your entry files manually`);
-      debug(e);
-    }
-  });
-
-  await traceStep('Initialize Sentry on client entry', async () => {
-    try {
-      await initializeSentryOnEntryClient(dsn, isTS, selectedFeatures);
-    } catch (e) {
-      clack.log.warn(`Could not initialize Sentry on client entry.
-  Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/`);
-      debug(e);
-    }
-  });
-
-  let instrumentationFile = '';
-
-  await traceStep('Create server instrumentation file', async () => {
-    try {
-      instrumentationFile = await createServerInstrumentationFile(
-        dsn,
-        selectedFeatures,
-      );
-    } catch (e) {
-      clack.log.warn(
-        'Could not create a server instrumentation file. Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/',
-      );
-      debug(e);
-    }
-  });
-
-  let serverFileInstrumented = false;
-
-  await traceStep(
-    'Create server instrumentation file and import it',
-    async () => {
-      try {
-        serverFileInstrumented = await insertServerInstrumentationFile(
-          dsn,
-          selectedFeatures,
-        );
-      } catch (e) {
-        clack.log.warn(
-          'Could not create a server instrumentation file. Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/',
-        );
-        debug(e);
-      }
-    },
-  );
-
-  if (!serverFileInstrumented && instrumentationFile) {
-    await traceStep(
-      'Update `start` script to import instrumentation file.',
-      async () => {
-        try {
-          await updateStartScript(instrumentationFile);
-        } catch (e) {
-          clack.log
-            .warn(`Could not automatically add Sentry initialization to server entry.
-    Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/`);
-          debug(e);
-        }
-      },
-    );
-  }
-
-  await traceStep('Instrument server `handleError`', async () => {
-    try {
-      await instrumentSentryOnEntryServer(isV2, isTS);
-    } catch (e) {
-      clack.log.warn(`Could not initialize Sentry on server entry.
-  Please do it manually using instructions from https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/`);
-      debug(e);
-    }
-  });
-
-  const shouldCreateExamplePage = await askShouldCreateExamplePage();
-
-  if (shouldCreateExamplePage) {
-    await traceStep('Create example page', async () => {
-      await createExamplePage({
-        isTS,
-        selfHosted,
-        orgSlug: selectedProject.organization.slug,
-        projectId: selectedProject.id,
-        url: sentryUrl,
-      });
-    });
-  }
-
-  await runPrettierIfInstalled();
-
-  clack.outro(`
-${chalk.green(
-  'Sentry has been successfully configured for your Remix project.',
-)}
-
-${chalk.cyan('You can now deploy your project to see Sentry in action.')}
-
-${chalk.cyan(
-  `To learn more about how to use Sentry with Remix, visit our documentation:
-https://docs.sentry.io/platforms/javascript/guides/remix/`,
-)}`);
-}

package/src/remix/sdk-example.ts

@@ -1,120 +0,0 @@
-import * as fs from 'fs';
-import * as path from 'path';
-// @ts-ignore - clack is ESM and TS complains about that. It works though
-import clack from '@clack/prompts';
-
-/**
- * Creates an example Remix page to test Sentry
- */
-export async function createExamplePage(options: {
-  selfHosted: boolean;
-  orgSlug: string;
-  projectId: string;
-  url: string;
-  isTS: boolean;
-}) {
-  const routesPath = 'app/routes';
-
-  if (!fs.existsSync(routesPath)) {
-    fs.mkdirSync(routesPath, { recursive: true });
-  }
-
-  const exampleRoutePath = `app/routes/sentry-example-page.${
-    options.isTS ? 'ts' : 'js'
-  }x`;
-
-  if (fs.existsSync(exampleRoutePath)) {
-    clack.log.warn(
-      `It seems like a sentry example page already exists (${path.basename(
-        exampleRoutePath,
-      )}). Skipping creation of example route.`,
-    );
-    return;
-  }
-
-  await fs.promises.writeFile(
-    exampleRoutePath,
-    getSentryExamplePageContents(options),
-  );
-
-  clack.log.info(`Created sentry example page at ${exampleRoutePath}.`);
-}
-
-export function getSentryExamplePageContents(options: {
-  selfHosted: boolean;
-  orgSlug: string;
-  projectId: string;
-  url: string;
-  isTS?: boolean;
-}) {
-  const issuesPageLink = options.selfHosted
-    ? `${options.url}organizations/${options.orgSlug}/issues/?project=${options.projectId}`
-    : `https://${options.orgSlug}.sentry.io/issues/?project=${options.projectId}`;
-
-  return `
-export default function SentryExamplePage() {
-    return (
-        <div>
-            <main
-            style={{
-                minHeight: "100vh",
-                display: "flex",
-                flexDirection: "column",
-                justifyContent: "center",
-                alignItems: "center",
-            }}
-            >
-
-            <h1 style={{ fontSize: "4rem", margin: "14px 0" }}>
-                {/* biome-ignore lint/a11y/noSvgWithoutTitle: <explanation> */}
-                <svg
-                style={{
-                    height: "1em",
-                }}
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 200 44"
-                >
-                <path
-                    fill="currentColor"
-                    d="M124.32,28.28,109.56,9.22h-3.68V34.77h3.73V15.19l15.18,19.58h3.26V9.22h-3.73ZM87.15,23.54h13.23V20.22H87.14V12.53h14.93V9.21H83.34V34.77h18.92V31.45H87.14ZM71.59,20.3h0C66.44,19.06,65,18.08,65,15.7c0-2.14,1.89-3.59,4.71-3.59a12.06,12.06,0,0,1,7.07,2.55l2-2.83a14.1,14.1,0,0,0-9-3c-5.06,0-8.59,3-8.59,7.27,0,4.6,3,6.19,8.46,7.52C74.51,24.74,76,25.78,76,28.11s-2,3.77-5.09,3.77a12.34,12.34,0,0,1-8.3-3.26l-2.25,2.69a15.94,15.94,0,0,0,10.42,3.85c5.48,0,9-2.95,9-7.51C79.75,23.79,77.47,21.72,71.59,20.3ZM195.7,9.22l-7.69,12-7.64-12h-4.46L186,24.67V34.78h3.84V24.55L200,9.22Zm-64.63,3.46h8.37v22.1h3.84V12.68h8.37V9.22H131.08ZM169.41,24.8c3.86-1.07,6-3.77,6-7.63,0-4.91-3.59-8-9.38-8H154.67V34.76h3.8V25.58h6.45l6.48,9.2h4.44l-7-9.82Zm-10.95-2.5V12.6h7.17c3.74,0,5.88,1.77,5.88,4.84s-2.29,4.86-5.84,4.86Z M29,2.26a4.67,4.67,0,0,0-8,0L14.42,13.53A32.21,32.21,0,0,1,32.17,40.19H27.55A27.68,27.68,0,0,0,12.09,17.47L6,28a15.92,15.92,0,0,1,9.23,12.17H4.62A.76.76,0,0,1,4,39.06l2.94-5a10.74,10.74,0,0,0-3.36-1.9l-2.91,5a4.54,4.54,0,0,0,1.69,6.24A4.66,4.66,0,0,0,4.62,44H19.15a19.4,19.4,0,0,0-8-17.31l2.31-4A23.87,23.87,0,0,1,23.76,44H36.07a35.88,35.88,0,0,0-16.41-31.8l4.67-8a.77.77,0,0,1,1.05-.27c.53.29,20.29,34.77,20.66,35.17a.76.76,0,0,1-.68,1.13H40.6q.09,1.91,0,3.81h4.78A4.59,4.59,0,0,0,50,39.43a4.49,4.49,0,0,0-.62-2.28Z"
-                />
-                </svg>
-            </h1>
-
-            <p>Get started by sending us a sample error:</p>
-
-            <button
-                type="button"
-                style={{
-                padding: "12px",
-                cursor: "pointer",
-                backgroundColor: "#AD6CAA",
-                borderRadius: "4px",
-                border: "none",
-                color: "white",
-                fontSize: "14px",
-                margin: "18px",
-                }}
-                onClick={() => {
-                    throw new Error("Sentry Example Frontend Error");
-                }}
-            >
-                Throw error!
-            </button>
-
-            <p>
-                Next, look for the error on the{" "}
-                <a href="${issuesPageLink}">Issues Page</a>.
-            </p>
-            <p style={{ marginTop: "24px" }}>
-                For more information, see{" "}
-                <a href="https://docs.sentry.io/platforms/javascript/guides/remix/">
-                https://docs.sentry.io/platforms/javascript/guides/remix/
-                </a>
-            </p>
-            </main>
-        </div>
-    );
-}
-`;
-}