feat(onboarding): Add profiling to platform node-connect (#55532)

Add profiling product selection to platform node.

Closes https://github.com/getsentry/sentry/issues/55444

static/app/components/onboarding/productSelection.tsx

@@ -64,6 +64,7 @@ export const platformProductAvailability = {
     ProductSolution.SESSION_REPLAY,
   ],
   node: [ProductSolution.PERFORMANCE_MONITORING, ProductSolution.PROFILING],
+  'node-connect': [ProductSolution.PERFORMANCE_MONITORING, ProductSolution.PROFILING],
   python: [ProductSolution.PERFORMANCE_MONITORING, ProductSolution.PROFILING],
   'python-aiohttp': [ProductSolution.PERFORMANCE_MONITORING, ProductSolution.PROFILING],
   'python-awslambda': [ProductSolution.PERFORMANCE_MONITORING, ProductSolution.PROFILING],

static/app/gettingStartedDocs/node/connect.spec.tsx

@@ -9,7 +9,11 @@ describe('GettingStartedWithConnect', function () {
     const {container} = render(<GettingStartedWithConnect dsn="test-dsn" />);
 
     // Steps
-    for (const step of steps()) {
+    for (const step of steps({
+      installSnippet: 'test-install-snippet',
+      importContent: 'test-import-content',
+      initContent: 'test-init-content',
+    })) {
       expect(
         screen.getByRole('heading', {name: step.title ?? StepTitle[step.type]})
       ).toBeInTheDocument();

static/app/gettingStartedDocs/node/connect.tsx

@@ -1,21 +1,28 @@
 import {Layout, LayoutProps} from 'sentry/components/onboarding/gettingStartedDoc/layout';
 import {ModuleProps} from 'sentry/components/onboarding/gettingStartedDoc/sdkDocumentation';
 import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step';
-import {PlatformKey} from 'sentry/data/platformCategories';
 import {t, tct} from 'sentry/locale';
-import type {Organization} from 'sentry/types';
+import {
+  getDefaultInitParams,
+  getDefaultNodeImports,
+  getInstallSnippet,
+  getProductInitParams,
+  getProductIntegrations,
+  getProductSelectionMap,
+  joinWithIndentation,
+} from 'sentry/utils/gettingStartedDocs/node';
 
-type StepProps = {
-  newOrg: boolean;
-  organization: Organization;
-  platformKey: PlatformKey;
-  projectId: string;
-  sentryInitContent: string;
-};
+interface StepProps {
+  importContent: string;
+  initContent: string;
+  installSnippet: string;
+}
 
 export const steps = ({
-  sentryInitContent,
-}: Partial<StepProps> = {}): LayoutProps['steps'] => [
+  installSnippet,
+  importContent,
+  initContent,
+}: StepProps): LayoutProps['steps'] => [
   {
     type: StepType.INSTALL,
     description: (
@@ -24,13 +31,7 @@ export const steps = ({
     configurations: [
       {
         language: 'bash',
-        code: `
-# Using yarn
-yarn add @sentry/node
-
-# Using npm
-npm install --save @sentry/node
-        `,
+        code: installSnippet,
       },
     ],
   },
@@ -41,56 +42,74 @@ npm install --save @sentry/node
       {
         language: 'javascript',
         code: `
-        import * as Sentry from "@sentry/node";
-        import connect from "connect";
+${importContent}
 
-        // or using CommonJS
-        // const connect = require('connect');
-        // const Sentry = require('@sentry/node');
+// Configure Sentry before doing anything else
+Sentry.init({
+${initContent},
+});
 
-        // Configure Sentry before doing anything else
-        Sentry.init({
-          ${sentryInitContent},
-        });
-
-        function mainHandler(req, res) {
-          throw new Error("My first Sentry error!");
-        }
+function mainHandler(req, res) {
+  throw new Error("My first Sentry error!");
+}
 
-        function onError(err, req, res, next) {
-          // The error id is attached to \`res.sentry\` to be returned
-          // and optionally displayed to the user for support.
-          res.statusCode = 500;
-          res.end(res.sentry + "\\n");
-        }
+function onError(err, req, res, next) {
+  // The error id is attached to \`res.sentry\` to be returned
+  // and optionally displayed to the user for support.
+  res.statusCode = 500;
+  res.end(res.sentry + "\\n");
+}
 
-        connect(
-          // The request handler be the first item
-          Sentry.Handlers.requestHandler(),
+connect(
+  // The request handler be the first item
+  Sentry.Handlers.requestHandler(),
 
-          connect.bodyParser(),
-          connect.cookieParser(),
-          mainHandler,
+  connect.bodyParser(),
+  connect.cookieParser(),
+  mainHandler,
 
-          // The error handler must be before any other error middleware
-          Sentry.Handlers.errorHandler(),
+  // The error handler must be before any other error middleware
+  Sentry.Handlers.errorHandler(),
 
-          // Optional fallthrough error handler
-          onError
-        ).listen(3000);
-        `,
+  // Optional fallthrough error handler
+  onError
+).listen(3000);
+`,
       },
     ],
   },
 ];
 
-export function GettingStartedWithConnect({dsn, newOrg, platformKey}: ModuleProps) {
-  const sentryInitContent: string[] = [`dsn: "${dsn}"`];
+export function GettingStartedWithConnect({
+  dsn,
+  newOrg,
+  platformKey,
+  activeProductSelection = [],
+}: ModuleProps) {
+  const productSelection = getProductSelectionMap(activeProductSelection);
+
+  const installSnippet = getInstallSnippet({productSelection});
+  const imports = getDefaultNodeImports({productSelection});
+  imports.push('import connect from "connect";');
+
+  const integrations = getProductIntegrations({productSelection});
+  const integrationParam =
+    integrations.length > 0
+      ? `integrations: [\n${joinWithIndentation(integrations)}\n],`
+      : null;
+
+  const initContent = joinWithIndentation([
+    ...getDefaultInitParams({dsn}),
+    ...(integrationParam ? [integrationParam] : []),
+    ...getProductInitParams({productSelection}),
+  ]);
 
   return (
     <Layout
       steps={steps({
-        sentryInitContent: sentryInitContent.join('\n'),
+        installSnippet,
+        importContent: imports.join('\n'),
+        initContent,
       })}
       newOrg={newOrg}
       platformKey={platformKey}