Initial Settings UI work

src/renderer/ui/Settings.tsx

@@ -0,0 +1,36 @@
+import { getValueAndOnChange, useSettings } from "renderer/settings";
+import { Common } from "../vencord";
+
+export default function SettingsUi() {
+    const Settings = useSettings();
+    const { Forms: { FormSection, FormText, FormDivider, FormSwitch, FormTitle }, Text, Select } = Common;
+
+    return (
+        <FormSection>
+            <Text variant="heading-lg/semibold" style={{ color: "var(--header-primary)" }} tag="h2">
+                Vencord Desktop Settings
+            </Text>
+
+            <FormTitle>Discord Branch</FormTitle>
+            <Select
+                placeholder="Stable"
+                options={[
+                    { label: "Stable", value: "stable", default: true },
+                    { label: "Canary", value: "canary" },
+                    { label: "PTB", value: "ptb" },
+                ]}
+                closeOnSelect={true}
+                select={v => Settings.discordBranch = v}
+                isSelected={v => v === Settings.discordBranch}
+                serialize={s => s}
+            />
+
+            <FormSwitch
+                {...getValueAndOnChange("openLinksWithElectron")}
+                note={"This will open links in a new window instead of your WebBrowser"}
+            >
+                Open Links in app
+            </FormSwitch>
+        </FormSection>
+    );
+}

src/renderer/ui/patchSettings.ts

@@ -0,0 +1,15 @@
+import { monkeyPatch } from "../../shared/utils/monkeyPatch";
+import { Common, plugins } from "../vencord";
+import Settings from "./Settings";
+
+monkeyPatch(plugins.Settings, "makeSettingsCategories", function (this: unknown, original, { ID }: { ID: Record<string, unknown>; }) {
+    const cats = original.call(this, { ID });
+    cats.splice(1, 0, {
+        section: "VencordDesktop",
+        label: "Desktop Settings",
+        element: Settings,
+        onClick: () => Common.SettingsRouter.open("VencordDesktop")
+    });
+
+    return cats;
+});