Add LTI annotations to function params in xplat/js [manually-modified]

Summary: Add annotations to function parameters required for Flow's Local Type Inference project. This codemod prepares the codebase to match Flow's new typechecking algorithm. The new algorithm will make Flow more reliable and predicatable. Reviewed By: bradzacher Differential Revision: D37363351 fbshipit-source-id: a9d3df7db6f9d094ac2ce81aae1f3ab4f62b243a
facebook · Jun 23, 2022 · c940eb0 · c940eb0
1 parent e7a4dbc
commit c940eb0
Show file tree

Hide file tree

Showing 10 changed files with 60 additions and 36 deletions.
diff --git a/IntegrationTests/LayoutEventsTest.js b/IntegrationTests/LayoutEventsTest.js
@@ -19,7 +19,7 @@ import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 
 const deepDiffer = require('react-native/Libraries/Utilities/differ/deepDiffer');
 
-function debug(...args) {
+function debug(...args: Array<void | Layout | string>) {
   // console.log.apply(null, arguments);
 }
 
@@ -119,16 +119,19 @@ class LayoutEventsTest extends React.Component<Props, State> {
   }
 
   onViewLayout: (e: LayoutEvent) => void = (e: LayoutEvent) => {
+    // $FlowFixMe[incompatible-call]
     debug('received view layout event\n', e.nativeEvent);
     this.setState({viewLayout: e.nativeEvent.layout}, this.checkLayout);
   };
 
   onTextLayout: (e: LayoutEvent) => void = (e: LayoutEvent) => {
+    // $FlowFixMe[incompatible-call]
     debug('received text layout event\n', e.nativeEvent);
     this.setState({textLayout: e.nativeEvent.layout}, this.checkLayout);
   };
 
   onImageLayout: (e: LayoutEvent) => void = (e: LayoutEvent) => {
+    // $FlowFixMe[incompatible-call]
     debug('received image layout event\n', e.nativeEvent);
     this.setState({imageLayout: e.nativeEvent.layout}, this.checkLayout);
   };

diff --git a/Libraries/Animated/__tests__/bezier-test.js b/Libraries/Animated/__tests__/bezier-test.js
@@ -19,21 +19,26 @@
 
 const bezier = require('../bezier');
 
-const identity = function (x) {
+const identity = function (x: number) {
   return x;
 };
 
-function assertClose(a, b, precision = 3) {
+function assertClose(a: number, b: number, precision: number = 3) {
   expect(a).toBeCloseTo(b, precision);
 }
 
-function makeAssertCloseWithPrecision(precision) {
-  return function (a, b) {
+function makeAssertCloseWithPrecision(precision: number) {
+  return function (a: number, b: number) {
     assertClose(a, b, precision);
   };
 }
 
-function allEquals(be1, be2, samples, assertion) {
+function allEquals(
+  be1: (x: number) => number,
+  be2: (x: number) => number,
+  samples: number,
+  assertion: $FlowFixMe,
+) {
   if (!assertion) {
     assertion = assertClose;
   }
@@ -43,8 +48,8 @@ function allEquals(be1, be2, samples, assertion) {
   }
 }
 
-function repeat(n) {
-  return function (f) {
+function repeat(n: number) {
+  return function (f: () => void) {
     for (let i = 0; i < n; ++i) {
       f();
     }
@@ -99,7 +104,7 @@ describe('bezier', function () {
           d = Math.random();
         const easing = bezier(a, b, c, d);
         const projected = bezier(b, a, d, c);
-        const composed = function (x) {
+        const composed = function (x: number) {
           return projected(easing(x));
         };
         allEquals(identity, composed, 100, makeAssertCloseWithPrecision(2));
@@ -135,7 +140,7 @@ describe('bezier', function () {
           c = 1 - a,
           d = 1 - b;
         const easing = bezier(a, b, c, d);
-        const sym = function (x) {
+        const sym = function (x: number) {
           return 1 - easing(1 - x);
         };
         allEquals(easing, sym, 100, makeAssertCloseWithPrecision(2));

diff --git a/Libraries/Lists/FlatList.js b/Libraries/Lists/FlatList.js
@@ -459,7 +459,7 @@ class FlatList<ItemT> extends React.PureComponent<Props<ItemT>, void> {
   _listRef: ?React.ElementRef<typeof VirtualizedList>;
   _virtualizedListPairs: Array<ViewabilityConfigCallbackPair> = [];
 
-  _captureRef = ref => {
+  _captureRef = (ref: ?React.ElementRef<typeof VirtualizedList>) => {
     this._listRef = ref;
   };
 
@@ -596,7 +596,7 @@ class FlatList<ItemT> extends React.PureComponent<Props<ItemT>, void> {
       ? 'ListItemComponent'
       : 'renderItem';
 
-    const renderer = (props): React.Node => {
+    const renderer = (props: RenderItemProps<ItemT>): React.Node => {
       if (ListItemComponent) {
         // $FlowFixMe[not-a-component] Component isn't valid
         // $FlowFixMe[incompatible-type-arg] Component isn't valid
@@ -625,6 +625,7 @@ class FlatList<ItemT> extends React.PureComponent<Props<ItemT>, void> {
             <View style={StyleSheet.compose(styles.row, columnWrapperStyle)}>
               {item.map((it, kk) => {
                 const element = renderer({
+                  // $FlowFixMe[incompatible-call]
                   item: it,
                   index: index * cols + kk,
                   separators: info.separators,

diff --git a/Libraries/LogBox/Data/__tests__/LogBoxData-test.js b/Libraries/LogBox/Data/__tests__/LogBoxData-test.js
@@ -51,7 +51,7 @@ const observe = () => {
   };
 };
 
-const addLogs = (logs, options) => {
+const addLogs = (logs: Array<string>, options: void | {flush: boolean}) => {
   logs.forEach(message => {
     LogBoxData.addLog({
       level: 'warn',
@@ -68,7 +68,10 @@ const addLogs = (logs, options) => {
   });
 };
 
-const addSoftErrors = (errors, options) => {
+const addSoftErrors = (
+  errors: Array<string>,
+  options: void | {flush: boolean},
+) => {
   errors.forEach(error => {
     LogBoxData.addException({
       message: '',
@@ -89,7 +92,10 @@ const addSoftErrors = (errors, options) => {
   });
 };
 
-const addFatalErrors = (errors, options) => {
+const addFatalErrors = (
+  errors: Array<$FlowFixMe>,
+  options: void | {flush: boolean},
+) => {
   errors.forEach(error => {
     LogBoxData.addException({
       message: '',
@@ -112,7 +118,7 @@ const addFatalErrors = (errors, options) => {
   });
 };
 
-const addSyntaxError = options => {
+const addSyntaxError = (options: $FlowFixMe) => {
   addFatalErrors(
     [
       {

diff --git a/Libraries/LogBox/UI/__tests__/LogBoxInspectorStackFrames-test.js b/Libraries/LogBox/UI/__tests__/LogBoxInspectorStackFrames-test.js
@@ -18,7 +18,7 @@ const {} = require('../LogBoxInspectorStackFrames');
 const LogBoxLog = require('../../Data/LogBoxLog').default;
 const render = require('../../../../jest/renderer');
 
-const createLogWithFrames = collapsedOptions => {
+const createLogWithFrames = (collapsedOptions: Array<?boolean>) => {
   return new LogBoxLog({
     level: 'warn',
     isComponentError: false,
@@ -32,7 +32,7 @@ const createLogWithFrames = collapsedOptions => {
   });
 };
 
-const createCollapsedFrames = collapsedOptions => {
+const createCollapsedFrames = (collapsedOptions: Array<?boolean>) => {
   return collapsedOptions.map(option => ({
     column: 1,
     file: 'dependency.js',

diff --git a/Libraries/LogBox/__tests__/LogBox-test.js b/Libraries/LogBox/__tests__/LogBox-test.js
@@ -16,7 +16,7 @@ const LogBoxData = require('../Data/LogBoxData');
 
 declare var console: any;
 
-function mockFilterResult(returnValues) {
+function mockFilterResult(returnValues: $FlowFixMe) {
   (LogBoxData.checkWarningFilter: any).mockReturnValue({
     finalFormat: 'Warning: ...',
     forceDialogImmediately: false,

diff --git a/packages/react-native-codegen/src/parsers/flow/components/events.js b/packages/react-native-codegen/src/parsers/flow/components/events.js
@@ -18,8 +18,8 @@ import type {
 
 function getPropertyType(
   name,
-  optional,
-  typeAnnotation,
+  optional: boolean,
+  typeAnnotation: $FlowFixMe,
 ): NamedShape<EventTypeAnnotation> {
   const type =
     typeAnnotation.type === 'GenericTypeAnnotation'
@@ -98,10 +98,10 @@ function getPropertyType(
 }
 
 function findEventArgumentsAndType(
-  typeAnnotation,
-  types,
-  bubblingType,
-  paperName,
+  typeAnnotation: $FlowFixMe,
+  types: TypeMap,
+  bubblingType: void | 'direct' | 'bubble',
+  paperName: ?$FlowFixMe,
 ) {
   if (!typeAnnotation.id) {
     throw new Error("typeAnnotation of event doesn't have a name");
@@ -163,7 +163,7 @@ function buildPropertiesForEvent(property): NamedShape<EventTypeAnnotation> {
   return getPropertyType(name, optional, typeAnnotation);
 }
 
-function getEventArgument(argumentProps, name) {
+function getEventArgument(argumentProps, name: $FlowFixMe) {
   return {
     type: 'ObjectTypeAnnotation',
     properties: argumentProps.map(buildPropertiesForEvent),

diff --git a/packages/react-native-codegen/src/parsers/typescript/components/events.js b/packages/react-native-codegen/src/parsers/typescript/components/events.js
@@ -18,7 +18,7 @@ import type {
 
 function getPropertyType(
   name,
-  optional,
+  optional: boolean,
   typeAnnotation,
 ): NamedShape<EventTypeAnnotation> {
   const type =
@@ -118,10 +118,10 @@ function getPropertyType(
 }
 
 function findEventArgumentsAndType(
-  typeAnnotation,
-  types,
-  bubblingType,
-  paperName,
+  typeAnnotation: $FlowFixMe,
+  types: TypeMap,
+  bubblingType: void | 'direct' | 'bubble',
+  paperName: ?$FlowFixMe,
 ) {
   if (!typeAnnotation.typeName) {
     throw new Error("typeAnnotation of event doesn't have a name");
@@ -177,7 +177,7 @@ function buildPropertiesForEvent(property): NamedShape<EventTypeAnnotation> {
   return getPropertyType(name, optional, typeAnnotation);
 }
 
-function getEventArgument(argumentProps, name) {
+function getEventArgument(argumentProps, name: $FlowFixMe) {
   return {
     type: 'ObjectTypeAnnotation',
     properties: argumentProps.map(buildPropertiesForEvent),

diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js
@@ -1148,10 +1148,19 @@ class DisplayOptionsStatusExample extends React.Component<{}> {
   }
 }
 
-function DisplayOptionStatusExample({optionName, optionChecker, notification}) {
+function DisplayOptionStatusExample({
+  optionName,
+  optionChecker,
+  notification,
+}: {
+  notification: string,
+  optionChecker: () => Promise<boolean>,
+  optionName: string,
+}) {
   const [statusEnabled, setStatusEnabled] = React.useState(false);
   React.useEffect(() => {
     const listener = AccessibilityInfo.addEventListener(
+      // $FlowFixMe[prop-missing]
       notification,
       setStatusEnabled,
     );

diff --git a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js
@@ -52,7 +52,7 @@ class ColorSchemeSubscription extends React.Component<
   }
 }
 
-const ThemedContainer = props => (
+const ThemedContainer = (props: {children: React.Node}) => (
   <RNTesterThemeContext.Consumer>
     {theme => {
       return (
@@ -69,7 +69,7 @@ const ThemedContainer = props => (
   </RNTesterThemeContext.Consumer>
 );
 
-const ThemedText = props => (
+const ThemedText = (props: {children: React.Node}) => (
   <RNTesterThemeContext.Consumer>
     {theme => {
       return <Text style={{color: theme.LabelColor}}>{props.children}</Text>;
@@ -89,7 +89,7 @@ const AppearanceViaHook = () => {
   );
 };
 
-const ColorShowcase = props => (
+const ColorShowcase = (props: {themeName: string}) => (
   <RNTesterThemeContext.Consumer>
     {theme => {
       return (