[Global] Refactors all around

2023-01-10 23:30:46 +00:00 · 2023-01-10 23:30:46 +00:00 · 93c4eef678
commit 93c4eef678
parent 01a05a8b9d
11 changed files with 127 additions and 35 deletions
--- a/src/def.d.ts
+++ b/src/def.d.ts
@ -127,6 +127,7 @@ interface VendettaObject {
    }
    settings: Settings;
    logger: Logger;
+    version: string;
 }

 declare global {
--- a/src/index.ts
+++ b/src/index.ts
@ -11,7 +11,7 @@ import * as toasts from "@ui/toasts";
 import { patchAssets, all, find, getAssetByID, getAssetByName, getAssetIDByName } from "@ui/assets";
 import initSettings from "@ui/settings";
 import { fixTheme } from "@ui/fixTheme";
-import { connectToDebugger, patchLogHook } from "@lib/debug";
+import { connectToDebugger, patchLogHook, versionHash } from "@lib/debug";
 import { plugins, fetchPlugin, evalPlugin, stopPlugin, removePlugin, getSettings } from "@lib/plugins";
 import settings from "@lib/settings";

@ -54,12 +54,13 @@ async function init() {
            },
            settings: settings,
            logger: logger,
+            version: versionHash,
        };

-        initSettings();
-        patchAssets();
        patchLogHook();
+        patchAssets();
        fixTheme();
+        initSettings();
    } catch (e: Error | any) {
        erroredOnLoad = true;
        alert(`Vendetta failed to initialize... ${e.stack || e.toString()}`);
--- a/src/lib/debug.ts
+++ b/src/lib/debug.ts
@ -1,3 +1,4 @@
+import { ReactNative as RN } from "@metro/common";
 import { after } from "@lib/patcher";
 import { getAssetIDByName } from "@ui/assets";
 import { showToast } from "@ui/toasts";
@ -41,3 +42,30 @@ export function patchLogHook() {
        logger.log(args[0]);
    });
 }
+
+export const versionHash = "__vendettaVersion";
+
+export function getDebugInfo(string: boolean = false) {
+    const InfoDictionaryManager = RN.NativeModules.InfoDictionaryManager;
+    const hermesProps = window.HermesInternal.getRuntimeProperties();
+    const rnVer = RN.Platform.constants.reactNativeVersion;
+
+    return {
+        vendetta: {
+            version: versionHash,
+        },
+        discord: {
+            version: InfoDictionaryManager.Version,
+            build: InfoDictionaryManager.Build,
+        },
+        react: {
+            version: React.version,
+            nativeVersion: `${rnVer.major || 0}.${rnVer.minor || 0}.${rnVer.patch || 0}`,
+        },
+        hermes: {
+            version: hermesProps["OSS Release Version"],
+            buildType: hermesProps["Build"],
+            bytecodeVersion: hermesProps["Bytecode Version"],
+        }
+    }
+}
--- a/src/ui/components.ts
+++ b/src/ui/components.ts
@ -1,4 +1,5 @@
-import { findByProps } from "@metro/filters";
+import { findByDisplayName, findByProps } from "@metro/filters";

 export const Forms = findByProps("Form", "FormSection");
-export const General = findByProps("Button", "Text", "View");
+export const General = findByProps("Button", "Text", "View");
+export const Search = findByDisplayName("StaticSearchBarContainer");
--- a/src/ui/settings/components/PluginCard.tsx
+++ b/src/ui/settings/components/PluginCard.tsx
@ -53,7 +53,7 @@ export default function PluginCard({ plugin }: PluginCardProps) {
                leading={<FormRow.Icon source={getAssetIDByName(plugin.manifest.vendetta.icon || "ic_application_command_24px")} />}
                trailing={
                    <FormSwitch
-                        value={plugin.enabled}
+                        value={enabled}
                        onValueChange={(v: boolean) => {
                            if (v) startPlugin(plugin.id); else stopPlugin(plugin.id);
                            setEnabled(v);
@ -76,11 +76,11 @@ export default function PluginCard({ plugin }: PluginCardProps) {
                        <TouchableOpacity
                            onPress={() => {
                                plugin.update = !plugin.update;
-                                setUpdate(plugin.update);
                                showToast(`${plugin.update ? "Enabled" : "Disabled"} updates for ${plugin.manifest.name}.`, getAssetIDByName("toast_image_saved"));
+                                setUpdate(plugin.update);
                            }}
                        >
-                            <Image style={styles.icon} source={getAssetIDByName(plugin.update ? "Check" : "Small")} />
+                            <Image style={styles.icon} source={getAssetIDByName(update ? "Check" : "Small")} />
                        </TouchableOpacity>
                        {getSettings(plugin.id) && <TouchableOpacity onPress={() => showSettings(plugin)}>
                            <Image style={styles.icon} source={getAssetIDByName("settings")} />
--- a/src/ui/settings/pages/Developer.tsx
+++ b/src/ui/settings/pages/Developer.tsx
@ -1,19 +1,33 @@
-import { ReactNative as RN } from "@metro/common";
-import { Forms } from "@ui/components";
+import { ReactNative as RN, stylesheet } from "@metro/common";
+import { Forms, Search } from "@ui/components";
 import { getAssetIDByName } from "@ui/assets";
+import { showToast } from "@/ui/toasts";
 import { connectToDebugger } from "@lib/debug";
 import { all } from "@ui/assets";
 import settings from "@lib/settings";
+import logger from "@lib/logger";
 import AssetDisplay from "@ui/settings/components/AssetDisplay";

 const { FormSection, FormRow, FormInput, FormDivider } = Forms;
+const { connectToDevTools } = window.__vendetta_rdc;
+
+const styles = stylesheet.createThemedStyleSheet({
+    search: {
+        margin: 0,
+        padding: 0,
+        paddingRight: 15,
+        paddingLeft: 15,
+        borderBottomWidth: 0,
+        backgroundColor: "none"
+    }
+})

 export default function Developer() {
    const [debuggerUrl, setDebuggerUrl] = React.useState(settings.debuggerUrl || "");
    const [searchName, setSearchName] = React.useState("");

    return (
-        <>
+        <RN.View>
            <FormSection title="Debug">
                <FormInput 
                    value={debuggerUrl}
@ -30,12 +44,29 @@ export default function Developer() {
                    trailing={FormRow.Arrow}
                    onPress={() => connectToDebugger(debuggerUrl)}
                />
+                <FormDivider />
+                {connectToDevTools && <FormRow
+                    label="Connect to React DevTools"
+                    leading={() => <FormRow.Icon source={getAssetIDByName("ic_badge_staff")} />}
+                    trailing={FormRow.Arrow}
+                    onPress={() => {
+                        try {
+                            connectToDevTools({
+                                host: debuggerUrl.split(":")[0],
+                                resolveRNStyle: RN.StyleSheet.flatten,
+                            });
+                        } catch(e) {
+                            logger.error("Failed to connect to React DevTools!", e);
+                            showToast("Failed to connect to React DevTools!", getAssetIDByName("Small"));
+                        }
+                    }}
+                />}
            </FormSection>
            <FormSection title="Assets">
-                <FormInput 
-                    value={searchName}
-                    onChange={(v: string) => setSearchName(v)}
-                    title="SEARCH"
+                <Search
+                    style={styles.search}
+                    onChangeText={(v: string) => setSearchName(v)}
+                    placeholder="Search..."
                />
                <RN.FlatList
                    data={Object.values(all).filter(a => a.name.includes(searchName))}
@ -48,6 +79,6 @@ export default function Developer() {
                    keyExtractor={item => item.name}
                />
            </FormSection>
-        </>
+        </RN.View>
    )
 }
--- a/src/ui/settings/pages/General.tsx
+++ b/src/ui/settings/pages/General.tsx
@ -2,36 +2,40 @@ import { ReactNative as RN, url } from "@metro/common";
 import { DISCORD_SERVER, GITHUB } from "@lib/constants";
 import { getAssetIDByName } from "@ui/assets";
 import { Forms } from "@ui/components";
+import { getDebugInfo } from "@lib/debug";
 import Version from "@ui/settings/components/Version";
 import settings from "@lib/settings";

-const { FormRow, FormSection, FormDivider, FormSwitch } = Forms;
-const InfoDictionaryManager = RN.NativeModules.InfoDictionaryManager;
-const hermesProps = window.HermesInternal.getRuntimeProperties();
-const rnVer = RN.Platform.constants.reactNativeVersion;
+const { FormRow, FormSwitchRow, FormSection, FormDivider } = Forms;
+const debugInfo = getDebugInfo()

 export default function General() {
    const [devSettings, setDevSettings] = React.useState(settings.developerSettings || false);

    const versions = [
+        {
+            label: "Vendetta",
+            version: debugInfo.vendetta.version,
+            icon: "ic_progress_wrench_24px"
+        },
        {
            label: "Discord",
-            version: `${InfoDictionaryManager.Version} (${InfoDictionaryManager.Build})`,
+            version: `${debugInfo.discord.version} (${debugInfo.discord.build})`,
            icon: "Discord",
        },
        {
            label: "React",
-            version: React.version,
+            version: debugInfo.react.version,
            icon: "ic_category_16px",
        },
        {
            label: "React Native",
-            version: `${rnVer.major || 0}.${rnVer.minor || 0}.${rnVer.patch || 0}`,
+            version: debugInfo.react.nativeVersion,
            icon: "mobile",
        },
        {
            label: "Hermes",
-            version: `${hermesProps["OSS Release Version"]} ${hermesProps["Build"]} | Bytecode ${hermesProps["Bytecode Version"]}`,
+            version: `${debugInfo.hermes.version} ${debugInfo.hermes.buildType} | Bytecode ${debugInfo.hermes.bytecodeVersion}`,
            icon: "ic_badge_staff",
        },
    ];
@ -69,16 +73,14 @@ export default function General() {
                    onPress={() => RN.NativeModules.BundleUpdaterManager.reload()}
                />
                <FormDivider />
-                <FormRow 
+                <FormSwitchRow 
                    label="Developer Settings"
                    leading={<FormRow.Icon source={getAssetIDByName("ic_progress_wrench_24px")} />}
-                    trailing={<FormSwitch 
-                        value={devSettings}
-                        onValueChange={(v: boolean) => {
-                            settings.developerSettings = v;
-                            setDevSettings(v);
-                        }}
-                    />}
+                    value={devSettings}
+                    onValueChange={(v: boolean) => {
+                        settings.developerSettings = v;
+                        setDevSettings(v);
+                    }}
                />
            </FormSection>
        </RN.ScrollView>
--- a/src/ui/settings/pages/Plugins.tsx
+++ b/src/ui/settings/pages/Plugins.tsx
@ -12,7 +12,7 @@ export default function Plugins() {
    const [pluginList, setPluginList] = React.useState(plugins);

    return (
-        <>
+        <RN.View>
            <FormInput 
                value={pluginUrl}
                onChange={(v: string) => setPluginUrl(v)}
@ -20,7 +20,7 @@ export default function Plugins() {
            />
            <FormRow
                label="Install plugin"
-                leading={() => <FormRow.Icon source={getAssetIDByName("add_white")} />}
+                leading={<FormRow.Icon source={getAssetIDByName("add_white")} />}
                trailing={FormRow.Arrow}
                onPress={() => {
                        fetchPlugin(pluginUrl).then(() => {
@ -37,6 +37,6 @@ export default function Plugins() {
                renderItem={({ item }) => <PluginCard plugin={item} />}
                keyExtractor={item => item.id}
            />
-        </>
+        </RN.View>
    )
 }