upgrade rn example app

.npmrc

@@ -1,3 +1,4 @@
 # TODO(dependencies): Remove this and properly deal with all peerDeps
 # https://github.com/FormidableLabs/victory/issues/2236
 strict-peer-dependencies=false
+auto-install-peers=true

demo/rn/App.tsx

@@ -2,13 +2,16 @@ import React from "react";
 import { LogBox } from "react-native";
 import { NavigationContainer } from "@react-navigation/native";
 import { RootNavigator } from "./src/screens/root-navigator";
+import { registerRootComponent } from "expo";
 
 LogBox.ignoreLogs(["Require cycle: ../../packages/victory"]);
 
-export default function App() {
+const App = () => {
   return (
     <NavigationContainer>
       <RootNavigator />
     </NavigationContainer>
   );
-}
+};
+
+registerRootComponent(App);

demo/rn/metro.config.js

@@ -1,68 +1,20 @@
+// https://docs.expo.dev/guides/monorepos/#modify-the-metro-config
+const { getDefaultConfig } = require("expo/metro-config");
 const path = require("path");
-const {getDefaultConfig} = require("expo/metro-config");
-const blacklist = require("metro-config/src/defaults/exclusionList");
-const escape = require("escape-string-regexp");
-const glob = require('glob');
-const fs = require('fs');
 
-/**
- * Metro does not support symlinks. When resolving dependencies, we need to make
- *  sure Metro is looking for dependencies _here_ and not in the package repos'
- *  node_modules folders (which will contain pnpm symlinks)
- *
- * We generate a list of all deps used in victory packages, and use that below.
- */
-const PKGS = path.resolve(__dirname, "../../packages")
-const VICTORY_DEPS = Array.from(
-  glob.sync(path.join(PKGS, "victory*/package.json"))
-    .map(p => JSON.parse(fs.readFileSync(p, 'utf8')))
-    .map(pkg => Object.keys(pkg.dependencies || {}))
-    .reduce((set, depNames) => {
-      depNames.forEach(name => set.add(name));
-      return set;
-    }, new Set())
-);
+// Find the project and workspace directories
+const projectRoot = __dirname;
+// Find the monorepo root
+const monorepoRoot = path.resolve(projectRoot, "../..");
 
-/**
- * Reference to root of monorepo
- */
-const root = path.resolve(__dirname, "../..");
+const config = getDefaultConfig(projectRoot);
 
-/**
- * We're going to extend default expo config
- */
-const defaultConfig = getDefaultConfig(__dirname);
+// 1. Watch all files within the monorepo
+config.watchFolders = [monorepoRoot];
+// 2. Let Metro know where to resolve packages and in what order
+config.resolver.nodeModulesPaths = [
+  path.resolve(projectRoot, "node_modules"),
+  path.resolve(monorepoRoot, "node_modules"),
+];
 
-/**
- * Along with our standard app directory, we're also going to watch the root!
- * This allows us to make changes to the victory packages and get live refresh here.
- */
-defaultConfig.watchFolders = [root];
-
-/**
- * Misc transform options.
- */
-defaultConfig.transformer.getTransformOptions = async () => ({
-  transform: {
-    experimentalImportSupport: false,
-    inlineRequires: true,
-  },
-});
-
-/**
- * Ensuring we only use one version of some shared deps, like React.
- * Using multiple versions of React causes errors.
- * We want to ignore root/package-level instances, and only use the local ones here.
- */
-const modules = ["react", "react-native-svg", ...VICTORY_DEPS];
-defaultConfig.resolver.blacklistRE = blacklist(
-  modules.map(
-    (m) => new RegExp(`^${escape(path.join(root, "node_modules", m))}\\/.*$`),
-  ),
-);
-defaultConfig.resolver.extraNodeModules = modules.reduce((acc, name) => {
-  acc[name] = path.join(__dirname, "node_modules", name);
-  return acc;
-}, {});
-
-module.exports = defaultConfig;
+module.exports = config;

demo/rn/package.json

@@ -2,67 +2,62 @@
   "name": "rn-demo",
   "version": "1.0.0",
   "sideEffects": false,
-  "main": "node_modules/expo/AppEntry.js",
+  "main": "App.tsx",
   "scripts": {
-    "start": "expo start",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
-    "web": "expo start --web",
+    "start": "expo start --reset-cache",
+    "android": "expo start --android --reset-cache",
+    "ios": "expo start --ios --reset-cache",
+    "web": "expo start --web --reset-cache",
     "eject": "expo eject"
   },
   "dependencies": {
-    "@react-navigation/native": "^6.0.10",
-    "@react-navigation/native-stack": "^6.6.2",
-    "expo": "~45.0.0",
-    "expo-status-bar": "~1.3.0",
+    "@react-navigation/native": "^6.1.17",
+    "@react-navigation/native-stack": "^6.9.26",
+    "expo": "~50.0.17",
+    "expo-status-bar": "~1.11.1",
     "lodash": "^4.17.21",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react-native": "0.68.2",
-    "react-native-gesture-handler": "~2.2.1",
-    "react-native-safe-area-context": "4.2.4",
-    "react-native-screens": "~3.11.1",
-    "react-native-svg": "12.3.0",
-    "react-native-web": "0.17.7",
-    "victory":  "link:../../packages/victory",
-    "victory-area": "link:../../packages/victory-area",
-    "victory-axis":  "link:../../packages/victory-axis",
-    "victory-bar": "link:../../packages/victory-bar",
-    "victory-box-plot":  "link:../../packages/victory-box-plot",
-    "victory-brush-container": "link:../../packages/victory-brush-container",
-    "victory-brush-line":  "link:../../packages/victory-brush-line",
-    "victory-candlestick": "link:../../packages/victory-candlestick",
-    "victory-canvas":  "link:../../packages/victory-canvas",
-    "victory-chart": "link:../../packages/victory-chart",
-    "victory-core":  "link:../../packages/victory-core",
-    "victory-create-container": "link:../../packages/victory-create-container",
-    "victory-cursor-container":  "link:../../packages/victory-cursor-container",
-    "victory-errorbar": "link:../../packages/victory-errorbar",
-    "victory-group":  "link:../../packages/victory-group",
-    "victory-histogram": "link:../../packages/victory-histogram",
-    "victory-legend":  "link:../../packages/victory-legend",
-    "victory-line": "link:../../packages/victory-line",
-    "victory-native": "link:../../packages/victory-native",
-    "victory-pie": "link:../../packages/victory-pie",
-    "victory-polar-axis":  "link:../../packages/victory-polar-axis",
-    "victory-scatter": "link:../../packages/victory-scatter",
-    "victory-selection-container":  "link:../../packages/victory-selection-container",
-    "victory-shared-events": "link:../../packages/victory-shared-events",
-    "victory-stack":  "link:../../packages/victory-stack",
-    "victory-tooltip": "link:../../packages/victory-tooltip",
-    "victory-vendor":  "link:../../packages/victory-vendor",
-    "victory-voronoi": "link:../../packages/victory-voronoi",
-    "victory-voronoi-container":  "link:../../packages/victory-voronoi-container",
-    "victory-zoom-container": "link:../../packages/victory-zoom-container"
-
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-native": "0.73.5",
+    "react-native-gesture-handler": "~2.16.0",
+    "react-native-safe-area-context": "4.10.1",
+    "react-native-screens": "~3.31.1",
+    "react-native-svg": "14.1.0",
+    "victory": "workspace:*",
+    "victory-area": "workspace:*",
+    "victory-axis": "workspace:*",
+    "victory-bar": "workspace:*",
+    "victory-box-plot": "workspace:*",
+    "victory-brush-container": "workspace:*",
+    "victory-brush-line": "workspace:*",
+    "victory-candlestick": "workspace:*",
+    "victory-chart": "workspace:*",
+    "victory-core": "workspace:*",
+    "victory-create-container": "workspace:*",
+    "victory-cursor-container": "workspace:*",
+    "victory-errorbar": "workspace:*",
+    "victory-group": "workspace:*",
+    "victory-histogram": "workspace:*",
+    "victory-legend": "workspace:*",
+    "victory-line": "workspace:*",
+    "victory-pie": "workspace:*",
+    "victory-polar-axis": "workspace:*",
+    "victory-scatter": "workspace:*",
+    "victory-selection-container": "workspace:*",
+    "victory-shared-events": "workspace:*",
+    "victory-stack": "workspace:*",
+    "victory-tooltip": "workspace:*",
+    "victory-voronoi": "workspace:*",
+    "victory-voronoi-container": "workspace:*",
+    "victory-zoom-container": "workspace:*",
+    "victory-native": "workspace:*"
   },
   "devDependencies": {
-    "@babel/core": "^7.12.9",
+    "@babel/core": "^7.20.0",
+    "@babel/runtime": "^7.22.15",
     "@types/lodash": "^4.14.182",
-    "@types/react": "~17.0.21",
-    "@types/react-native": "~0.66.13",
     "glob": "^8.0.3",
-    "typescript": "~4.3.5"
+    "typescript": "~5.3.3"
   },
   "private": true
 }