Directly utilise react and react-native from imports

scripts/build.ts

@@ -30,6 +30,11 @@ const FIND_METHODS = new Set([
 
 const paths = await glob("./src/lib/**/*.{ts,tsx,js,jsx}");
 
+const globalMap = {
+    "react": "globalThis.React",
+    "react-native": "globalThis.ReactNative"
+};
+
 // import commitHash from "~commit-hash";
 const constantsMap = {
     "commit-hash": () => `export default "${commitHash}"`,
@@ -117,11 +122,22 @@ try {
                         build.onResolve({ filter }, args => ({
                             namespace: key, path: args.path
                         }));
-                        build.onLoad({ filter, namespace: key }, async a => ({
+                        build.onLoad({ filter, namespace: key }, async () => ({
                             contents: await constantsMap[key](),
                             resolveDir: "src"
                         }));
                     });
+
+                    Object.keys(globalMap).forEach(key => {
+                        const filter = new RegExp(`^${key}$`);
+                        build.onResolve({ filter }, args => ({
+                            namespace: "glob-" + key, path: args.path
+                        }));
+                        build.onLoad({ filter, namespace: "glob-" + key }, () => ({
+                            contents: `Object.defineProperty(module, 'exports', { get: () => ${globalMap[key]} })`,
+                            resolveDir: "src",
+                        }));
+                    });
                 }
             },
             {

src/core/ui/screens/General.tsx

@@ -2,11 +2,11 @@ import { Tables } from "@metro/common";
 import { ClientInfoManager } from "@native/modules";
 import { removeFile } from "@native/wrapper";
 import { resolveAssets } from "@ui/assets";
+import { ScrollView } from "react-native";
 
 import commitHash from "~commit-hash";
 import { PyoncordSVGIcon } from "~core/ui/icons/PyoncordIcon";
 
-const { ScrollView } = ReactNative;
 const { Stack, TableRow, TableRowGroup } = Tables;
 
 const icons = resolveAssets({

src/core/ui/screens/Plugins.tsx

@@ -2,8 +2,8 @@ import { useProxy } from "@api/storage";
 import { disablePlugin, enablePlugin, instances as pluginInstances, pluginStorage, usePluginEnabled } from "@managers/plugins";
 import { Tables } from "@metro/common";
 import { PluginDef } from "@utils/types";
+import { ScrollView } from "react-native";
 
-const { ScrollView } = ReactNative;
 const { Stack, TableSwitchRow, TableRowGroup } = Tables;
 
 function PluginRow({ instance }) {

src/lib/api/storage/index.ts

@@ -1,6 +1,7 @@
 import { createFileBackend } from "@api/storage/backends";
 import { Emitter } from "@api/storage/emitter";
 import { proxyLazy } from "@utils";
+import { useEffect, useReducer } from "react";
 
 let _storagePromises = Promise.resolve();
 
@@ -60,9 +61,9 @@ export function useProxy<T = {}>(proxy: T): T {
     const emitter = proxy[emitterSymbol] as Emitter;
     if (!emitter) throw new Error("Could not find emitter in object passed to useProxy");
 
-    const [, forceUpdate] = React.useReducer(n => ~n, 0);
+    const [, forceUpdate] = useReducer(n => ~n, 0);
 
-    React.useEffect(() => {
+    useEffect(() => {
         emitter.on("SET", forceUpdate);
         emitter.on("DEL", forceUpdate);
 

src/lib/ui/settings.tsx

@@ -2,6 +2,7 @@
 import { Patcher } from "@api/Patcher";
 import { I18n, NavigationNative, TabsNavigationRef } from "@metro/common";
 import { lazyNavigate } from "@utils";
+import { memo, useEffect } from "react";
 import type { ImageURISource } from "react-native";
 
 const patcher = new Patcher("settings-patcher");
@@ -28,13 +29,13 @@ export function registerSection(section: { name: string; items: RowConfig[]; })
 /** @internal */
 export function patchSettings() {
     patcher.waitAndPatch(SettingConstants, module => {
-        const CustomPageRenderer = React.memo(() => {
+        const CustomPageRenderer = memo(() => {
             const navigation = NavigationNative.useNavigation();
             const route = NavigationNative.useRoute();
 
             const { render: PageComponent, ...args } = route.params;
 
-            React.useEffect(() => void navigation.setOptions({ ...args }), []);
+            useEffect(() => void navigation.setOptions({ ...args }), []);
 
             return <PageComponent />;
         });

src/preinit/index.ts

@@ -17,13 +17,10 @@ if (typeof pyoncord !== "undefined") throw new Error("Pyoncord has already initi
 
         const { React, ReactNative } = require("@metro/common");
 
-        Object.assign(globalThis, {
-            React,
-            ReactNative,
-            pyoncord: {
-                ...require("@pyoncord")
-            }
-        });
+        Object.assign(globalThis, { React, ReactNative });
+
+        // @ts-ignore
+        globalThis.pyoncord = { ...require("@pyoncord") };
 
         require("../core/index").initializePyoncord();
     } catch (error) {