flow-upgrade 2.3.0 → 2.6.0

package/README.md

@@ -93,3 +93,23 @@ Run with `yarn run flow-codemod convertShapeToPartial`.
 Converts usages of the old casting syntax `(x: T)` to the new casting syntax `x as T`.
 
 Run with `yarn run flow-codemod typeCastToAsExpression`.
+
+### Migrate internal Flow types for React to public-facing ones
+Converts usages of the internal React types like `React$Node` to public facing ones like `React.Node`.
+
+Run with `yarn run flow-codemod replaceReactDollarUtilityTypes`.
+
+### Replace `$TEMPORARY$*` types
+Converts:
+ - `$TEMPORARY$object<{props}>` to `$ReadOnly<{props}>`
+ - `$TEMPORARY$array<T>` to `$ReadOnlyArray<T>`
+ - `$TEMPORARY$number<42>` annotations to `number`
+ - `$TEMPORARY$string<"foo">` annotations to `string`
+
+### Replace `React.AbstractComponent<...>` types
+Converts:
+
+- `React.AbstractComponent<Props>` to `React.ComponentType<Props>`
+- `React.ElementConfig<React.AbstractComponent<Props, Instance>>` to `Props`
+- `React.ElementRef<React.AbstractComponent<Props, Instance>>` to `Instance`
+- `React.ElementRef<React.AbstractComponent<Props>` to `mixed`

package/dist/codemods/eliminateAbstractComponent.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _Types = require("../Types");
+
+var _hermesTransform = require("hermes-transform");
+
+function eliminateAbstractComponent(node) {
+  const {
+    id: maybeQualifiedIdentifier,
+    typeParameters
+  } = node;
+
+  if (maybeQualifiedIdentifier.type === 'QualifiedTypeIdentifier' && maybeQualifiedIdentifier.qualification.name === 'React' && maybeQualifiedIdentifier.id.name === 'AbstractComponent' && typeParameters != null) {
+    const [config, instance, renders] = typeParameters.params;
+
+    if (renders != null) {
+      return null;
+    }
+
+    if (instance == null || instance.type === 'MixedTypeAnnotation') {
+      return _hermesTransform.t.GenericTypeAnnotation({
+        id: _hermesTransform.t.QualifiedTypeIdentifier({
+          qualification: _hermesTransform.t.Identifier({
+            name: 'React'
+          }),
+          id: _hermesTransform.t.Identifier({
+            name: 'ComponentType'
+          })
+        }),
+        typeParameters: _hermesTransform.t.TypeParameterInstantiation({
+          params: [config]
+        })
+      });
+    }
+
+    return null;
+  }
+
+  if (maybeQualifiedIdentifier.type === 'QualifiedTypeIdentifier' && maybeQualifiedIdentifier.qualification.name === 'React' && maybeQualifiedIdentifier.id.name === 'ElementConfig' && typeParameters != null && typeParameters.params.length === 1 && typeParameters.params[0].type === 'GenericTypeAnnotation' && typeParameters.params[0].id.type === 'QualifiedTypeIdentifier' && typeParameters.params[0].id.qualification.name === 'React' && typeParameters.params[0].id.id.name === 'AbstractComponent' && typeParameters.params[0].typeParameters != null && typeParameters.params[0].typeParameters.params.length >= 1) {
+    return typeParameters.params[0].typeParameters.params[0];
+  }
+
+  if (maybeQualifiedIdentifier.type === 'QualifiedTypeIdentifier' && maybeQualifiedIdentifier.qualification.name === 'React' && maybeQualifiedIdentifier.id.name === 'ElementRef' && typeParameters != null && typeParameters.params.length === 1 && typeParameters.params[0].type === 'GenericTypeAnnotation' && typeParameters.params[0].id.type === 'QualifiedTypeIdentifier' && typeParameters.params[0].id.qualification.name === 'React' && typeParameters.params[0].id.id.name === 'AbstractComponent' && typeParameters.params[0].typeParameters != null && typeParameters.params[0].typeParameters.params.length >= 2) {
+    return typeParameters.params[0].typeParameters.params[1];
+  }
+
+  if (maybeQualifiedIdentifier.type === 'QualifiedTypeIdentifier' && maybeQualifiedIdentifier.qualification.name === 'React' && maybeQualifiedIdentifier.id.name === 'ElementRef' && typeParameters != null && typeParameters.params.length === 1 && typeParameters.params[0].type === 'GenericTypeAnnotation' && typeParameters.params[0].id.type === 'QualifiedTypeIdentifier' && typeParameters.params[0].id.qualification.name === 'React' && typeParameters.params[0].id.id.name === 'AbstractComponent' && typeParameters.params[0].typeParameters != null && typeParameters.params[0].typeParameters.params.length === 1) {
+    return _hermesTransform.t.MixedTypeAnnotation({});
+  }
+
+  return null;
+}
+
+var _default = (0, _Types.codemod)({
+  title: 'Eliminate `React.AbstractComponent<...>`',
+  describe: `
+- \`React.AbstractComponent<Props>\` -> \`React.ComponentType<Props>\`
+- \`React.ElementConfig<React.AbstractComponent<Props, Instance>>\` -> \`Props\`
+- \`React.ElementRef<React.AbstractComponent<Props, Instance>>\` -> \`Instance\`
+- \`React.ElementRef<React.AbstractComponent<Props>\` -> \`mixed\``,
+  transform: context => {
+    return {
+      GenericTypeAnnotation(node) {
+        const replacement = eliminateAbstractComponent(node);
+
+        if (replacement) {
+          context.replaceNode(node, replacement, {
+            keepComments: true
+          });
+        }
+      }
+
+    };
+  }
+});
+
+exports.default = _default;

package/dist/codemods/replaceReactDollarUtilityTypes.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _hermesTransform = require("hermes-transform");
+
+var _Types = require("../Types");
+
+const UTILITY_TYPES = new Set(['React$ComponentType', 'React$AbstractComponent', 'React$Element', 'React$MixedElement', 'React$ElementType', 'React$Key', 'React$Ref', 'React$RefSetter', 'React$Node', 'React$Context', 'React$Portal', 'React$ElementProps', 'React$ElementConfig', 'React$ElementRef', 'React$Config', 'React$Config', 'React$RefObject']);
+
+var _default = (0, _Types.codemod)({
+  title: 'Replace React$SomeUtilityType with React.SomeUtilityType.',
+  transform: context => {
+    return {
+      GenericTypeAnnotation(node) {
+        if (typeof node.id.name !== 'string') {
+          return;
+        }
+
+        const utilTypeName = node.id.name;
+
+        if (!UTILITY_TYPES.has(utilTypeName)) {
+          return;
+        }
+
+        const newNode = _hermesTransform.t.GenericTypeAnnotation({
+          id: _hermesTransform.t.QualifiedTypeIdentifier({
+            id: _hermesTransform.t.Identifier({
+              name: utilTypeName.substring('React$'.length)
+            }),
+            qualification: _hermesTransform.t.Identifier({
+              name: 'React'
+            })
+          }),
+          typeParameters: node.typeParameters
+        });
+
+        context.replaceNode(node, newNode);
+      }
+
+    };
+  }
+});
+
+exports.default = _default;

package/dist/codemods/replaceTemporaryTypes.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _hermesTransform = require("hermes-transform");
+
+var _Types = require("../Types");
+
+var _default = (0, _Types.codemod)({
+  title: 'Replace $TEMPORARY$ types',
+  describe: ['Converts:', ' - `$TEMPORARY$object<{props}>` to `$ReadOnly<{props}>`', ' - `$TEMPORARY$array<T>` to `$ReadOnlyArray<T>`', ' - `$TEMPORARY$number<42>` annotations to `number`', ' - `$TEMPORARY$string<"foo">` annotations to `string`'].join('\n'),
+  transform: context => {
+    return {
+      GenericTypeAnnotation(node) {
+        const id = node.id;
+
+        if (id.type === 'Identifier' && id.name === '$TEMPORARY$object' && node.typeParameters != null) {
+          context.modifyNodeInPlace(node, {
+            id: _hermesTransform.t.Identifier({
+              name: '$ReadOnly'
+            })
+          });
+        }
+
+        if (id.type === 'Identifier' && id.name === '$TEMPORARY$array' && node.typeParameters != null) {
+          context.modifyNodeInPlace(node, {
+            id: _hermesTransform.t.Identifier({
+              name: '$ReadOnlyArray'
+            })
+          });
+        }
+
+        if (id.type === 'Identifier' && id.name === '$TEMPORARY$number') {
+          const new_node = _hermesTransform.t.NumberTypeAnnotation();
+
+          context.replaceNode(node, new_node, {
+            keepComments: true
+          });
+        }
+
+        if (id.type === 'Identifier' && id.name === '$TEMPORARY$string') {
+          const new_node = _hermesTransform.t.StringTypeAnnotation();
+
+          context.replaceNode(node, new_node, {
+            keepComments: true
+          });
+        }
+      }
+
+    };
+  }
+});
+
+exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flow-upgrade",
-  "version": "2.3.0",
+  "version": "2.6.0",
   "description": "A utility for upgrading your codebase to the latest version of Flow.",
   "engines": {
     "node": ">=14"
@@ -30,15 +30,15 @@
   "homepage": "https://github.com/facebook/flow/tree/master/packages/flow-upgrade#readme",
   "dependencies": {
     "@babel/highlight": "^7.18.6",
-    "babel-plugin-syntax-hermes-parser": "0.19.0",
+    "babel-plugin-syntax-hermes-parser": "0.24.0",
     "chalk": "^2.0.1",
     "fs-extra": "10.1.0",
-    "hermes-estree": "0.19.0",
-    "hermes-parser": "0.19.0",
-    "hermes-transform": "0.19.0",
+    "hermes-estree": "0.24.0",
+    "hermes-parser": "0.24.0",
+    "hermes-transform": "0.24.0",
     "klaw-sync": "^6.0.0",
     "ora": "^5.4.1",
-    "prettier-plugin-hermes-parser": "0.19.0",
+    "prettier-plugin-hermes-parser": "0.24.0",
     "prompt-confirm": "^1.2.0",
     "semver": "^7.3.7",
     "yargs": "^17.0.1"