Refactor: Simplify deprecated component code-gen logic in View Config…

… generator

Summary:
**Motivation:** Readability. It was hard to tell how componentName, paperComponentName, and paperComponentNameDepreacted produced the NativeComponentRegistry.get call.

Changelog: [Internal]

Reviewed By: philIip

Differential Revision: D32108276

fbshipit-source-id: ea7c9fe4dc50cdd6fec94b5cd25f7bbcfb451ef6

packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js

@@ -103,32 +103,44 @@ function getReactDiffProcessValue(typeAnnotation) {
 }
 
 const ComponentTemplate = ({
-  componentNameWithCompatSupport,
-  deprecationCheck,
+  componentName,
+  paperComponentName,
+  paperComponentNameDeprecated,
 }: {
-  componentNameWithCompatSupport: string,
-  deprecationCheck: string,
-}) =>
-  `
-let nativeComponentName = '${componentNameWithCompatSupport}';
-${deprecationCheck}
+  componentName: string,
+  paperComponentName: ?string,
+  paperComponentNameDeprecated: ?string,
+}) => {
+  const nativeComponentName = paperComponentName ?? componentName;
+
+  return `
+let nativeComponentName = '${nativeComponentName}';
+${
+  paperComponentNameDeprecated != null
+    ? DeprecatedComponentNameCheckTemplate({
+        componentName,
+        paperComponentNameDeprecated,
+      })
+    : ''
+}
 export default NativeComponentRegistry.get(nativeComponentName, () => VIEW_CONFIG);
 `.trim();
+};
 
-const DeprecatedComponentTemplate = ({
+const DeprecatedComponentNameCheckTemplate = ({
   componentName,
-  componentNameDeprecated,
+  paperComponentNameDeprecated,
 }: {
   componentName: string,
-  componentNameDeprecated: string,
+  paperComponentNameDeprecated: string,
 }) =>
   `
 if (UIManager.getViewManagerConfig('${componentName}')) {
   nativeComponentName = '${componentName}';
-} else if (UIManager.getViewManagerConfig('${componentNameDeprecated}')) {
-  nativeComponentName = '${componentNameDeprecated}';
+} else if (UIManager.getViewManagerConfig('${paperComponentNameDeprecated}')) {
+  nativeComponentName = '${paperComponentNameDeprecated}';
 } else {
-  throw new Error('Failed to find native component for either "${componentName}" or "${componentNameDeprecated}"');
+  throw new Error('Failed to find native component for either "${componentName}" or "${paperComponentNameDeprecated}"');
 }
 `.trim();
 
@@ -365,29 +377,22 @@ module.exports = {
             .map((componentName: string) => {
               const component = components[componentName];
 
-              const paperComponentName = component.paperComponentName
-                ? component.paperComponentName
-                : componentName;
-
               if (component.paperComponentNameDeprecated) {
                 imports.add(UIMANAGER_IMPORT);
               }
 
-              const deprecatedCheckBlock = component.paperComponentNameDeprecated
-                ? DeprecatedComponentTemplate({
-                    componentName,
-                    componentNameDeprecated:
-                      component.paperComponentNameDeprecated || '',
-                  })
-                : '';
-
               const replacedTemplate = ComponentTemplate({
-                componentNameWithCompatSupport: paperComponentName,
-                deprecationCheck: deprecatedCheckBlock,
+                componentName,
+                paperComponentName: component.paperComponentName,
+                paperComponentNameDeprecated:
+                  component.paperComponentNameDeprecated,
               });
 
               const replacedSourceRoot = j.withParser('flow')(replacedTemplate);
 
+              const paperComponentName =
+                component.paperComponentName ?? componentName;
+
               replacedSourceRoot
                 .find(j.Identifier, {
                   name: 'VIEW_CONFIG',