Convert unannotated variable declaration with cast init to annotated …

…variable declaration in xplat/js (#42880) Summary: Pull Request resolved: #42880 Convert `const x = (a: T)` into `const x: T = a`. These are equivalent in Flow, and helps reduce the amount of colon-casts. ``` js1 flow-runner codemod flow/castToAnnotatedVariable --target colon xplat/js ``` Changelog: [Internal] drop-conflicts Reviewed By: SamChou19815 Differential Revision: D53392999 fbshipit-source-id: 3b4602618d6990e8642b423edaeb4e89b01a199a
facebook · Feb 6, 2024 · 608029a · 608029a
1 parent 1ad3bbc
commit 608029a
Show file tree

Hide file tree

Showing 12 changed files with 32 additions and 30 deletions.
diff --git a/packages/react-native/Libraries/Animated/Animated.js b/packages/react-native/Libraries/Animated/Animated.js
@@ -21,9 +21,9 @@ import Platform from '../Utilities/Platform';
 import AnimatedImplementation from './AnimatedImplementation';
 import AnimatedMock from './AnimatedMock';
 
-const Animated = ((Platform.isDisableAnimations
+const Animated: typeof AnimatedImplementation = Platform.isDisableAnimations
   ? AnimatedMock
-  : AnimatedImplementation): typeof AnimatedImplementation);
+  : AnimatedImplementation;
 
 export default {
   get FlatList(): AnimatedFlatList {

diff --git a/packages/react-native/Libraries/Components/Touchable/PooledClass.js b/packages/react-native/Libraries/Components/Touchable/PooledClass.js
@@ -112,7 +112,7 @@ const addPoolingTo = function <T>(
 } {
   // Casting as any so that flow ignores the actual implementation and trusts
   // it to match the type we declared
-  const NewKlass = (CopyConstructor: any);
+  const NewKlass: any = CopyConstructor;
   NewKlass.instancePool = [];
   NewKlass.getPooled = pooler || DEFAULT_POOLER;
   if (!NewKlass.poolSize) {

diff --git a/packages/react-native/Libraries/Components/Touchable/TouchableHighlight.js b/packages/react-native/Libraries/Components/Touchable/TouchableHighlight.js
@@ -379,12 +379,12 @@ class TouchableHighlight extends React.Component<Props, State> {
   }
 }
 
-const Touchable = (React.forwardRef((props, hostRef) => (
-  <TouchableHighlight {...props} hostRef={hostRef} />
-)): React.AbstractComponent<
+const Touchable: React.AbstractComponent<
   $ReadOnly<$Diff<Props, {|hostRef: React.Ref<typeof View>|}>>,
   React.ElementRef<typeof View>,
->);
+> = React.forwardRef((props, hostRef) => (
+  <TouchableHighlight {...props} hostRef={hostRef} />
+));
 
 Touchable.displayName = 'TouchableHighlight';
 

diff --git a/packages/react-native/Libraries/Components/Touchable/TouchableOpacity.js b/packages/react-native/Libraries/Components/Touchable/TouchableOpacity.js
@@ -323,9 +323,12 @@ class TouchableOpacity extends React.Component<Props, State> {
   }
 }
 
-const Touchable = (React.forwardRef((props, ref) => (
+const Touchable: React.AbstractComponent<
+  Props,
+  React.ElementRef<typeof Animated.View>,
+> = React.forwardRef((props, ref) => (
   <TouchableOpacity {...props} hostRef={ref} />
-)): React.AbstractComponent<Props, React.ElementRef<typeof Animated.View>>);
+));
 
 Touchable.displayName = 'TouchableOpacity';
 

diff --git a/packages/react-native/Libraries/MutationObserver/MutationRecord.js b/packages/react-native/Libraries/MutationObserver/MutationRecord.js
@@ -32,15 +32,15 @@ export default class MutationRecord {
   _removedNodes: NodeList<ReadOnlyNode>;
 
   constructor(nativeRecord: NativeMutationRecord) {
-    // $FlowExpectedError[incompatible-cast] the codegen doesn't support the actual type.
-    const target = (nativeRecord.target: ReactNativeElement);
+    // $FlowExpectedError[incompatible-type] the codegen doesn't support the actual type.
+    const target: ReactNativeElement = nativeRecord.target;
     this._target = target;
-    // $FlowExpectedError[incompatible-cast] the codegen doesn't support the actual type.
-    const addedNodes = (nativeRecord.addedNodes: $ReadOnlyArray<ReadOnlyNode>);
+    // $FlowExpectedError[incompatible-type] the codegen doesn't support the actual type.
+    const addedNodes: $ReadOnlyArray<ReadOnlyNode> = nativeRecord.addedNodes;
     this._addedNodes = createNodeList(addedNodes);
-    const removedNodes =
-      // $FlowExpectedError[incompatible-cast] the codegen doesn't support the actual type.
-      (nativeRecord.removedNodes: $ReadOnlyArray<ReadOnlyNode>);
+    const removedNodes: $ReadOnlyArray<ReadOnlyNode> =
+      // $FlowFixMe[incompatible-type]
+      nativeRecord.removedNodes;
     this._removedNodes = createNodeList(removedNodes);
   }
 

diff --git a/packages/react-native/Libraries/ReactNative/BridgelessUIManager.js b/packages/react-native/Libraries/ReactNative/BridgelessUIManager.js
@@ -359,8 +359,8 @@ const UIManagerJS: UIManagerJSInterface & {[string]: any} = {
           return;
         }
 
-        let nativeViewTag = (instanceHandle.stateNode.canonical
-          .nativeTag: number);
+        let nativeViewTag: number =
+          instanceHandle.stateNode.canonical.nativeTag;
 
         FabricUIManager.measure(
           node,

diff --git a/packages/react-native/Libraries/Text/TextAncestor.js b/packages/react-native/Libraries/Text/TextAncestor.js
@@ -15,9 +15,8 @@ const React = require('react');
 /**
  * Whether the current element is the descendant of a <Text> element.
  */
-const TextAncestorContext = (React.createContext(
-  false,
-): React$Context<$FlowFixMe>);
+const TextAncestorContext: React$Context<$FlowFixMe> =
+  React.createContext(false);
 if (__DEV__) {
   TextAncestorContext.displayName = 'TextAncestorContext';
 }

diff --git a/packages/react-native/Libraries/Utilities/binaryToBase64.js b/packages/react-native/Libraries/Utilities/binaryToBase64.js
@@ -24,7 +24,7 @@ function binaryToBase64(data: ArrayBuffer | $ArrayBufferView): string {
     throw new Error('data must be ArrayBuffer or typed array');
   }
   // Already checked that `data` is `DataView` in `ArrayBuffer.isView(data)`
-  const {buffer, byteOffset, byteLength} = ((data: $FlowFixMe): DataView);
+  const {buffer, byteOffset, byteLength}: DataView = (data: $FlowFixMe);
   return base64.fromByteArray(new Uint8Array(buffer, byteOffset, byteLength));
 }
 

diff --git a/packages/rn-tester/js/examples/Animated/EasingExample.js b/packages/rn-tester/js/examples/Animated/EasingExample.js
@@ -136,7 +136,7 @@ function EasingExample(props: Props): React.Node {
       <SectionList
         sections={easingSections}
         renderItem={info => {
-          const item = (info.item: EasingListItem);
+          const item: EasingListItem = info.item;
 
           return (
             <EasingItem

diff --git a/packages/rn-tester/js/examples/Modal/ModalExample.js b/packages/rn-tester/js/examples/Modal/ModalExample.js
@@ -13,13 +13,13 @@ import type {RNTesterModuleExample} from '../../types/RNTesterTypes';
 import ModalOnShow from './ModalOnShow';
 import ModalPresentation from './ModalPresentation';
 
-export const displayName = (undefined: ?string);
+export const displayName: ?string = undefined;
 export const framework = 'React';
 export const title = 'Modal';
 export const category = 'UI';
 export const documentationURL = 'https://reactnative.dev/docs/modal';
 export const description = 'Component for presenting modal views.';
-export const examples = ([
+export const examples: Array<RNTesterModuleExample> = [
   ModalPresentation,
   ModalOnShow,
-]: Array<RNTesterModuleExample>);
+];
diff --git a/...rn-tester/js/examples/MutationObserver/VisualCompletionExample/VisualCompletionExample.js b/...rn-tester/js/examples/MutationObserver/VisualCompletionExample/VisualCompletionExample.js
@@ -64,8 +64,8 @@ function VisualCompletionExampleScreen(props: {
       style={styles.root}
       ref={node => {
         if (node != null) {
-          // $FlowExpectedError[incompatible-cast]
-          const element = (node: ReactNativeElement);
+          // $FlowExpectedError[incompatible-type]
+          const element: ReactNativeElement = node;
           props.vcTracker.addMutationRoot(element);
         }
       }}>

diff --git a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js
@@ -252,7 +252,7 @@ exports.documentationURL = 'https://reactnative.dev/docs/scrollview';
 exports.category = 'Basic';
 exports.description =
   'Component that enables scrolling through child components';
-const examples = ([
+const examples: Array<RNTesterModuleExample> = [
   {
     name: 'scrollTo',
     title: '<ScrollView>\n',
@@ -425,7 +425,7 @@ const examples = ([
       return <AppendingList />;
     },
   },
-]: Array<RNTesterModuleExample>);
+];
 
 if (Platform.OS === 'ios') {
   examples.push({