Add getProps to Parsers and fix up usages (#37504)

Summary:
[Codegen 87] This PR introduces `getProps` to the Parser class and implements this function in Typescript and Flow Parsers.

We also get rid of the following files from :
- `packages/react-native-codegen/src/parsers/typescript/components/props.js`
-  `packages/react-native-codegen/src/parsers/flow/components/props.js`

as requested on #34872

bypass-github-export-checks

## Changelog:

[Internal] [Changed] - Add `getProps ` to Parsers and update usages.

Pull Request resolved: #37504

Test Plan: Run yarn jest react-native-codegen and ensure CI is green

Reviewed By: cortinico

Differential Revision: D46074152

Pulled By: cipolleschi

fbshipit-source-id: aa6a1a556c9b4a4a6209221f70c8add46ed2d08b

Author: siddarthkay

packages/react-native-codegen/src/parsers/flow/components/index.js

@@ -14,7 +14,6 @@ import type {ComponentSchemaBuilderConfig} from '../../schema.js';
 
 const {getCommands} = require('./commands');
 const {getEvents} = require('./events');
-const {getProps} = require('./props');
 const {getProperties} = require('./componentsUtils.js');
 const {throwIfMoreThanOneCodegenNativecommands} = require('../../error-utils');
 const {
@@ -126,7 +125,7 @@ function buildComponentSchema(
 
   const propProperties = getProperties(propsTypeName, types);
   const commandProperties = getCommandProperties(ast, parser);
-  const {extendsProps, props} = getProps(propProperties, types, parser);
+  const {extendsProps, props} = parser.getProps(propProperties, types);
 
   const options = getOptions(optionsExpression);
   const events = getEvents(propProperties, types, parser);

packages/react-native-codegen/src/parsers/flow/components/props.js

@@ -20,6 +20,8 @@ import type {
   NativeModuleEnumMembers,
   NativeModuleAliasMap,
   NativeModuleEnumMap,
+  PropTypeAnnotation,
+  ExtendsPropsShape,
 } from '../../CodegenSchema';
 import type {ParserType} from '../errors';
 import type {
@@ -35,19 +37,25 @@ import type {
   TypeResolutionStatus,
 } from '../utils';
 
+type ExtendsForProp = null | {
+  type: 'ReactNativeBuiltInType',
+  knownTypeName: 'ReactNativeCoreViewProps',
+};
+
 const invariant = require('invariant');
 
 const {
   getSchemaInfo,
   getTypeAnnotation,
+  flattenProperties,
 } = require('./components/componentsUtils');
 
 const {flowTranslateTypeAnnotation} = require('./modules');
 
 // $FlowFixMe[untyped-import] there's no flowtype flow-parser
 const flowParser = require('flow-parser');
 
-const {buildSchema} = require('../parsers-commons');
+const {buildSchema, buildPropSchema} = require('../parsers-commons');
 const {Visitor} = require('../parsers-primitives');
 const {buildComponentSchema} = require('./components');
 const {wrapComponentSchema} = require('../schema.js');
@@ -445,6 +453,72 @@ class FlowParser implements Parser {
     return (typeAnnotation, types, parser) =>
       this.getResolvedTypeAnnotation(typeAnnotation, types, parser);
   }
+  extendsForProp(
+    prop: PropAST,
+    types: TypeDeclarationMap,
+    parser: Parser,
+  ): ExtendsForProp {
+    const argument = this.argumentForProp(prop);
+    if (!argument) {
+      console.log('null', prop);
+    }
+    const name = parser.nameForArgument(prop);
+
+    if (types[name] != null) {
+      // This type is locally defined in the file
+      return null;
+    }
+
+    switch (name) {
+      case 'ViewProps':
+        return {
+          type: 'ReactNativeBuiltInType',
+          knownTypeName: 'ReactNativeCoreViewProps',
+        };
+      default: {
+        throw new Error(`Unable to handle prop spread: ${name}`);
+      }
+    }
+  }
+
+  removeKnownExtends(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): $ReadOnlyArray<PropAST> {
+    return typeDefinition.filter(
+      prop =>
+        prop.type !== 'ObjectTypeSpreadProperty' ||
+        this.extendsForProp(prop, types, this) === null,
+    );
+  }
+
+  getExtendsProps(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): $ReadOnlyArray<ExtendsPropsShape> {
+    return typeDefinition
+      .filter(prop => prop.type === 'ObjectTypeSpreadProperty')
+      .map(prop => this.extendsForProp(prop, types, this))
+      .filter(Boolean);
+  }
+
+  getProps(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): {
+    props: $ReadOnlyArray<NamedShape<PropTypeAnnotation>>,
+    extendsProps: $ReadOnlyArray<ExtendsPropsShape>,
+  } {
+    const nonExtendsProps = this.removeKnownExtends(typeDefinition, types);
+    const props = flattenProperties(nonExtendsProps, types)
+      .map(property => buildPropSchema(property, types, this))
+      .filter(Boolean);
+
+    return {
+      props,
+      extendsProps: this.getExtendsProps(typeDefinition, types),
+    };
+  }
 }
 
 module.exports = {

packages/react-native-codegen/src/parsers/flow/parser.js

@@ -20,6 +20,8 @@ import type {
   NativeModuleEnumMembers,
   NativeModuleAliasMap,
   NativeModuleEnumMap,
+  PropTypeAnnotation,
+  ExtendsPropsShape,
 } from '../CodegenSchema';
 import type {ParserType} from './errors';
 import type {
@@ -361,4 +363,12 @@ export interface Parser {
   };
 
   getResolveTypeAnnotationFN(): ResolveTypeAnnotationFN;
+
+  getProps(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): {
+    props: $ReadOnlyArray<NamedShape<PropTypeAnnotation>>,
+    extendsProps: $ReadOnlyArray<ExtendsPropsShape>,
+  };
 }

packages/react-native-codegen/src/parsers/parser.js

@@ -17,6 +17,10 @@ import type {
   ResolveTypeAnnotationFN,
 } from './parser';
 import type {ParserType} from './errors';
+type ExtendsForProp = null | {
+  type: 'ReactNativeBuiltInType',
+  knownTypeName: 'ReactNativeCoreViewProps',
+};
 import type {
   UnionTypeAnnotationMemberType,
   SchemaType,
@@ -27,6 +31,8 @@ import type {
   NativeModuleEnumMembers,
   NativeModuleAliasMap,
   NativeModuleEnumMap,
+  PropTypeAnnotation,
+  ExtendsPropsShape,
 } from '../CodegenSchema';
 import type {
   ParserErrorCapturer,
@@ -36,6 +42,10 @@ import type {
 } from './utils';
 import invariant from 'invariant';
 
+const {flattenProperties} = require('./typescript/components/componentsUtils');
+
+const {buildPropSchema} = require('./parsers-commons');
+
 // $FlowFixMe[untyped-import] there's no flowtype flow-parser
 const flowParser = require('flow-parser');
 const {
@@ -368,4 +378,71 @@ export class MockedParser implements Parser {
       typeResolutionStatus,
     };
   }
+
+  getExtendsProps(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): $ReadOnlyArray<ExtendsPropsShape> {
+    return typeDefinition
+      .filter(prop => prop.type === 'ObjectTypeSpreadProperty')
+      .map(prop => this.extendsForProp(prop, types, this))
+      .filter(Boolean);
+  }
+
+  extendsForProp(
+    prop: PropAST,
+    types: TypeDeclarationMap,
+    parser: Parser,
+  ): ExtendsForProp {
+    const argument = this.argumentForProp(prop);
+    if (!argument) {
+      console.log('null', prop);
+    }
+    const name = parser.nameForArgument(prop);
+
+    if (types[name] != null) {
+      // This type is locally defined in the file
+      return null;
+    }
+
+    switch (name) {
+      case 'ViewProps':
+        return {
+          type: 'ReactNativeBuiltInType',
+          knownTypeName: 'ReactNativeCoreViewProps',
+        };
+      default: {
+        throw new Error(`Unable to handle prop spread: ${name}`);
+      }
+    }
+  }
+
+  removeKnownExtends(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): $ReadOnlyArray<PropAST> {
+    return typeDefinition.filter(
+      prop =>
+        prop.type !== 'ObjectTypeSpreadProperty' ||
+        this.extendsForProp(prop, types, this) === null,
+    );
+  }
+
+  getProps(
+    typeDefinition: $ReadOnlyArray<PropAST>,
+    types: TypeDeclarationMap,
+  ): {
+    props: $ReadOnlyArray<NamedShape<PropTypeAnnotation>>,
+    extendsProps: $ReadOnlyArray<ExtendsPropsShape>,
+  } {
+    const nonExtendsProps = this.removeKnownExtends(typeDefinition, types);
+    const props = flattenProperties(nonExtendsProps, types)
+      .map(property => buildPropSchema(property, types, this))
+      .filter(Boolean);
+
+    return {
+      props,
+      extendsProps: this.getExtendsProps(typeDefinition, types),
+    };
+  }
 }

packages/react-native-codegen/src/parsers/parserMock.js

@@ -15,7 +15,6 @@ import type {ComponentSchemaBuilderConfig} from '../../schema.js';
 const {getCommands} = require('./commands');
 const {getEvents} = require('./events');
 const {categorizeProps} = require('./extends');
-const {getProps} = require('./props');
 const {getProperties} = require('./componentsUtils.js');
 const {throwIfMoreThanOneCodegenNativecommands} = require('../../error-utils');
 const {
@@ -135,7 +134,7 @@ function buildComponentSchema(
 
   const componentEventAsts: Array<PropsAST> = [];
   categorizeProps(propProperties, types, componentEventAsts);
-  const {props, extendsProps} = getProps(propProperties, types, parser);
+  const {props, extendsProps} = parser.getProps(propProperties, types);
   const events = getEvents(componentEventAsts, types, parser);
   const commands = getCommands(commandProperties, types);