feat(react-native): upgrade react-native to 0.72.4 (#19160)

packages/expo/migrations.json

@@ -77,6 +77,18 @@
       "version": "16.6.0-beta.0",
       "description": "Update metro.config.js to use the new metro config format",
       "implementation": "./src/migrations/update-16-6-0/update-metro-config"
+    },
+    "update-16-9-0-remove-types-react-native": {
+      "cli": "nx",
+      "version": "16.9.0-beta.1",
+      "description": "Remove @types/react-native from package.json",
+      "implementation": "./src/migrations/update-16-9-0/remove-types-react-native"
+    },
+    "update-16-9-0-update-eas-json-cli-version": {
+      "cli": "nx",
+      "version": "16.9.0-beta.1",
+      "description": "Update eas.json cli version",
+      "implementation": "./src/migrations/update-16-9-0/update-eas-cli-version"
     }
   },
   "packageJsonUpdates": {
@@ -928,6 +940,51 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "16.9.0": {
+      "version": "16.9.0-beta.1",
+      "packages": {
+        "expo": {
+          "version": "49.0.10",
+          "alwaysAddToPackageJson": false
+        },
+        "@expo/metro-config": {
+          "version": "~0.10.7",
+          "alwaysAddToPackageJson": false
+        },
+        "expo-splash-screen": {
+          "version": "~0.20.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@expo/cli": {
+          "version": "~0.10.12",
+          "alwaysAddToPackageJson": false
+        },
+        "eas-cli": {
+          "version": "~5.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "babel-preset-expo": {
+          "version": "~9.5.2",
+          "alwaysAddToPackageJson": false
+        },
+        "react-native": {
+          "version": "0.72.4",
+          "alwaysAddToPackageJson": false
+        },
+        "react-native-web": {
+          "version": "~0.19.8",
+          "alwaysAddToPackageJson": false
+        },
+        "@testing-library/react-native": {
+          "version": "~12.3.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@testing-library/jest-native": {
+          "version": "~5.4.3",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/expo/src/generators/application/files/eas.json.template

@@ -23,6 +23,6 @@
     "production": {}
   },
   "cli": {
-    "version": "<%= easCliVersion %>"
+    "version": ">= <%= easCliVersion.replace('~', '') %>"
   }
 }

packages/expo/src/generators/init/init.spec.ts

@@ -17,7 +17,6 @@ describe('init', () => {
     expect(packageJson.dependencies['expo']).toBeDefined();
     expect(packageJson.dependencies['react-native']).toBeDefined();
     expect(packageJson.devDependencies['@types/react']).toBeDefined();
-    expect(packageJson.devDependencies['@types/react-native']).toBeDefined();
   });
 
   it('should add .gitignore entries for React native files and directories', async () => {

packages/expo/src/generators/init/init.ts

@@ -28,7 +28,6 @@ import {
   reactVersion,
   testingLibraryJestNativeVersion,
   testingLibraryReactNativeVersion,
-  typesReactNativeVersion,
   typesReactVersion,
 } from '../../utils/versions';
 
@@ -95,7 +94,6 @@ export function updateDependencies(host: Tree) {
     {
       '@nx/expo': nxVersion,
       '@types/react': typesReactVersion,
-      '@types/react-native': typesReactNativeVersion,
       metro: metroVersion,
       'metro-resolver': metroVersion,
       'react-test-renderer': reactTestRendererVersion,

packages/expo/src/migrations/update-16-6-0/add-depends-on.ts

@@ -10,12 +10,20 @@ export default async function update(tree: Tree) {
   for (const [name, config] of projects.entries()) {
     if (config.targets?.['start']?.executor === '@nx/expo:start') {
       config.targets['start'].dependsOn = ['ensure-symlink', 'sync-deps'];
+    }
+    if (config.targets?.['run-ios']?.executor === '@nx/expo:run') {
       config.targets['run-ios'].dependsOn = ['ensure-symlink', 'sync-deps'];
+    }
+    if (config.targets?.['run-android']?.executor === '@nx/expo:run') {
       config.targets['run-android'].dependsOn = ['ensure-symlink', 'sync-deps'];
+    }
+    if (config.targets?.['prebuild']?.executor === '@nx/expo:prebuild') {
       config.targets['prebuild'].dependsOn = ['ensure-symlink', 'sync-deps'];
+    }
+    if (config.targets?.['export']?.executor === '@nx/expo:export') {
       config.targets['export'].dependsOn = ['ensure-symlink', 'sync-deps'];
+    }
 
     updateProjectConfiguration(tree, name, config);
   }
-  }
 }

packages/expo/src/migrations/update-16-9-0/remove-types-react-native.ts

@@ -0,0 +1,22 @@
+import { readJson, Tree, updateJson } from '@nx/devkit';
+
+/**
+ * Remove @types/react-native package since it is no longer required. It would be a part of react native package.
+ * @param tree
+ * @returns
+ */
+export default async function update(tree: Tree) {
+  const packageJson = readJson(tree, 'package.json');
+
+  if (
+    !packageJson.devDependencies['@types/react-native'] ||
+    !packageJson.dependencies['react-native']
+  ) {
+    return;
+  }
+
+  updateJson(tree, 'package.json', (packageJson) => {
+    delete packageJson.devDependencies['@types/react-native'];
+    return packageJson;
+  });
+}

packages/expo/src/migrations/update-16-9-0/update-eas-cli-version.spec.ts

@@ -0,0 +1,28 @@
+import { addProjectConfiguration, getProjects, Tree } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import update from './update-eas-cli-version';
+
+describe('update-eas-cli-version', () => {
+  let tree: Tree;
+
+  beforeEach(async () => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    addProjectConfiguration(tree, 'product', {
+      root: 'apps/product',
+      sourceRoot: 'apps/product/src',
+      targets: {
+        start: {
+          executor: '@nx/expo:start',
+        },
+      },
+    });
+    tree.write('apps/product/eas.json', '{"cli":{"version": "1.2.3"}}');
+  });
+
+  it(`should update eas.json with greater than version`, async () => {
+    await update(tree);
+
+    const easJson = JSON.parse(tree.read('apps/product/eas.json').toString());
+    expect(easJson.cli.version).toContain('>=');
+  });
+});

packages/expo/src/migrations/update-16-9-0/update-eas-cli-version.ts

@@ -0,0 +1,23 @@
+import {
+  Tree,
+  formatFiles,
+  getProjects,
+  updateProjectConfiguration,
+  updateJson,
+} from '@nx/devkit';
+import { easCliVersion } from '../../utils/versions';
+
+export default async function update(tree: Tree) {
+  const projects = getProjects(tree);
+
+  for (const [name, config] of projects.entries()) {
+    if (config.targets?.['start']?.executor === '@nx/expo:start') {
+      updateJson(tree, `${config.root}/eas.json`, (easJson) => {
+        if (easJson?.cli?.version) {
+          easJson.cli.version = `>= ${easCliVersion.replace('~', '')}`;
+        }
+        return easJson;
+      });
+    }
+  }
+}

packages/expo/src/utils/versions.ts

@@ -1,27 +1,26 @@
 export const nxVersion = require('../../package.json').version;
 
-export const expoVersion = '49.0.3';
+export const expoVersion = '49.0.10';
-export const expoMetroConfigVersion = '~0.10.6';
+export const expoMetroConfigVersion = '~0.10.7';
-export const expoSplashScreenVersion = '~0.20.4';
+export const expoSplashScreenVersion = '~0.20.5';
 export const expoStatusBarVersion = '~1.6.0';
-export const expoCliVersion = '~0.10.10'; // @expo/cli
+export const expoCliVersion = '~0.10.12'; // @expo/cli
-export const easCliVersion = '~3.15.1';
+export const easCliVersion = '~5.2.0';
-export const babelPresetExpoVersion = '~9.5.0';
+export const babelPresetExpoVersion = '~9.5.2';
 
 export const reactVersion = '18.2.0';
 export const reactDomVersion = '18.2.0';
 export const reactTestRendererVersion = '18.2.0';
 export const typesReactVersion = '18.0.28';
 
-export const reactNativeVersion = '0.72.3';
+export const reactNativeVersion = '0.72.4';
-export const typesReactNativeVersion = '0.72.2';
+export const reactNativeWebVersion = '~0.19.8';
-export const reactNativeWebVersion = '~0.19.6';
 
 export const reactNativeSvgTransformerVersion = '1.0.0';
 export const reactNativeSvgVersion = '13.9.0';
 
 export const metroVersion = '0.76.7';
 
-export const testingLibraryReactNativeVersion = '12.1.2';
+export const testingLibraryReactNativeVersion = '~12.3.0';
-export const testingLibraryJestNativeVersion = '5.4.2';
+export const testingLibraryJestNativeVersion = '~5.4.3';
 export const jestExpoVersion = '~49.0.0';

packages/react-native/migrations.json

@@ -101,6 +101,12 @@
       "version": "16.6.0-beta.0",
       "description": "Update metro.config.js to use the new metro config format",
       "implementation": "./src/migrations/update-16-6-0/update-metro-config"
+    },
+    "update-16-9-0-remove-types-react-native": {
+      "cli": "nx",
+      "version": "16.9.0-beta.1",
+      "description": "Remove @types/react-native from package.json",
+      "implementation": "./src/migrations/update-16-9-0/remove-types-react-native"
     }
   },
   "packageJsonUpdates": {
@@ -1426,6 +1432,47 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "16.9.0": {
+      "version": "16.9.0-beta.1",
+      "packages": {
+        "react-native": {
+          "version": "0.72.4",
+          "alwaysAddToPackageJson": false
+        },
+        "@react-native/metro-config": {
+          "version": "^0.72.11",
+          "alwaysAddToPackageJson": false
+        },
+        "@react-native-community/cli": {
+          "version": "11.3.6",
+          "alwaysAddToPackageJson": false
+        },
+        "@react-native-community/cli-platform-android": {
+          "version": "11.3.6",
+          "alwaysAddToPackageJson": false
+        },
+        "@react-native-community/cli-platform-ios": {
+          "version": "11.3.6",
+          "alwaysAddToPackageJson": false
+        },
+        "@testing-library/react-native": {
+          "version": "~12.3.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@testing-library/jest-native": {
+          "version": "~5.4.3",
+          "alwaysAddToPackageJson": false
+        },
+        "@react-native-async-storage/async-storage": {
+          "version": "~1.19.3",
+          "alwaysAddToPackageJson": false
+        },
+        "react-native-safe-area-context": {
+          "version": "~4.7.2",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/react-native/src/generators/init/init.spec.ts

@@ -18,7 +18,6 @@ describe('init', () => {
     expect(packageJson.dependencies['react-native']).toBeDefined();
     expect(packageJson.devDependencies['@types/node']).toBeDefined();
     expect(packageJson.devDependencies['@types/react']).toBeDefined();
-    expect(packageJson.devDependencies['@types/react-native']).toBeDefined();
   });
 
   it('should add .gitignore entries for React native files and directories', async () => {

packages/react-native/src/generators/init/init.ts

@@ -36,7 +36,6 @@ import {
   testingLibraryJestNativeVersion,
   testingLibraryReactNativeVersion,
   typesNodeVersion,
-  typesReactNativeVersion,
   typesReactVersion,
 } from '../../utils/versions';
 
@@ -93,7 +92,6 @@ export function updateDependencies(host: Tree) {
       '@nx/react-native': nxVersion,
       '@types/node': typesNodeVersion,
       '@types/react': typesReactVersion,
-      '@types/react-native': typesReactNativeVersion,
       '@react-native/metro-config': reactNativeMetroConfigVersion,
       '@react-native-community/cli': reactNativeCommunityCli,
       '@react-native-community/cli-platform-android':

packages/react-native/src/migrations/update-16-6-0/add-depends-on.ts

@@ -14,24 +14,62 @@ export default async function update(tree: Tree) {
         'sync-deps',
         'pod-install',
       ];
+      if (
+        config.targets?.['run-ios']?.executor === '@nx/react-native:run-ios'
+      ) {
         config.targets['run-ios'].dependsOn = [
           'ensure-symlink',
           'sync-deps',
           'pod-install',
         ];
+      }
+      if (
+        config.targets?.['bundle-ios']?.executor === '@nx/react-native:bundle'
+      ) {
         config.targets['bundle-ios'].dependsOn = ['ensure-symlink'];
-      config.targets['run-android'].dependsOn = ['ensure-symlink', 'sync-deps'];
+      }
+      if (
+        config.targets?.['run-android']?.executor ===
+        '@nx/react-native:run-android'
+      ) {
+        config.targets['run-android'].dependsOn ??= [
+          'ensure-symlink',
+          'sync-deps',
+        ];
+      }
+      if (
+        config.targets?.['build-android']?.executor ===
+        '@nx/react-native:build-android'
+      ) {
         config.targets['build-android'].dependsOn = [
           'ensure-symlink',
           'sync-deps',
         ];
-      config.targets['build-ios'].dependsOn = [
+      }
+      if (
+        config.targets?.['build-ios']?.executor === '@nx/react-native:build-ios'
+      ) {
+        config.targets['build-ios'].dependsOn ??= [
           'ensure-symlink',
           'sync-deps',
           'pod-install',
         ];
-      config.targets['pod-install'].dependsOn = ['ensure-symlink', 'sync-deps'];
+      }
-      config.targets['bundle-android'].dependsOn = ['ensure-symlink'];
+      if (
+        config.targets?.['pod-instal']?.executor ===
+        '@nx/react-native:pod-install'
+      ) {
+        config.targets['pod-install'].dependsOn ??= [
+          'ensure-symlink',
+          'sync-deps',
+        ];
+      }
+      if (
+        config.targets?.['bundle-android']?.executor ===
+        '@nx/react-native:bundle'
+      ) {
+        config.targets['bundle-android'].dependsOn ??= ['ensure-symlink'];
+      }
 
       updateProjectConfiguration(tree, name, config);
     }

packages/react-native/src/migrations/update-16-9-0/remove-types-react-native.ts

@@ -0,0 +1,22 @@
+import { readJson, Tree, updateJson } from '@nx/devkit';
+
+/**
+ * Remove @types/react-native package since it is no longer required. It would be a part of react native package.
+ * @param tree
+ * @returns
+ */
+export default async function update(tree: Tree) {
+  const packageJson = readJson(tree, 'package.json');
+
+  if (
+    !packageJson.devDependencies['@types/react-native'] ||
+    !packageJson.dependencies['react-native']
+  ) {
+    return;
+  }
+
+  updateJson(tree, 'package.json', (packageJson) => {
+    delete packageJson.devDependencies['@types/react-native'];
+    return packageJson;
+  });
+}

packages/react-native/src/utils/versions.ts

@@ -1,24 +1,23 @@
 export const nxVersion = require('../../package.json').version;
 
-export const reactNativeVersion = '0.72.3';
+export const reactNativeVersion = '0.72.4';
-export const typesReactNativeVersion = '0.72.2';
 
 export const typesNodeVersion = '18.14.4';
 
 export const metroVersion = '0.76.7';
-export const reactNativeMetroConfigVersion = '^0.72.9';
+export const reactNativeMetroConfigVersion = '^0.72.11';
 
-export const reactNativeCommunityCli = '11.3.5';
+export const reactNativeCommunityCli = '11.3.6';
-export const reactNativeCommunityCliIos = '11.3.5';
+export const reactNativeCommunityCliIos = '11.3.6';
-export const reactNativeCommunityCliAndroid = '11.3.5';
+export const reactNativeCommunityCliAndroid = '11.3.6';
 
 export const reactVersion = '18.2.0';
 export const reactDomVersion = '18.2.0';
 export const reactTestRendererVersion = '18.2.0';
 export const typesReactVersion = '18.0.28';
 
-export const testingLibraryReactNativeVersion = '12.1.2';
+export const testingLibraryReactNativeVersion = '~12.3.0';
-export const testingLibraryJestNativeVersion = '5.4.2';
+export const testingLibraryJestNativeVersion = '~5.4.3';
 
 export const jestReactNativeVersion = '18.0.0';
 
@@ -27,5 +26,5 @@ export const reactNativeSvgVersion = '13.9.0';
 
 export const babelRuntimeVersion = '7.22.6';
 
-export const reactNativeAsyncStorageVersion = '1.19.0';
+export const reactNativeAsyncStorageVersion = '~1.19.3';
-export const reactNativeSafeAreaContextVersion = '4.7.1';
+export const reactNativeSafeAreaContextVersion = '~4.7.2';