[Shims] Properly shim React

pnpm-lock.yaml

@@ -6,6 +6,7 @@ specifiers:
   '@types/react-native': ^0.70.5
   esbuild: ^0.15.11
   esbuild-plugin-alias: ^0.2.1
+  esbuild-plugin-external-global: ^1.0.1
   redux: ^4.2.0
   spitroast: ^1.4.2
   typescript: ^4.8.4
@@ -20,6 +21,7 @@ devDependencies:
   '@types/react-native': 0.70.5
   esbuild: 0.15.11
   esbuild-plugin-alias: 0.2.1
+  esbuild-plugin-external-global: 1.0.1
   redux: 4.2.0
   typescript: 4.8.4
   zustand: 4.1.2
@@ -236,6 +238,10 @@ packages:
     resolution: {integrity: sha512-jyfL/pwPqaFXyKnj8lP8iLk6Z0m099uXR45aSN8Av1XD4vhvQutxxPzgA2bTcAwQpa1zCXDcWOlhFgyP3GKqhQ==}
     dev: true
 
+  /esbuild-plugin-external-global/1.0.1:
+    resolution: {integrity: sha512-NDzYHRoShpvLqNcrgV8ZQh61sMIFAry5KLTQV83BPG5iTXCCu7h72SCfJ97bW0GqtuqDD/1aqLbKinI/rNgUsg==}
+    dev: true
+
   /esbuild-sunos-64/0.15.11:
     resolution: {integrity: sha512-EuBdTGlsMTjEl1sQnBX2jfygy7iR6CKfvOzi+gEOfhDqbHXsmY1dcpbVtcwHAg9/2yUZSfMJHMAgf1z8M4yyyw==}
     engines: {node: '>=12'}

src/lib/metro/filters.ts

@@ -2,7 +2,6 @@ import { MetroModules, PropsFinder, PropsFinderAll } from "@types";
 
 // Metro require
 declare const __r: (moduleId: number) => any;
-let moment: any;
 
 // Function to blacklist a module, preventing it from being searched again
 function blacklist(id: number) {
@@ -14,19 +13,23 @@ function blacklist(id: number) {
     })
 }
 
-// Blacklist any "bad-actor" modules
+// Blacklist any "bad-actor" modules, e.g. the dreaded null proxy, the window itself, or undefined modules
 for (const key in window.modules) {
     const id = Number(key);
     const module = window.modules[id].publicModule.exports;
 
-    if (!moment && module && module.isMoment) moment = module;
-
     if (!module || module === window || module["proxygone"] === null) {
         blacklist(id);
         continue;
     }
 }
 
+// Hoist React
+window.React = Object.values(window.modules).find(m => m.publicModule.exports.createElement).publicModule.exports;
+
+// Find moment
+let moment = Object.values(window.modules).find(m => m.publicModule.exports.isMoment).publicModule.exports;
+
 // Function to filter through modules
 export const filterModules = (modules: MetroModules, single = false) => (filter: (m: any) => boolean) => {
     const found = [];

src/ui/settings/components/AssetDisplay.tsx

@@ -1,5 +1,5 @@
 import { Asset } from "@types";
-import { React, ReactNative as RN } from "@metro/common";
+import { ReactNative as RN } from "@metro/common";
 import { showToast } from "@ui/toasts";
 import { getAssetIDByName } from "@ui/assets";
 import { Forms } from "@ui/components";

src/ui/settings/components/SettingsSection.tsx

@@ -1,4 +1,3 @@
-import { React } from "@metro/common";
 import { Forms } from "@ui/components";
 import { getAssetIDByName } from "@ui/assets";
 

src/ui/settings/components/Version.tsx

@@ -1,4 +1,3 @@
-import { React } from "@metro/common";
 import { getAssetIDByName } from "@ui/assets";
 import { showToast } from "@ui/toasts";
 import { Forms } from "@ui/components";

src/ui/settings/index.tsx

@@ -1,9 +1,10 @@
-import { React, i18n } from "@metro/common";
+import { i18n } from "@metro/common";
 import { findByDisplayName } from "@metro/filters";
 import { after } from "@lib/patcher";
 import findInReactTree from "@utils/findInReactTree";
 import SettingsSection from "@ui/settings/components/SettingsSection";
 import General from "@ui/settings/pages/General";
+import Plugins from "@ui/settings/pages/Plugins";
 import AssetBrowser from "@ui/settings/pages/AssetBrowser";
 
 const screensModule = findByDisplayName("getScreens", false);

src/ui/settings/pages/AssetBrowser.tsx

@@ -1,4 +1,4 @@
-import { React, ReactNative as RN } from "@metro/common";
+import { ReactNative as RN } from "@metro/common";
 import { Forms } from "@ui/components";
 import { all } from "@ui/assets";
 import AssetDisplay from "@ui/settings/components/AssetDisplay";

src/ui/settings/pages/General.tsx

@@ -1,4 +1,4 @@
-import { React, ReactNative as RN, url } from "@metro/common";
+import { ReactNative as RN, url } from "@metro/common";
 import { DISCORD_SERVER, GITHUB } from "@lib/constants";
 import { connectToDebugger } from "@lib/debug";
 import { getAssetIDByName } from "@ui/assets";