sentry/build-utils/component-props-plugin.ts

/* eslint-env node */
/* eslint import/no-nodejs-modules:off */

import path from 'path';

import * as docgen from 'react-docgen-typescript';
import {glob} from 'glob';

import SignedFileGenerator from './signed-file-generator';

type GlobPattern = Parameters<typeof glob>[0];
type Options = {
  cwd: string;
  output: string;
  pattern: GlobPattern;
};

class ComponentPropsPlugin extends SignedFileGenerator<string> {
  constructor(options: Options) {
    super('ComponentPropsPlugin', options);
  }

  generateData(files: string[]) {
    const parserOptions = {
      // skipPropsWithoutDoc: true,
      shouldExtractLiteralValuesFromEnum: true,
      propFilter: (prop: docgen.PropItem) => {
        if (prop.declarations !== undefined && prop.declarations.length > 0) {
          const hasPropAdditionalDescription = prop.declarations.find(declaration => {
            return !declaration.fileName.includes('node_modules');
          });

          return Boolean(hasPropAdditionalDescription);
        }

        return true;
      },
    };

    const tsConfigParser = docgen.withCustomConfig(
      path.join(__dirname, '..', 'tsconfig.json'),
      parserOptions
    );

    const staticPrefix = path.join(__dirname, '..', 'static');
    const filePaths = files.map(file => path.join(staticPrefix, file));
    const types = tsConfigParser.parse(filePaths);

    types.forEach(type => {
      // @ts-ignore
      delete type.description;
      delete type.tags;
      Object.keys(type.props).forEach(key => {
        delete type.props[key].declarations;
        // @ts-ignore
        delete type.props[key].description;
      });
    });

    return Promise.resolve(JSON.stringify(types));
  }

  sourceTemplate(data: string, signingToken: string) {
    return `
      // THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
      //
      // Generated by ${this.name} (using ${path.basename(__filename)})
      // ${signingToken}
      //
      // This script contains a list of components and their typescript props to be
      // imported by our ui component library. Used to generate Knobs.

      type IProps = {
        declarations: {
          fileName: string;
          name: string;
        }[];
        defaultValue: any;
        // description: string;
        name: string;
        required: boolean;
        type: {name: string};
      };

      type IModule = {
        // description: string,
        displayName: string;
        // tags: Record<string, unknown>,
        filePath: string;
        methods: unknown[];
        props: Record<string, IProps>;
      };

      const ComponentProps: IModule[] = ${data}

      export {ComponentProps}
    `;
  }
}

export default ComponentPropsPlugin;