Add annotations to fix future natural inference errors in xplat/js: 6/n (#53894)

Summary:
Pull Request resolved: #53894

Changelog: [Internal]

Reviewed By: marcoww6

Differential Revision: D83000736

fbshipit-source-id: 3ba5c59d9b2f7b967c0dccd24a73056430153bdc

Author: SamChou19815

flow-typed/environment/node.js

@@ -3057,30 +3057,30 @@ type util$InspectOptions = {
 };
 
 declare type util$ParseArgsOption =
-  | {|
+  | $ReadOnly<{|
       type: 'boolean',
       multiple?: false,
       short?: string,
       default?: boolean,
-    |}
-  | {|
+    |}>
+  | $ReadOnly<{|
       type: 'boolean',
       multiple: true,
       short?: string,
       default?: Array<boolean>,
-    |}
-  | {|
+    |}>
+  | $ReadOnly<{|
       type: 'string',
       multiple?: false,
       short?: string,
       default?: string,
-    |}
-  | {|
+    |}>
+  | $ReadOnly<{|
       type: 'string',
       multiple: true,
       short?: string,
       default?: Array<string>,
-    |};
+    |}>;
 
 type util$ParseArgsOptionToValue<TOption> = TOption['type'] extends 'boolean'
   ? TOption['multiple'] extends true
@@ -3137,7 +3137,7 @@ declare module 'util' {
   declare function stripVTControlCharacters(str: string): string;
 
   declare function parseArgs<
-    TOptions: {[string]: util$ParseArgsOption} = {||},
+    TOptions: {+[string]: util$ParseArgsOption} = {||},
   >(config: {|
     args?: Array<string>,
     options?: TOptions,

packages/debugger-shell/src/electron/index.flow.js

@@ -25,7 +25,9 @@ app.setVersion(pkg.version + '-' + buildInfo.revision);
 const {
   values: {version = false},
 } = util.parseArgs({
-  options: {version: {type: 'boolean'}},
+  options: {
+    version: {type: 'boolean'},
+  },
   args: process.argv.slice(app.isPackaged ? 1 : 2),
   strict: false,
 });

packages/react-native-codegen/src/cli/combine/combine-js-to-schema.js

@@ -47,7 +47,7 @@ function combineSchemas(
       }
       return merged;
     },
-    {modules: {}},
+    {modules: {} /*:: as SchemaType['modules'] */},
   );
 
   return {

packages/react-native/scripts/featureflags/print.js

@@ -37,8 +37,8 @@ function getPurposeString(purpose: string): string {
 }
 
 function compareFeatureFlags(
-  [keyA, valueA]: [string, {Purpose: string, ...}],
-  [keyB, valueB]: [string, {Purpose: string, ...}],
+  [keyA, valueA]: $ReadOnly<[string, $ReadOnly<{Purpose: string, ...}>]>,
+  [keyB, valueB]: $ReadOnly<[string, $ReadOnly<{Purpose: string, ...}>]>,
 ): number {
   const purposeA = PURPOSE_ORDER.indexOf(valueA.Purpose);
   const purposeB = PURPOSE_ORDER.indexOf(valueB.Purpose);

packages/rn-tester/IntegrationTests/ImageCachePolicyTest.js

@@ -31,7 +31,7 @@ const {TestModule} = NativeModules;
 const TESTS = ['only-if-cached', 'default', 'reload', 'force-cache'] as const;
 
 function ImageCachePolicyTest(): React.Node {
-  const [state, setState] = useState({
+  const [state, setState] = useState<{[string]: ?boolean}>({
     'only-if-cached': undefined,
     default: undefined,
     reload: undefined,

packages/rn-tester/js/examples/Filter/FilterExample.js

@@ -68,7 +68,7 @@ function StaticViewAndImageWithState(props: Props): React.Node {
 
 const styles = StyleSheet.create({
   blurWithShadow: {
-    filter: [{blur: 10}],
+    filter: [{blur: 10 as string | number}],
     boxShadow: '0 0 10px 10px black',
     overflow: 'hidden',
     backgroundColor: 'pink',

packages/rn-tester/js/examples/Transform/TransformExample.js

@@ -9,6 +9,7 @@
  */
 
 import type {RNTesterModuleExample} from '../../types/RNTesterTypes';
+import type {AnimatedNode} from 'react-native/Libraries/Animated/AnimatedExports';
 
 import * as React from 'react';
 import {useEffect, useRef, useState} from 'react';
@@ -226,7 +227,16 @@ const styles = StyleSheet.create({
     height: 50,
     position: 'absolute',
     top: 0,
-    transform: [{translate: [200, 350]}, {scale: 2.5}, {rotate: '-0.2rad'}],
+    transform: [
+      {
+        translate: [200, 350] as [
+          number | string | AnimatedNode,
+          number | string | AnimatedNode,
+        ],
+      },
+      {scale: 2.5},
+      {rotate: '-0.2rad'},
+    ],
     width: 100,
   },
   box5: {
@@ -238,7 +248,16 @@ const styles = StyleSheet.create({
     width: 50,
   },
   box5Transform: {
-    transform: [{translate: [-50, 35]}, {rotate: '50deg'}, {scale: 2}],
+    transform: [
+      {
+        translate: [-50, 35] as [
+          number | string | AnimatedNode,
+          number | string | AnimatedNode,
+        ],
+      },
+      {rotate: '50deg'},
+      {scale: 2},
+    ],
   },
   box6: {
     backgroundColor: 'salmon',

packages/virtualized-lists/Lists/__tests__/VirtualizedSectionList-test.js

@@ -97,14 +97,16 @@ describe('VirtualizedSectionList', () => {
           ListEmptyComponent={() => <empty />}
           ListFooterComponent={() => <footer />}
           ListHeaderComponent={() => <header />}
-          sections={[
-            {
-              title: 's1',
-              data: new Array<void>(5)
-                .fill()
-                .map((_, ii) => ({id: String(ii)})) as Array<{id: string}>,
-            },
-          ]}
+          sections={
+            [
+              {
+                title: 's1',
+                data: new Array<void>(5)
+                  .fill()
+                  .map((_, ii) => ({id: String(ii)})) as Array<{id: string}>,
+              },
+            ] as Array<SectionBase<{id: string}>>
+          }
           getItem={(data, key) => data[key]}
           getItemCount={data => data.length}
           getItemLayout={({index}) => ({
@@ -165,21 +167,25 @@ describe('VirtualizedSectionList', () => {
       component = ReactTestRenderer.create(
         <VirtualizedSectionList
           // $FlowFixMe[incompatible-type]
-          sections={[
-            {title: 'outer', data: [{key: 'outer0'}, {key: 'outer1'}]},
-          ]}
+          sections={
+            [
+              {title: 'outer', data: [{key: 'outer0'}, {key: 'outer1'}]},
+            ] as Array<SectionBase<{key: string}>>
+          }
           renderItem={outerInfo => (
             <VirtualizedSectionList
-              sections={[
-                // $FlowFixMe[incompatible-type]
-                {
-                  title: 'inner',
-                  data: [
-                    {key: outerInfo.item.key + ':inner0'},
-                    {key: outerInfo.item.key + ':inner1'},
-                  ],
-                },
-              ]}
+              sections={
+                [
+                  // $FlowFixMe[incompatible-type]
+                  {
+                    title: 'inner',
+                    data: [
+                      {key: outerInfo.item.key + ':inner0'},
+                      {key: outerInfo.item.key + ':inner1'},
+                    ],
+                  },
+                ] as Array<SectionBase<{key: string}>>
+              }
               horizontal={outerInfo.item.key === 'outer1'}
               renderItem={innerInfo => {
                 return <item title={innerInfo.item.key} />;
@@ -206,18 +212,20 @@ describe('VirtualizedSectionList', () => {
       await ReactTestRenderer.act(() => {
         component = ReactTestRenderer.create(
           <VirtualizedSectionList
-            sections={[
-              // $FlowFixMe[incompatible-type]
-              {
-                title: 's1',
-                data: [{key: 'i1.1'}, {key: 'i1.2'}, {key: 'i1.3'}],
-              },
-              // $FlowFixMe[incompatible-type]
-              {
-                title: 's2',
-                data: [{key: 'i2.1'}, {key: 'i2.2'}, {key: 'i2.3'}],
-              },
-            ]}
+            sections={
+              [
+                // $FlowFixMe[incompatible-type]
+                {
+                  title: 's1',
+                  data: [{key: 'i1.1'}, {key: 'i1.2'}, {key: 'i1.3'}],
+                },
+                // $FlowFixMe[incompatible-type]
+                {
+                  title: 's2',
+                  data: [{key: 'i2.1'}, {key: 'i2.2'}, {key: 'i2.3'}],
+                },
+              ] as Array<SectionBase<{key: string}>>
+            }
             renderItem={({item}) => <item value={item.key} />}
             getItem={(data, key) => data[key]}
             getItemCount={data => data.length}

scripts/releases/upload-release-assets-for-dotslash.js

@@ -56,7 +56,7 @@ async function main() {
       force: {type: 'boolean', default: false},
       dryRun: {type: 'boolean', default: false},
       help: {type: 'boolean'},
-    },
+    } /*:: as {[string]: util$ParseArgsOption} */,
   });
 
   if (help) {

scripts/releases/validate-dotslash-artifacts.js

@@ -31,7 +31,7 @@ async function main() {
     allowPositionals: true,
     options: {
       help: {type: 'boolean'},
-    },
+    } /*:: as {[string]: util$ParseArgsOption} */,
   });
 
   if (help) {