Cleanup legacy flow types in react-native

jest.config.js

@@ -43,7 +43,7 @@ module.exports = {
     '<rootDir>/packages/react-native/Libraries/Renderer',
     '<rootDir>/packages/react-native/sdks/hermes/',
     ...PODS_LOCATIONS,
-  ] /*:: as $ReadOnlyArray<string> */,
+  ] /*:: as ReadonlyArray<string> */,
   transformIgnorePatterns: ['node_modules/(?!@react-native/)'],
   haste: {
     defaultPlatform: 'ios',
@@ -52,12 +52,12 @@ module.exports = {
   moduleFileExtensions: [
     'fb.js',
     ...defaults.moduleFileExtensions,
-  ] /*:: as $ReadOnlyArray<string> */,
+  ] /*:: as ReadonlyArray<string> */,
   modulePathIgnorePatterns: [
     'scripts/.*/__fixtures__/',
     '<rootDir>/packages/react-native/sdks/hermes/',
     ...PODS_LOCATIONS,
-  ] /*:: as $ReadOnlyArray<string> */,
+  ] /*:: as ReadonlyArray<string> */,
   unmockedModulePathPatterns: [
     'node_modules/react/',
     'packages/react-native/Libraries/Renderer',

packages/dev-middleware/src/__tests__/InspectorProxyCdpTransport-test.js

@@ -522,9 +522,9 @@ describe.each(['HTTP', 'HTTPS'])(
 
           // Collect all connect events
           const connectEvents: Array<
-            $ReadOnly<{
+            Readonly<{
               event: string,
-              payload: $ReadOnly<{pageId: string, sessionId?: string}>,
+              payload: Readonly<{pageId: string, sessionId?: string}>,
             }>,
           > = [];
           device.connect.mockImplementation(message => {

packages/dev-middleware/src/types/ReadonlyURL.js

@@ -25,7 +25,7 @@ export interface ReadonlyURLSearchParams {
       value: string,
       name: string,
       params: URLSearchParams,
-    ) => mixed,
+    ) => unknown,
     thisArg: This,
   ): void;
   toString(): string;

packages/react-native-babel-preset/src/__tests__/__fixtures__/kitchen-sink-input.js

@@ -59,7 +59,7 @@ async function* asyncNumberGenerator(
 }
 
 // Async/await patterns
-async function fetchData(url: string): Promise<{data: mixed}> {
+async function fetchData(url: string): Promise<{data: unknown}> {
   const response = await fetch(url);
   const data = await response.json();
   return {data};
@@ -159,7 +159,7 @@ function parseDate(
 }
 
 // Try-catch with optional binding
-function safeJsonParse(input: string): mixed {
+function safeJsonParse(input: string): unknown {
   try {
     return JSON.parse(input);
   } catch {
@@ -182,7 +182,7 @@ const MyClass = class {
 };
 
 // Dynamic import (syntax only)
-async function loadModule(): Promise<mixed> {
+async function loadModule(): Promise<unknown> {
   // $FlowExpectedError[cannot-resolve-module] - Testing dynamic import syntax
   const module = await import('./some-module');
   return module.default;

packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js

@@ -133,7 +133,7 @@ const testConfigs = [
 
 function transformCode(
   code: string,
-  options: {[string]: mixed},
+  options: {[string]: unknown},
 ): string | null {
   const result = babel.transformSync(code, {
     babelrc: false,
@@ -156,7 +156,7 @@ function ensureDirectoryExists(dir: string): void {
   }
 }
 
-function makeHeader(description: string, options: {[string]: mixed}): string {
+function makeHeader(description: string, options: {[string]: unknown}): string {
   return `/**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *

packages/react-native-codegen/src/parsers/consistency/compareSnaps.js

@@ -11,13 +11,13 @@
 'use strict';
 
 function compareSnaps(
-  flowFixtures /*: $ReadOnly<{[string]: string}> */,
-  flowSnaps /*: $ReadOnly<{[string]: string}> */,
-  flowExtraCases /*: $ReadOnlyArray<string> */,
-  tsFixtures /*: $ReadOnly<{[string]: string}> */,
-  tsSnaps /*: $ReadOnly<{[string]: string}> */,
-  tsExtraCases /*: $ReadOnlyArray<string> */,
-  ignoredCases /*: $ReadOnlyArray<string> */,
+  flowFixtures /*: Readonly<{[string]: string}> */,
+  flowSnaps /*: Readonly<{[string]: string}> */,
+  flowExtraCases /*: ReadonlyArray<string> */,
+  tsFixtures /*: Readonly<{[string]: string}> */,
+  tsSnaps /*: Readonly<{[string]: string}> */,
+  tsExtraCases /*: ReadonlyArray<string> */,
+  ignoredCases /*: ReadonlyArray<string> */,
 ) {
   const flowCases = Object.keys(flowFixtures).sort();
   const tsCases = Object.keys(tsFixtures).sort();
@@ -68,8 +68,8 @@ function compareSnaps(
 }
 
 function compareTsArraySnaps(
-  tsSnaps /*: $ReadOnly<{[string]: string}> */,
-  tsExtraCases /*: $ReadOnlyArray<string> */,
+  tsSnaps /*: Readonly<{[string]: string}> */,
+  tsExtraCases /*: ReadonlyArray<string> */,
 ) {
   for (const array2Case of tsExtraCases.filter(
     name => name.indexOf('ARRAY2') !== -1,

packages/react-native-compatibility-check/src/ErrorFormatting.js

@@ -199,7 +199,7 @@ function formatTypeAnnotation(annotation: CompleteTypeAnnotation): string {
       let validUnionType;
       try {
         validUnionType = parseValidUnionType(annotation);
-      } catch (_e: mixed) {
+      } catch (_e: unknown) {
         // parseValidUnionType throws for unsupported union types
         return 'Union<mixed>';
       }

packages/react-native/Libraries/Components/AccessibilityInfo/__tests__/AccessibilityInfo-test.js

@@ -105,7 +105,7 @@ describe('AccessibilityInfo', () => {
         mockNativeAccessibilityManagerDefault.getCurrentPrefersCrossFadeTransitionsState =
           null;
 
-        const result: mixed =
+        const result: unknown =
           await AccessibilityInfo.prefersCrossFadeTransitions().catch(e => e);
 
         invariant(
@@ -151,7 +151,7 @@ describe('AccessibilityInfo', () => {
         mockNativeAccessibilityManagerDefault.getCurrentDarkerSystemColorsState =
           null;
 
-        const result: mixed =
+        const result: unknown =
           await AccessibilityInfo.isDarkerSystemColorsEnabled().catch(e => e);
 
         invariant(
@@ -184,7 +184,7 @@ describe('AccessibilityInfo', () => {
 
         mockNativeAccessibilityInfo.isHighTextContrastEnabled = null;
 
-        const result: mixed =
+        const result: unknown =
           await AccessibilityInfo.isHighTextContrastEnabled().catch(e => e);
 
         invariant(

packages/react-native/Libraries/Core/Devtools/__tests__/loadBundleFromServer-test.js

@@ -95,7 +95,7 @@ test('loadBundleFromServer will throw for JSON responses', async () => {
   mockDataResponse = JSON.stringify({message: 'Error thrown from Metro'});
   mockRequestError = null;
 
-  const error: mixed = await loadBundleFromServer(
+  const error: unknown = await loadBundleFromServer(
     '/Fail.bundle?platform=ios',
   ).catch(e => e);
 
@@ -112,7 +112,7 @@ test('loadBundleFromServer will throw LoadBundleFromServerError for request erro
   mockDataResponse = '';
   mockRequestError = 'Some error';
 
-  const error: mixed = await loadBundleFromServer(
+  const error: unknown = await loadBundleFromServer(
     '/Fail.bundle?platform=ios',
   ).catch(e => e);
 

packages/react-native/cli.js

@@ -47,7 +47,7 @@ function isMissingCliDependency(error /*: Error */) {
   );
 }
 
-let cli /*: $ReadOnly<{
+let cli /*: Readonly<{
   bin: string,
   loadConfig: $FlowFixMe,
   run: () => void

packages/react-native/react-native.config.js

@@ -114,9 +114,9 @@ commands.push(codegenCommand);
 
 const config = {
   commands,
-  platforms: {} /*:: as {[string]: $ReadOnly<{
-      projectConfig: mixed,
-      dependencyConfig: mixed,
+  platforms: {} /*:: as {[string]: Readonly<{
+      projectConfig: unknown,
+      dependencyConfig: unknown,
     }>} */,
 };
 

packages/react-native/scripts/codegen/generate-artifacts-executor/generateCustomURLHandlers.js

@@ -26,7 +26,7 @@ const MODULES_PROTOCOLS_MM_TEMPLATE_PATH = path.join(
 );
 
 function generateCustomURLHandlers(
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
   outputDir /*: string */,
 ) {
   const iosAnnotations = parseiOSAnnotations(libraries);

packages/react-native/scripts/codegen/generate-artifacts-executor/generateNativeCode.js

@@ -19,7 +19,7 @@ const path = require('path');
 
 function generateNativeCode(
   outputPath /*: string */,
-  schemaInfos /*: $ReadOnlyArray<$FlowFixMe> */,
+  schemaInfos /*: ReadonlyArray<$FlowFixMe> */,
   includesGeneratedCode /*: boolean */,
   platform /*: string */,
   forceOutputPath /*: boolean */ = false,

packages/react-native/scripts/codegen/generate-artifacts-executor/generateRCTModuleProviders.js

@@ -32,7 +32,7 @@ const MODULE_PROVIDERS_MM_TEMPLATE_PATH = path.join(
 function generateRCTModuleProviders(
   projectRoot /*: string */,
   pkgJson /*: $FlowFixMe */,
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
   outputDir /*: string */,
 ) {
   fs.mkdirSync(outputDir, {recursive: true});

packages/react-native/scripts/codegen/generate-artifacts-executor/generateRCTThirdPartyComponents.js

@@ -31,7 +31,7 @@ const THIRD_PARTY_COMPONENTS_MM_TEMPLATE_PATH = path.join(
 );
 
 function generateRCTThirdPartyComponents(
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
   outputDir /*: string */,
 ) {
   fs.mkdirSync(outputDir, {recursive: true});

packages/react-native/scripts/codegen/generate-artifacts-executor/generateSchemaInfos.js

@@ -17,7 +17,7 @@ const path = require('path');
 const {globSync} = require('tinyglobby');
 
 function generateSchemaInfos(
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
 ) /*: Array<$FlowFixMe> */ {
   // $FlowFixMe[incompatible-type]
   return libraries.map(generateSchemaInfo);

packages/react-native/scripts/codegen/generate-artifacts-executor/generateUnstableModulesRequiringMainQueueSetupProvider.js

@@ -28,7 +28,7 @@ const UNSTABLE_MODULES_REQUIRING_MAIN_QUEUE_SETUP_PROVIDER_MM_TEMPLATE_PATH =
   );
 
 function generateUnstableModulesRequiringMainQueueSetupProvider(
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
   outputDir /*: string */,
 ) {
   const iosAnnotations = parseiOSAnnotations(libraries);

packages/react-native/scripts/codegen/generate-artifacts-executor/utils.js

@@ -389,7 +389,7 @@ function isReactNativeCoreLibrary(libraryName /*: string */) /*: boolean */ {
  * Validates that components are defined in at most one library.
  */
 function parseiOSAnnotations(
-  libraries /*: $ReadOnlyArray<$FlowFixMe> */,
+  libraries /*: ReadonlyArray<$FlowFixMe> */,
 ) /*: {[string]: $FlowFixMe} */ {
   const mLibraryMap /*: {[string]: $FlowFixMe} */ = {};
   const cLibraryMap /*: {[string]: $FlowFixMe} */ = {};

packages/react-native/scripts/codegen/generate-specs-cli-executor.js

@@ -14,7 +14,7 @@ const utils = require('./codegen-utils');
 const fs = require('fs');
 const path = require('path');
 
-const GENERATORS /*: {[string]: {[string]: $ReadOnlyArray<string>}} */ = {
+const GENERATORS /*: {[string]: {[string]: ReadonlyArray<string>}} */ = {
   all: {
     android: ['componentsAndroid', 'modulesAndroid', 'modulesCxx'],
     ios: ['componentsIOS', 'modulesIOS', 'modulesCxx'],

packages/react-native/scripts/generate-provider-cli.js

@@ -34,7 +34,7 @@ const argv = yargs
     'Please provide platform, schema path, and output directory.',
   ).argv;
 
-const GENERATORS /*: {[string]: $ReadOnlyArray<string>} */ = {
+const GENERATORS /*: {[string]: ReadonlyArray<string>} */ = {
   android: [],
   ios: ['providerIOS'],
 };

packages/react-native/scripts/ios-prebuild/cli.js

@@ -14,15 +14,15 @@ const yargs = require('yargs');
 import type {BuildFlavor, Destination, Platform} from './types';
 */
 
-const platforms /*: $ReadOnlyArray<Platform> */ = [
+const platforms /*: ReadonlyArray<Platform> */ = [
   'ios',
   'ios-simulator',
   'mac-catalyst',
 ];
 
 // CI can't use commas in cache keys, so 'macOS,variant=Mac Catalyst' was creating troubles
 // This map that converts from platforms to valid Xcodebuild destinations.
-const platformToDestination /*: $ReadOnly<{|[Platform]: Destination|}> */ = {
+const platformToDestination /*: Readonly<{|[Platform]: Destination|}> */ = {
   ios: 'iOS',
   'ios-simulator': 'iOS Simulator',
   'mac-catalyst': 'macOS,variant=Mac Catalyst',
@@ -78,7 +78,7 @@ async function getCLIConfiguration() /*: Promise<?{|
     compose: boolean,
   |},
   flavor: BuildFlavor,
-  destinations: $ReadOnlyArray<Destination>,
+  destinations: ReadonlyArray<Destination>,
   identity: ?string,
 |}> */ {
   // Run input parsing

packages/react-native/scripts/ios-prebuild/headers-config.js

@@ -9,12 +9,12 @@
  */
 
 /*::
-export type PodSpecConfiguration = $ReadOnly<{
+export type PodSpecConfiguration = Readonly<{
   name: string,
   headerPatterns: Array<string>,
   headerDir?: string,
   excludePatterns?: Array<string>,
-  subSpecs?: $ReadOnlyArray<PodSpecConfiguration>,
+  subSpecs?: ReadonlyArray<PodSpecConfiguration>,
   preservePaths?: Array<string>,
 } | {disabled: true}>;
 */

packages/react-native/src/private/renderer/branching/__tests__/ShadowTreeBranching-itest.js

@@ -41,7 +41,7 @@ describe('ShadowTreeBranching', () => {
       'Insert {type: "View", parentNativeID: (root), index: 0, nativeID: "view"}',
     ]);
 
-    let updatesBeforeEndOfTask: $ReadOnlyArray<string> = [];
+    let updatesBeforeEndOfTask: ReadonlyArray<string> = [];
 
     Fantom.runTask(() => {
       root.render(
@@ -68,7 +68,7 @@ describe('ShadowTreeBranching', () => {
   it('should not skip intermediate React commits', () => {
     const root = Fantom.createRoot();
 
-    let updatesBeforeEndOfTask: $ReadOnlyArray<string> = [];
+    let updatesBeforeEndOfTask: ReadonlyArray<string> = [];
 
     // When rendered with `shouldTriggerIntermediate=false`, it renders two views
     // both with blue background. When rendered with `shouldTriggerIntermediate=true`,

packages/rn-tester/js/examples/AnimationBackend/SwipeableListExample.js

@@ -37,7 +37,7 @@ type Data = {
   title: string,
 };
 
-const initialData: $ReadOnlyArray<Data> = [
+const initialData: ReadonlyArray<Data> = [
   {id: '1', title: 'Kate Bell'},
   {id: '2', title: 'John Appleseed'},
   {id: '3', title: 'Mark Zuckerberg'},
@@ -62,7 +62,7 @@ const timingConfig = {
 };
 
 function SwipeableListExample(): React.Node {
-  const [data, setData] = React.useState<$ReadOnlyArray<Data>>(initialData);
+  const [data, setData] = React.useState<ReadonlyArray<Data>>(initialData);
 
   const handleRemove = useCallback((id: string) => {
     setData(currentData => currentData.filter(item => item.id !== id));

private/helloworld/metro.config.js

@@ -46,4 +46,4 @@ const config = {
 module.exports = mergeConfig(
   getDefaultConfig(__dirname),
   config,
-) /*:: as $ReadOnly<InputConfigT> */;
+) /*:: as Readonly<InputConfigT> */;

private/react-native-fantom/config/jest.config.js

@@ -26,7 +26,7 @@ module.exports = {
     ...baseConfig.moduleFileExtensions,
     'cpp',
     'h',
-  ] /*:: as $ReadOnlyArray<string> */,
+  ] /*:: as ReadonlyArray<string> */,
   // This allows running Meta-internal tests with the `-test.fb.js` suffix.
   testRegex: '/__tests__/.*-itest(\\.fb)?\\.js$',
   testPathIgnorePatterns: [

private/react-native-fantom/runner/utils.js

@@ -61,7 +61,7 @@ export function getBuckModesForPlatform({
 }: {
   enableCoverage: boolean,
   enableOptimized: boolean,
-}): $ReadOnlyArray<string> {
+}): ReadonlyArray<string> {
   let mode = enableCoverage ? 'code-coverage' : enableOptimized ? 'opt' : 'dev';
 
   if (enableOptimized) {

private/react-native-fantom/src/index.js

@@ -256,8 +256,9 @@ export function getDefinedEventHandlers(
   }
   // WARNING: This uses React private API (fiber internals).
   // $FlowExpectedError[incompatible-type]
-  const memoizedProps = (instanceHandle as {memoizedProps?: {[string]: mixed}})
-    .memoizedProps;
+  const memoizedProps = (
+    instanceHandle as {memoizedProps?: {[string]: unknown}}
+  ).memoizedProps;
   if (memoizedProps == null) {
     return [];
   }