chore: split example apps (#2734)

Author: tido64

.github/actions/setup-react-native/action.yml

@@ -14,8 +14,6 @@ runs:
     - name: Set up react-native@${{ inputs.version }}
       run: |
         rm example/ios/Podfile.lock
-        rm example/macos/Podfile.lock
-        rm example/visionos/Podfile.lock
         node --run set-react-version -- ${{ inputs.version }}
       shell: bash
       working-directory: packages/app

.github/workflows/build.yml

@@ -58,6 +58,9 @@ jobs:
           yarn dedupe --check
       - name: Install npm dependencies
         uses: ./.github/actions/yarn
+      - name: Lint dependencies
+        run: |
+          yarn rnx-align-deps
       - name: Lint lockfile
         run: |
           yarn lint-lockfile
@@ -358,7 +361,7 @@ jobs:
         uses: ./.github/actions/setup-toolchain
         with:
           platform: macos
-          project-root: packages/app/example
+          project-root: packages/example-macos
           cache-key-prefix: example
           xcode-developer-dir: /Applications/Xcode_16.4.app/Contents/Developer
       - name: Set up react-native@canary
@@ -373,7 +376,7 @@ jobs:
       - name: Bundle JavaScript
         run: |
           yarn build:macos
-        working-directory: packages/app/example
+        working-directory: packages/example-macos
       - name: Determine whether the macOS app needs to be built
         id: affected
         uses: ./.github/actions/affected
@@ -382,22 +385,22 @@ jobs:
         uses: ./.github/actions/cocoapods
         with:
           project-directory: macos
-          working-directory: packages/app/example
+          working-directory: packages/example-macos
       - name: Build
         if: ${{ steps.affected.outputs.macos != '' }}
         run: |
-          ../../../scripts/xcodebuild.sh macos/Example.xcworkspace build-for-testing
-        working-directory: packages/app/example
+          ../../scripts/xcodebuild.sh macos/Example.xcworkspace build-for-testing
+        working-directory: packages/example-macos
       - name: Test `react-native config`
         if: ${{ steps.affected.outputs.macos != '' }}
         run: |
           node --test test/config.test.mjs
-        working-directory: packages/app/example
+        working-directory: packages/example-macos
       - name: Test
         if: ${{ steps.affected.outputs.macos != '' && github.event_name != 'schedule' }}
         run: |
-          ../../../scripts/xcodebuild.sh macos/Example.xcworkspace test-without-building
-        working-directory: packages/app/example
+          ../../scripts/xcodebuild.sh macos/Example.xcworkspace test-without-building
+        working-directory: packages/example-macos
     timeout-minutes: 60
   macos-template:
     name: "macOS [template]"
@@ -571,14 +574,15 @@ jobs:
       - name: Bundle JavaScript
         run: |
           yarn build:windows
+        working-directory: packages/example-windows
       - name: Generate Visual Studio solution
         run: |
-          node ../windows/app.mjs --msbuildprops WindowsTargetPlatformVersion=$env:WindowsTargetPlatformVersion
-        working-directory: packages/app/example
+          node ../app/windows/app.mjs --msbuildprops WindowsTargetPlatformVersion=$env:WindowsTargetPlatformVersion
+        working-directory: packages/example-windows
       - name: Test `react-native config`
         run: |
           node --test test/config.test.mjs
-        working-directory: packages/app/example
+        working-directory: packages/example-windows
       - name: Determine whether the Windows app needs to be built
         id: affected
         uses: ./.github/actions/affected
@@ -591,7 +595,7 @@ jobs:
           } else {
             yarn ci:windows --arch ${{ matrix.platform }}
           }
-        working-directory: packages/app/example
+        working-directory: packages/example-windows
         continue-on-error: true
       # GitHub Actions currently does not support outputs from jobs with matrices
       # The workaround is to upload artifacts to communicate between jobs
@@ -617,15 +621,15 @@ jobs:
         uses: actions/upload-artifact@v7
         with:
           name: windows-msbuild.binlog
-          path: packages/app/example/windows/*.binlog
+          path: packages/example-windows/windows/*.binlog
           retention-days: 14
           overwrite: true
       - name: Test
         if: ${{ steps.affected.outputs.windows != '' && matrix.platform == 'x64' && steps.build.outcome == 'success' }}
         run: |
-          ../../../scripts/build/MSBuild.ps1 -Configuration ${{ matrix.configuration }} -Platform ${{ matrix.platform }} -Target Build ReactAppTests.vcxproj
-          ../../../scripts/build/VSTest.ps1 ${{ matrix.platform }}\${{ matrix.configuration }}\ReactAppTests.dll
-        working-directory: packages/app/example/windows/ReactAppTests
+          ../../../app/scripts/build/MSBuild.ps1 -Configuration ${{ matrix.configuration }} -Platform ${{ matrix.platform }} -Target Build ReactAppTests.vcxproj
+          ../../../app/scripts/build/VSTest.ps1 ${{ matrix.platform }}\${{ matrix.configuration }}\ReactAppTests.dll
+        working-directory: packages/example-windows/windows/ReactAppTests
     timeout-minutes: 60
   windows-template:
     name: "Windows [template]"

.gitignore

@@ -1,3 +1,4 @@
+*.binlog
 *.iml
 *.log
 *.tgz
@@ -17,18 +18,19 @@
 !.yarn/patches/
 !.yarn/plugins/
 !.yarn/releases/
-Pods/
 clang-format-diff.py
 coverage/
 local.properties
-msbuild.binlog
 node_modules/
 !test/__fixtures__/**/node_modules/
 package-lock.json
-packages/app/android/**/build/
-packages/app/example/*/DerivedData/
-packages/app/example/*/build/
 packages/app/example/Screenshot-*.png
+packages/example-*/*/.xcode.env
+packages/example-*/*/DerivedData/
+packages/example-*/*/Pods/
+packages/example-*/*/build/
+packages/example-*/dist/*
+!packages/example-*/dist/.gitignore
 report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 template-example/
 xcuserdata/

.yarnrc.yml

@@ -1,3 +1,10 @@
+catalog:
+  "@babel/core": ^7.25.2
+  "@babel/preset-env": ^7.25.3
+  "@rnx-kit/cli": ^1.0.0
+  "@rnx-kit/metro-config": ^2.2.3
+  "@rnx-kit/polyfills": ^0.2.0
+  "@rnx-kit/tsconfig": ^3.0.1
 compressionLevel: 0
 enableGlobalCache: false
 enableScripts: false

package.json

@@ -15,7 +15,8 @@
   "workspaces": [
     ".",
     "packages/app",
-    "packages/app/example"
+    "packages/app/example",
+    "packages/example-*"
   ],
   "scripts": {
     "format": "nx run-many --target format:c,format:js,format:swift",
@@ -24,10 +25,12 @@
     "lint:commit": "git log --format='%s' origin/trunk..HEAD | tail -1 | npx @rnx-kit/commitlint-lite@2.0.0",
     "lint:js": "oxlint $(git ls-files 'scripts/*.[cm][jt]s' 'scripts/*.[jt]s')",
     "release-notes": "node scripts/release-notes.mts",
+    "rnx-align-deps": "rnx-align-deps --exclude-packages @microsoft/root,react-native-test-app",
     "show-affected": "node scripts/affected.mts"
   },
   "devDependencies": {
     "@nx/js": "^22.0.0",
+    "@rnx-kit/align-deps": "^3.4.5",
     "@rnx-kit/lint-lockfile": "^0.1.0",
     "@rnx-kit/oxlint-config": "^1.0.3",
     "@swc-node/register": "^1.11.1",

packages/app/example/.gitignore

@@ -8,11 +8,17 @@
 .gradle/
 .idea/
 .vs/
+.watchman-*
 .xcode.env
-Pods/
-build/
+android/app/
+android/build/
 dist/*
 !dist/.gitignore
+ios/DerivedData/
+ios/Pods/
+ios/build/
 local.properties
-msbuild.binlog
+macos/DerivedData/
+macos/Pods/
+macos/build/
 node_modules/

packages/app/example/package.json

@@ -20,10 +20,10 @@
   },
   "dependencies": {
     "@react-native-webapis/web-storage": "^0.4.5",
-    "react": "19.1.0",
-    "react-native": "^0.81.0",
-    "react-native-macos": "^0.81.1",
-    "react-native-safe-area-context": "^5.5.2",
+    "react": "19.1.4",
+    "react-native": "^0.81.6",
+    "react-native-macos": "^0.81.0",
+    "react-native-safe-area-context": "^5.6.0",
     "react-native-windows": "^0.81.0"
   },
   "devDependencies": {
@@ -85,38 +85,17 @@
         }
       }
     ],
-    "alignDeps//disabled": {
-      "//": "This configuration is only used for Viewfinder",
+    "alignDeps": {
       "requirements": [
-        "react-native@0.79"
+        "react-native@0.81"
       ],
       "capabilities": [
         "core-android",
         "core-ios",
         "core-macos",
         "core-windows",
-        "animation",
         "babel-preset-react-native",
-        "checkbox",
-        "clipboard",
-        "datetime-picker",
-        "filesystem",
-        "floating-action",
-        "gestures",
-        "html",
-        "masked-view",
-        "modal",
-        "navigation/native",
-        "navigation/stack",
-        "netinfo",
-        "popover",
-        "safe-area",
-        "screens",
-        "shimmer",
-        "sqlite",
-        "storage",
-        "svg",
-        "webview"
+        "safe-area"
       ]
     }
   }

packages/app/example/test/config.test.mjs

@@ -5,17 +5,23 @@ import * as path from "node:path";
 import { after, before, test } from "node:test";
 import { URL, fileURLToPath } from "node:url";
 
-async function getLoadConfig() {
+/**
+ * @param {string} cwd
+ */
+async function getLoadConfig(cwd) {
   try {
-    // @ts-expect-error `loadConfig` was not exported until 7.0.
-    return await import("@react-native-community/cli/build/tools/config");
+    const config = import.meta.resolve(
+      "@react-native-community/cli/build/tools/config",
+      cwd
+    );
+    return await import(config);
   } catch (_) {
     // `loadConfig` was made public in 7.0:
     // https://github.com/react-native-community/cli/pull/1464
-    const { default: cli } = await import("@react-native-community/cli");
+    const rncCli = import.meta.resolve("@react-native-community/cli", cwd);
+    const { default: cli } = await import(rncCli);
     return cli.loadConfig.length === 1
-      ? // @ts-ignore The signature change of `loadConfig` was introduced in 14.0
-        () => cli.loadConfig({}) // >=14.0
+      ? () => cli.loadConfig({}) // >=14.0
       : cli.loadConfig; // <14.0
   }
 }
@@ -29,9 +35,9 @@ function regexp(p) {
 }
 
 test("react-native config", async (t) => {
-  const loadConfig = await getLoadConfig();
-
   const currentDir = process.cwd();
+  const loadConfig = await getLoadConfig(currentDir);
+
   const projectRoot = path.sep + path.join("packages", "app");
   const exampleRoot = path.join(projectRoot, "example");
   const reactNativePath = path.join(
@@ -90,6 +96,32 @@ test("react-native config", async (t) => {
     }
   );
 
+  await t.test(
+    "contains macOS config",
+    { skip: process.platform === "win32" },
+    () => {
+      const sourceDir = path.join(exampleRoot, "macos");
+      const config = loadConfig();
+
+      equal(typeof config, "object");
+      match(config.root, regexp(exampleRoot));
+      match(config.reactNativePath, regexp(reactNativePath));
+      equal(
+        config.dependencies["react-native-test-app"].name,
+        "react-native-test-app"
+      );
+      notEqual(config.platforms.macos, undefined);
+      match(config.project.macos.sourceDir, regexp(sourceDir));
+
+      if (fs.existsSync("macos/Pods")) {
+        equal(config.project.macos.xcodeProject.name, "Example.xcworkspace");
+        ok(config.project.macos.xcodeProject.isWorkspace);
+      } else {
+        equal(config.project.macos.xcodeProject, null);
+      }
+    }
+  );
+
   await t.test(
     "contains Windows config",
     { skip: process.platform !== "win32" },

packages/app/package.json

@@ -116,9 +116,9 @@
     "minimatch": "^10.0.0",
     "oxfmt": "^0.41.0",
     "oxlint": "^1.51.0",
-    "react": "19.1.0",
-    "react-native": "^0.81.0",
-    "react-native-macos": "^0.81.1",
+    "react": "19.1.4",
+    "react-native": "^0.81.6",
+    "react-native-macos": "^0.81.0",
     "react-native-windows": "^0.81.0",
     "suggestion-bot": "^4.0.0"
   },

packages/example-macos/.watchmanconfig

@@ -0,0 +1 @@
+{}