#86c0b8vp3: Impement Sentry generator using ast

plugin/generators.json

@@ -30,6 +30,11 @@
       "schema": "./src/generators/react-component/schema.json",
       "description": "react-component generator"
     },
+    "sentry": {
+      "factory": "./src/generators/sentry/generator",
+      "schema": "./src/generators/sentry/schema.json",
+      "description": "sentry generator"
+    },
     "ui-kitten": {
       "factory": "./src/shared/generators/ui-kitten/generator",
       "schema": "./src/shared/generators/ui-kitten/schema.json",

plugin/src/generators/expo-app/generator.ts

@@ -7,7 +7,7 @@ import {
   installPackagesTask,
   readJson,
   Tree,
-  writeJson
+  writeJson,
 } from '@nx/devkit';
 import { ExpoAppGeneratorSchema } from './schema';
 import scripts from './scripts';
@@ -21,13 +21,19 @@ import {
   runRNStylesGenerator,
   runFormUtilsGenerator,
   runStoreGenerator,
-  runUIKittenGenerator
+  runUIKittenGenerator,
 } from '../../shared/generators';
-import { formatName, formatAppIdentifier, addNxAppTag, askQuestion, getImportPathPrefix } from '../../shared/utils';
+import {
+  formatName,
+  formatAppIdentifier,
+  addNxAppTag,
+  askQuestion,
+  getImportPathPrefix,
+} from '../../shared/utils';
 
 export async function expoAppGenerator(
   tree: Tree,
-  options: ExpoAppGeneratorSchema
+  options: ExpoAppGeneratorSchema,
 ) {
   const appRoot = `apps/${options.directory}`;
   const i18nRoot = `i18n/${options.directory}`;
@@ -36,12 +42,12 @@ export async function expoAppGenerator(
   const tags = [`app:${options.directory}`, 'type:app'];
 
   // Install @nx/expo plugin
-  execSync('npx nx add @nx/expo', { stdio: 'inherit' })
+  execSync('npx nx add @nx/expo', { stdio: 'inherit' });
 
   if (!existsSync(appRoot)) {
     execSync(
       `npx nx g @nx/expo:app ${options.name} --directory=apps/${options.directory} --tags="${tags.join(', ')}" --projectNameAndRootFormat=as-provided --unitTestRunner=none --e2eTestRunner=none`,
-      { stdio: 'inherit' }
+      { stdio: 'inherit' },
     );
   }
 
@@ -50,27 +56,40 @@ export async function expoAppGenerator(
   await runStorageGenerator(tree, options);
   await runRNStylesGenerator(tree, options);
 
-  const shouldGenerateStoreLib = await askQuestion('Do you want to create store lib? (y/n): ') === 'y';
+  const shouldGenerateStoreLib =
+    (await askQuestion('Do you want to create store lib? (y/n): ')) === 'y';
 
   if (shouldGenerateStoreLib) {
-    await runStoreGenerator(tree, { ...options, baseGeneratorType: BaseGeneratorType.EXPO_APP });
+    await runStoreGenerator(tree, {
+      ...options,
+      baseGeneratorType: BaseGeneratorType.EXPO_APP,
+    });
   }
 
-  const shouldGenerateApiClientLib = shouldGenerateStoreLib && await askQuestion('Do you want to create api client lib? (y/n): ') === 'y';
+  const shouldGenerateApiClientLib =
+    shouldGenerateStoreLib &&
+    (await askQuestion('Do you want to create api client lib? (y/n): ')) ===
+      'y';
 
   if (shouldGenerateApiClientLib) {
     await runApiClientGenerator(tree, options);
   }
 
-  const shouldGenerateAuthLibs = shouldGenerateApiClientLib && await askQuestion('Do you want to create auth lib? (y/n): ') === 'y';
+  const shouldGenerateAuthLibs =
+    shouldGenerateApiClientLib &&
+    (await askQuestion('Do you want to create auth lib? (y/n): ')) === 'y';
 
-  const shouldGenerateFormUtilsLib = await askQuestion('Do you want to create a lib with the form utils? (y/n): ') === 'y';
+  const shouldGenerateFormUtilsLib =
+    (await askQuestion(
+      'Do you want to create a lib with the form utils? (y/n): ',
+    )) === 'y';
 
   if (shouldGenerateFormUtilsLib) {
     await runFormUtilsGenerator(tree, options);
   }
 
-  const shouldGenerateUIKittenLib = await askQuestion('Do you want to install @ui-kitten? (y/n): ') === 'y';
+  const shouldGenerateUIKittenLib =
+    (await askQuestion('Do you want to install @ui-kitten? (y/n): ')) === 'y';
 
   if (shouldGenerateUIKittenLib) {
     await runUIKittenGenerator(tree, options);
@@ -111,7 +130,7 @@ export async function expoAppGenerator(
     formatDirectory: () => libPath,
     isUIKittenEnabled: shouldGenerateUIKittenLib,
     isStoreEnabled: shouldGenerateStoreLib,
-    appDirectory: options.directory
+    appDirectory: options.directory,
   });
 
   addNxAppTag(tree, options.directory);
@@ -122,15 +141,20 @@ export async function expoAppGenerator(
     tree,
     {
       ...dependencies['expo-app'],
-      ...dependencies['expo-app-root']
+      ...dependencies['expo-app-root'],
     },
     {
       ...devDependencies['expo-app'],
-      ...devDependencies['expo-app-root']
-    }
+      ...devDependencies['expo-app-root'],
+    },
   );
 
-  addDependenciesToPackageJson(tree, dependencies['expo-app'], devDependencies['expo-app'], appPackagePath);
+  addDependenciesToPackageJson(
+    tree,
+    dependencies['expo-app'],
+    devDependencies['expo-app'],
+    appPackagePath,
+  );
 
   await formatFiles(tree);
 
@@ -139,7 +163,15 @@ export async function expoAppGenerator(
     execSync('npx expo install --fix', { stdio: 'inherit' });
 
     if (shouldGenerateAuthLibs) {
-      execSync(`npx nx g auth ${options.name} ${options.directory}`, { stdio: 'inherit' });
+      execSync(`npx nx g auth ${options.name} ${options.directory}`, {
+        stdio: 'inherit',
+      });
+    }
+
+    if (options.withSentry) {
+      execSync(`npx nx g sentry --directory=${options.directory}`, {
+        stdio: 'inherit',
+      });
     }
   };
 }

plugin/src/generators/expo-app/schema.d.ts

@@ -1,4 +1,5 @@
 export interface ExpoAppGeneratorSchema {
   name: string;
   directory: string;
+  withSentry: boolean;
 }

plugin/src/generators/expo-app/schema.json

@@ -21,7 +21,12 @@
         "index": 1
       },
       "x-prompt": "Enter the name of the directory in the 'apps/' folder (e.g: mobile)"
+    },
+    "withSentry": {
+      "type": "boolean",
+      "default": false,
+      "x-prompt": "Do you want to use Sentry in your app?"
     }
   },
-  "required": ["name", "directory"]
+  "required": ["name", "directory", "withSentry"]
 }

plugin/src/generators/next-app/generator.ts

@@ -12,7 +12,12 @@ import { NextAppGeneratorSchema } from './schema';
 import { existsSync } from 'fs';
 import { dependencies } from '../../shared/dependencies';
 import { BaseGeneratorType } from '../../shared/enums';
-import { runApiClientGenerator, runAppEnvGenerator, runFormUtilsGenerator, runStoreGenerator } from '../../shared/generators';
+import {
+  runApiClientGenerator,
+  runAppEnvGenerator,
+  runFormUtilsGenerator,
+  runStoreGenerator,
+} from '../../shared/generators';
 import { addNxAppTag, askQuestion, formatName } from '../../shared/utils';
 import * as path from 'path';
 
@@ -35,19 +40,29 @@ export async function nextAppGenerator(
 
   await runAppEnvGenerator(tree, options);
 
-  const shouldGenerateStoreLib = await askQuestion('Do you want to create store lib? (y/n): ') === 'y';
+  const shouldGenerateStoreLib =
+    (await askQuestion('Do you want to create store lib? (y/n): ')) === 'y';
 
   if (shouldGenerateStoreLib) {
-    await runStoreGenerator(tree, { ...options, baseGeneratorType: BaseGeneratorType.NEXT_APP });
+    await runStoreGenerator(tree, {
+      ...options,
+      baseGeneratorType: BaseGeneratorType.NEXT_APP,
+    });
   }
 
-  const shouldGenerateApiClientLib = shouldGenerateStoreLib && await askQuestion('Do you want to create api client lib? (y/n): ') === 'y';
+  const shouldGenerateApiClientLib =
+    shouldGenerateStoreLib &&
+    (await askQuestion('Do you want to create api client lib? (y/n): ')) ===
+      'y';
 
   if (shouldGenerateApiClientLib) {
     await runApiClientGenerator(tree, options);
   }
 
-  const shouldGenerateFormUtilsLib = await askQuestion('Do you want to create a lib with the form utils? (y/n): ') === 'y';
+  const shouldGenerateFormUtilsLib =
+    (await askQuestion(
+      'Do you want to create a lib with the form utils? (y/n): ',
+    )) === 'y';
 
   if (shouldGenerateFormUtilsLib) {
     await runFormUtilsGenerator(tree, options);
@@ -88,6 +103,12 @@ export async function nextAppGenerator(
 
   return () => {
     installPackagesTask(tree);
+
+    if (options.withSentry) {
+      execSync(`npx nx g sentry --directory=${options.directory}`, {
+        stdio: 'inherit',
+      });
+    }
   };
 }
 

plugin/src/generators/next-app/schema.d.ts

@@ -1,4 +1,5 @@
 export interface NextAppGeneratorSchema {
   name: string;
   directory: string;
+  withSentry: boolean;
 }

plugin/src/generators/next-app/schema.json

@@ -21,7 +21,12 @@
         "index": 1
       },
       "x-prompt": "Enter the name of the directory in the 'apps/' folder (e.g: web)"
+    },
+    "withSentry": {
+      "type": "boolean",
+      "default": false,
+      "x-prompt": "Do you want to use Sentry in your app?"
     }
   },
-  "required": ["name", "directory"]
+  "required": ["name", "directory", "withSentry"]
 }

plugin/src/generators/sentry/files/app/[locale]/global-error.tsx.template

@@ -0,0 +1,23 @@
+'use client';
+
+import * as Sentry from '@sentry/nextjs';
+import NextError from 'next/error';
+import { ReactElement, useEffect } from 'react';
+
+interface GlobalErrorProps {
+  error: Error & { digest?: string };
+}
+
+export default function GlobalError({ error }: GlobalErrorProps): ReactElement {
+  useEffect(() => {
+    Sentry.captureException(error);
+  }, [error]);
+
+  return (
+    <html>
+      <body>
+        <NextError statusCode={undefined as any} />
+      </body>
+    </html>
+  );
+}

plugin/src/generators/sentry/files/sentry.client.config.ts.template

@@ -0,0 +1,22 @@
+import * as Sentry from '@sentry/nextjs';
+
+Sentry.init({
+  dsn: '<%= dsn %>',
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 1,
+
+  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: [
+    Sentry.replayIntegration(),
+    Sentry.inboundFiltersIntegration(),
+  ],
+  denyUrls: ['localhost'],
+});

plugin/src/generators/sentry/files/sentry.edge.config.ts.template

@@ -0,0 +1,12 @@
+import * as Sentry from '@sentry/nextjs';
+
+Sentry.init({
+  dsn: '<%= dsn %>',
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 1,
+
+  debug: false,
+  integrations: [Sentry.inboundFiltersIntegration()],
+  denyUrls: ['localhost']
+});

plugin/src/generators/sentry/files/sentry.server.config.ts.template

@@ -0,0 +1,12 @@
+import * as Sentry from '@sentry/nextjs';
+
+Sentry.init({
+  dsn: '<%= dsn %>',
+
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 1,
+
+  debug: false,
+  integrations: [Sentry.inboundFiltersIntegration()],
+  denyUrls: ['localhost'],
+});

plugin/src/generators/sentry/generator.ts

@@ -0,0 +1,21 @@
+import { formatFiles, Tree } from '@nx/devkit';
+import { SentryGeneratorSchema } from './schema';
+import { isExpoApp, isNextApp } from '../../shared/utils';
+import { generateSentryNext, generateSentryExpo } from './utils';
+
+export async function sentryGenerator(
+  tree: Tree,
+  options: SentryGeneratorSchema,
+) {
+  const projectRoot = `apps/${options.directory}`;
+
+  if (isNextApp(tree, projectRoot)) {
+    generateSentryNext(tree, options, projectRoot);
+  } else if (isExpoApp(tree, projectRoot)) {
+    generateSentryExpo(tree, options, projectRoot);
+  }
+
+  await formatFiles(tree);
+}
+
+export default sentryGenerator;

plugin/src/generators/sentry/schema.d.ts

@@ -0,0 +1,5 @@
+export interface SentryGeneratorSchema {
+  name: string;
+  directory: string;
+  dsn: string;
+}

plugin/src/generators/sentry/schema.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "https://json-schema.org/schema",
+  "$id": "Sentry",
+  "title": "",
+  "type": "object",
+  "properties": {
+    "directory": {
+      "type": "string",
+      "description": "",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "Enter the name of the directory in the 'apps/' folder (e.g: web)"
+    },
+    "dsn": {
+      "type": "string",
+      "description": "",
+      "x-prompt": "What is your Sentry DSN?"
+    }
+  },
+  "required": ["directory", "dsn"]
+}

plugin/src/generators/sentry/types/index.ts

@@ -0,0 +1 @@
+export * from './property-assignment-data';

plugin/src/generators/sentry/types/property-assignment-data.ts

@@ -0,0 +1,7 @@
+import { Expression } from 'typescript';
+
+export type PropertyAssignmentData = {
+  key: string;
+  initializer: Expression;
+  comment?: string;
+};