From f5e9a6d812cb1b0ef47ee4bd102a5e5ad4d5df02 Mon Sep 17 00:00:00 2001 From: Johannes Klein Date: Mon, 1 Sep 2025 22:46:03 +0200 Subject: [PATCH] Migrate to react-native-vector-icons 12.x (#3091) * Update package.json * Update package-lock.json * Update Podfile * Update build.gradle * Update Podfile.lock * Update INatIcon.ts --- android/app/build.gradle | 7 - ios/Podfile | 2 - ios/Podfile.lock | 27 +-- package-lock.json | 180 ++++++++++++++++-- package.json | 3 +- .../SharedComponents/INatIcon/INatIcon.ts | 2 +- 6 files changed, 162 insertions(+), 59 deletions(-) diff --git a/android/app/build.gradle b/android/app/build.gradle index fc776577a..4973c07b4 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -14,13 +14,6 @@ apply plugin: "com.facebook.react" apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle" -// add vector icons to project -project.ext.vectoricons = [ - iconFontNames: [] -] - -apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" - /** * This is the configuration block to customize your React Native Android app. * By default you don't need to apply any configuration, just uncomment the lines you need. diff --git a/ios/Podfile b/ios/Podfile index d8699f73a..0ac91a284 100644 --- a/ios/Podfile +++ b/ios/Podfile @@ -63,8 +63,6 @@ target "iNaturalistReactNative" do pod "react-native-config", path: "../node_modules/react-native-config" - pod "RNVectorIcons", path: "../node_modules/react-native-vector-icons" - envfiles = { "Debug" => "$(PODS_ROOT)/../../.env.staging", "Release" => "$(PODS_ROOT)/../../.env" diff --git a/ios/Podfile.lock b/ios/Podfile.lock index dd0fa826e..393604871 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1929,27 +1929,6 @@ PODS: - React-Core - RNSVG (15.12.0): - React-Core - - RNVectorIcons (10.2.0): - - DoubleConversion - - glog - - hermes-engine - - RCT-Folly (= 2024.11.18.00) - - RCTRequired - - RCTTypeSafety - - React-Core - - React-debug - - React-Fabric - - React-featureflags - - React-graphics - - React-ImageManager - - React-NativeModulesApple - - React-RCTFabric - - React-rendererdebug - - React-utils - - ReactCodegen - - ReactCommon/turbomodule/bridging - - ReactCommon/turbomodule/core - - Yoga - SocketRocket (0.7.1) - VisionCamera (4.7.0): - VisionCamera/Core (= 4.7.0) @@ -2078,7 +2057,6 @@ DEPENDENCIES: - RNShareMenu (from `../node_modules/react-native-share-menu`) - RNStoreReview (from `../node_modules/react-native-store-review`) - RNSVG (from `../node_modules/react-native-svg`) - - RNVectorIcons (from `../node_modules/react-native-vector-icons`) - VisionCamera (from `../node_modules/react-native-vision-camera`) - VisionCameraPluginInatVision (from `../node_modules/vision-camera-plugin-inatvision`) - Yoga (from `../node_modules/react-native/ReactCommon/yoga`) @@ -2312,8 +2290,6 @@ EXTERNAL SOURCES: :path: "../node_modules/react-native-store-review" RNSVG: :path: "../node_modules/react-native-svg" - RNVectorIcons: - :path: "../node_modules/react-native-vector-icons" VisionCamera: :path: "../node_modules/react-native-vision-camera" VisionCameraPluginInatVision: @@ -2437,12 +2413,11 @@ SPEC CHECKSUMS: RNShareMenu: e1cdfa3b9af89416afc75a80377cfd0de4f30ded RNStoreReview: 613c43e9132998ed41a65946e20c223c91b36464 RNSVG: ae1766b2492f8915a1ee25095871f00a4f132093 - RNVectorIcons: f7a99433a71f4b38891c14c64b21fc521d064392 SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748 VisionCamera: 1470a7fa013e22de7481640a4d9c597ad6f13919 VisionCameraPluginInatVision: ad9a001b70676d2f9b0ea22f60c04d5fed3d3a52 Yoga: eca8dd841b7cd47d82d66be58af8e3aeb819012f -PODFILE CHECKSUM: 3877bea0ea18a99bd3e08a1a6dc6ff4eb7c6dd77 +PODFILE CHECKSUM: 5c7a85b8fc0a51e972a87e39194f661a51e0d872 COCOAPODS: 1.15.2 diff --git a/package-lock.json b/package-lock.json index bc48b9fc4..ed914ea84 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,6 +24,7 @@ "@react-native-community/slider": "^4.5.0", "@react-native-google-signin/google-signin": "^13.1.0", "@react-native-picker/picker": "^2.11.1", + "@react-native-vector-icons/common": "^12.3.0", "@react-navigation/bottom-tabs": "^7.4.6", "@react-navigation/drawer": "^7.5.7", "@react-navigation/elements": "^2.6.3", @@ -93,7 +94,6 @@ "react-native-svg": "^15.12.0", "react-native-svg-transformer": "^1.3.0", "react-native-url-polyfill": "^2.0.0", - "react-native-vector-icons": "^10.2.0", "react-native-vision-camera": "^4.7.0", "react-native-volume-manager": "^1.10.0", "react-native-webview": "^13.15.0", @@ -127,7 +127,6 @@ "@types/markdown-it": "^14.1.2", "@types/react": "^19.0.0", "@types/react-dom": "^19.0.0", - "@types/react-native-vector-icons": "^6.4.18", "@types/react-test-renderer": "^19.0.0", "@types/sanitize-html": "^2.13.0", "@typescript-eslint/eslint-plugin": "^8.32.1", @@ -4597,6 +4596,116 @@ "react-native": "*" } }, + "node_modules/@react-native-vector-icons/common": { + "version": "12.3.0", + "resolved": "https://registry.npmjs.org/@react-native-vector-icons/common/-/common-12.3.0.tgz", + "integrity": "sha512-5GMBcLBkA0MuciweYcrSyvi9fYGanfVnE2J+pwHx1QiaVgTaoCm4rylJgSS77MVI5qUiGh7aJpqq5afSz2U4bw==", + "license": "MIT", + "dependencies": { + "find-up": "^7.0.0", + "picocolors": "^1.1.1", + "plist": "^3.1.0" + }, + "bin": { + "rnvi-update-plist": "lib/commonjs/scripts/updatePlist.js" + }, + "engines": { + "node": ">= 18.0.0" + }, + "peerDependencies": { + "@react-native-vector-icons/get-image": "^12.2.0", + "react": "*", + "react-native": "*" + }, + "peerDependenciesMeta": { + "@react-native-vector-icons/get-image": { + "optional": true + } + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/find-up": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-7.0.0.tgz", + "integrity": "sha512-YyZM99iHrqLKjmt4LJDj58KI+fYyufRLBSYcqycxf//KpBk9FoewoGX0450m9nB44qrZnovzC2oeP5hUibxc/g==", + "license": "MIT", + "dependencies": { + "locate-path": "^7.2.0", + "path-exists": "^5.0.0", + "unicorn-magic": "^0.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/locate-path": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-7.2.0.tgz", + "integrity": "sha512-gvVijfZvn7R+2qyPX8mAuKcFGDf6Nc61GdvGafQsHL0sBIxfKzA+usWn4GFC/bk+QdwPUD4kWFJLhElipq+0VA==", + "license": "MIT", + "dependencies": { + "p-locate": "^6.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/p-limit": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-4.0.0.tgz", + "integrity": "sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==", + "license": "MIT", + "dependencies": { + "yocto-queue": "^1.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/p-locate": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-6.0.0.tgz", + "integrity": "sha512-wPrq66Llhl7/4AGC6I+cqxT07LhXvWL08LNXz1fENOw0Ap4sRZZ/gZpTTJ5jpurzzzfS2W/Ge9BY3LgLjCShcw==", + "license": "MIT", + "dependencies": { + "p-limit": "^4.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/path-exists": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-5.0.0.tgz", + "integrity": "sha512-RjhtfwJOxzcFmNOi6ltcbcu4Iu+FL3zEj83dk4kAS+fVpTxXLO1b38RvJgT/0QwvV/L3aY9TAnyv0EOqW4GoMQ==", + "license": "MIT", + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + } + }, + "node_modules/@react-native-vector-icons/common/node_modules/yocto-queue": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.2.1.tgz", + "integrity": "sha512-AyeEbWOu/TAXdxlV9wmGcR0+yh2j3vYPGOECcIj2S7MkrLyC7ne+oye2BKTItt0ii2PHk4cDy+95+LshzbXnGg==", + "license": "MIT", + "engines": { + "node": ">=12.20" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@react-native/assets-registry": { "version": "0.78.3", "resolved": "https://registry.npmjs.org/@react-native/assets-registry/-/assets-registry-0.78.3.tgz", @@ -6472,25 +6581,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-native-vector-icons": { - "version": "6.4.18", - "resolved": "https://registry.npmjs.org/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.18.tgz", - "integrity": "sha512-YGlNWb+k5laTBHd7+uZowB9DpIK3SXUneZqAiKQaj1jnJCZM0x71GDim5JCTMi4IFkhc9m8H/Gm28T5BjyivUw==", - "dev": true, - "dependencies": { - "@types/react": "*", - "@types/react-native": "^0.70" - } - }, - "node_modules/@types/react-native-vector-icons/node_modules/@types/react-native": { - "version": "0.70.19", - "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.70.19.tgz", - "integrity": "sha512-c6WbyCgWTBgKKMESj/8b4w+zWcZSsCforson7UdXtXMecG3MxCinYi6ihhrHVPyUrVzORsvEzK8zg32z4pK6Sg==", - "dev": true, - "dependencies": { - "@types/react": "*" - } - }, "node_modules/@types/react-test-renderer": { "version": "19.1.0", "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-19.1.0.tgz", @@ -7465,6 +7555,15 @@ "expect": "29.x.x || 28.x.x || ^27.2.5" } }, + "node_modules/@xmldom/xmldom": { + "version": "0.8.11", + "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.11.tgz", + "integrity": "sha512-cQzWCtO6C8TQiYl1ruKNn2U6Ao4o4WBBcbL61yJl84x+j5sOWWFU9X7DpND8XZG3daDppSsigMdfAIl2upQBRw==", + "license": "MIT", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/@yarnpkg/lockfile": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz", @@ -17523,6 +17622,20 @@ "node": ">=6" } }, + "node_modules/plist": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/plist/-/plist-3.1.0.tgz", + "integrity": "sha512-uysumyrvkUX0rX/dEVqt8gC3sTBzd4zoWfLeS29nb53imdaXVvLINYXTI2GNqzaMuvacNx4uJQ8+b3zXR0pkgQ==", + "license": "MIT", + "dependencies": { + "@xmldom/xmldom": "^0.8.8", + "base64-js": "^1.5.1", + "xmlbuilder": "^15.1.1" + }, + "engines": { + "node": ">=10.4.0" + } + }, "node_modules/pngjs": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-7.0.0.tgz", @@ -18706,6 +18819,7 @@ "version": "10.2.0", "resolved": "https://registry.npmjs.org/react-native-vector-icons/-/react-native-vector-icons-10.2.0.tgz", "integrity": "sha512-n5HGcxUuVaTf9QJPs/W22xQpC2Z9u0nb0KgLPnVltP8vdUvOp6+R26gF55kilP/fV4eL4vsAHUqUjewppJMBOQ==", + "peer": true, "dependencies": { "prop-types": "^15.7.2", "yargs": "^16.1.1" @@ -18721,6 +18835,7 @@ "version": "7.0.4", "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz", "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==", + "peer": true, "dependencies": { "string-width": "^4.2.0", "strip-ansi": "^6.0.0", @@ -18731,6 +18846,7 @@ "version": "16.2.0", "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz", "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==", + "peer": true, "dependencies": { "cliui": "^7.0.2", "escalade": "^3.1.1", @@ -18748,6 +18864,7 @@ "version": "20.2.9", "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz", "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==", + "peer": true, "engines": { "node": ">=10" } @@ -21130,6 +21247,18 @@ "node": ">=4" } }, + "node_modules/unicorn-magic": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz", + "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==", + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/universalify": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz", @@ -21641,6 +21770,15 @@ } } }, + "node_modules/xmlbuilder": { + "version": "15.1.1", + "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-15.1.1.tgz", + "integrity": "sha512-yMqGBqtXyeN1e3TGYvgNgDVZ3j84W4cwkOXQswghol6APgZWaff9lnbvN7MHYJOiXsvGPXtjTYJEiC9J2wv9Eg==", + "license": "MIT", + "engines": { + "node": ">=8.0" + } + }, "node_modules/xtend": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz", diff --git a/package.json b/package.json index f56de6b34..ad60a5943 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "@react-native-community/slider": "^4.5.0", "@react-native-google-signin/google-signin": "^13.1.0", "@react-native-picker/picker": "^2.11.1", + "@react-native-vector-icons/common": "^12.3.0", "@react-navigation/bottom-tabs": "^7.4.6", "@react-navigation/drawer": "^7.5.7", "@react-navigation/elements": "^2.6.3", @@ -127,7 +128,6 @@ "react-native-svg": "^15.12.0", "react-native-svg-transformer": "^1.3.0", "react-native-url-polyfill": "^2.0.0", - "react-native-vector-icons": "^10.2.0", "react-native-vision-camera": "^4.7.0", "react-native-volume-manager": "^1.10.0", "react-native-webview": "^13.15.0", @@ -161,7 +161,6 @@ "@types/markdown-it": "^14.1.2", "@types/react": "^19.0.0", "@types/react-dom": "^19.0.0", - "@types/react-native-vector-icons": "^6.4.18", "@types/react-test-renderer": "^19.0.0", "@types/sanitize-html": "^2.13.0", "@typescript-eslint/eslint-plugin": "^8.32.1", diff --git a/src/components/SharedComponents/INatIcon/INatIcon.ts b/src/components/SharedComponents/INatIcon/INatIcon.ts index 8b7d88af6..3daa3fbcf 100644 --- a/src/components/SharedComponents/INatIcon/INatIcon.ts +++ b/src/components/SharedComponents/INatIcon/INatIcon.ts @@ -1,4 +1,4 @@ -import { createIconSet } from "react-native-vector-icons"; +import { createIconSet } from "@react-native-vector-icons/common"; import glyphmap from "./glyphmap.json";