Optimise Web via treeshaking, cleanup build scripts

src/Vencord.ts

@@ -17,12 +17,6 @@ import { checkForUpdates, UpdateLogger } from "./utils/updater";
 import { onceReady } from "./webpack";
 import { Router } from "./webpack/common";
 
-Object.defineProperty(window, "IS_WEB", {
-    get: () => !window.DiscordNative,
-    configurable: true,
-    enumerable: true
-});
-
 export let Components: any;
 
 async function init() {
@@ -30,21 +24,23 @@ async function init() {
     startAllPlugins();
     Components = await import("./components");
 
-    try {
-        const isOutdated = await checkForUpdates();
-        if (isOutdated && Settings.notifyAboutUpdates)
-            setTimeout(() => {
-                showNotice(
-                    "A Vencord update is available!",
-                    "View Update",
-                    () => {
-                        popNotice();
-                        Router.open("VencordUpdater");
-                    }
-                );
-            }, 10000);
-    } catch (err) {
-        UpdateLogger.error("Failed to check for updates", err);
+    if (!IS_WEB) {
+        try {
+            const isOutdated = await checkForUpdates();
+            if (isOutdated && Settings.notifyAboutUpdates)
+                setTimeout(() => {
+                    showNotice(
+                        "A Vencord update is available!",
+                        "View Update",
+                        () => {
+                            popNotice();
+                            Router.open("VencordUpdater");
+                        }
+                    );
+                }, 10000);
+        } catch (err) {
+            UpdateLogger.error("Failed to check for updates", err);
+        }
     }
 }
 

src/components/Settings.tsx

@@ -72,7 +72,7 @@ export default ErrorBoundary.wrap(function Settings() {
                 SettingsDir: <code style={{ userSelect: "text", cursor: "text" }}>{settingsDir}</code>
             </Forms.FormText>
 
-            {!IS_WEB && <Flex className={classes(Margins.marginBottom20)}>
+            {!IS_WEB && <Flex className={Margins.marginBottom20}>
                 <Button
                     onClick={() => window.DiscordNative.app.relaunch()}
                     size={Button.Sizes.SMALL}
@@ -95,8 +95,8 @@ export default ErrorBoundary.wrap(function Settings() {
                     Open QuickCSS File
                 </Button>
             </Flex>}
+
             <Forms.FormDivider />
-            <Forms.FormTitle tag="h5">Settings</Forms.FormTitle>
             <Switch
                 value={settings.useQuickCss}
                 onChange={(v: boolean) => settings.useQuickCss = v}

src/components/Updater.tsx

@@ -158,7 +158,7 @@ function Newer(props: CommonProps) {
     );
 }
 
-export default ErrorBoundary.wrap(function Updater() {
+function Updater() {
     const [repo, err, repoPending] = useAwaiter(getRepo, "Loading...");
 
     React.useEffect(() => {
@@ -188,4 +188,6 @@ export default ErrorBoundary.wrap(function Updater() {
             {isNewer ? <Newer {...commonProps} /> : <Updatable {...commonProps} />}
         </Forms.FormSection >
     );
-});
+}
+
+export default IS_WEB ? null : ErrorBoundary.wrap(Updater);

src/globals.d.ts

@@ -1,10 +1,30 @@
 declare global {
+    /**
+     * This exists only at build time, so references to it in patches should insert it
+     * via String interpolation OR use different replacement code based on this
+     * but NEVER refrence it inside the patched code
+     *
+     * @example
+     * // BAD
+     * replace: "IS_WEB?foo:bar"
+     * // GOOD
+     * replace: IS_WEB ? "foo" : "bar"
+     * // also good
+     * replace: `${IS_WEB}?foo:bar`
+     */
     export var IS_WEB: boolean;
     export var VencordNative: typeof import("./VencordNative").default;
     export var Vencord: typeof import("./Vencord");
     export var appSettings: {
         set(setting: string, v: any): void;
     };
+    /**
+     * Only available when running in Electron, undefined on web.
+     * Thus, avoid using this or only use it inside an {@link IS_WEB} guard.
+     *
+     * If you really must use it, mark your plugin as Desktop App only via
+     * `target: "DESKTOP"`
+     */
     export var DiscordNative: any;
 
     interface Window {

src/plugins/clickableRoleDot.ts

@@ -18,7 +18,16 @@ export default definePlugin({
     ],
 
     copyToClipBoard(color: string) {
-        window.DiscordNative.clipboard.copy(color);
+        if (IS_WEB) {
+            navigator.clipboard.writeText(color)
+                .then(() => this.notifySuccess);
+        } else {
+            DiscordNative.clipboard.copy(color);
+            this.notifySuccess();
+        }
+    },
+
+    notifySuccess() {
         Toasts.show({
             message: "Copied to Clipboard!",
             type: Toasts.Type.SUCCESS,

src/plugins/noRPC.ts

@@ -5,6 +5,7 @@ export default definePlugin({
     name: "No RPC",
     description: "Disables Discord's RPC server.",
     authors: [Devs.Cyn],
+    target: "DESKTOP",
     patches: [
         {
             find: '.ensureModule("discord_rpc")',

src/plugins/noSystemBadge.ts

@@ -5,6 +5,7 @@ export default definePlugin({
     name: "NoSystemBadge",
     description: "Disables the taskbar and system tray unread count badge.",
     authors: [Devs.rushii],
+    target: "DESKTOP",
     patches: [
         {
             find: "setSystemTrayApplications:function",

src/plugins/settings.ts

@@ -28,12 +28,15 @@ export default definePlugin({
         find: "Messages.ACTIVITY_SETTINGS",
         replacement: {
             match: /\{section:(.{1,2})\.ID\.HEADER,\s*label:(.{1,2})\..{1,2}\.Messages\.ACTIVITY_SETTINGS\}/,
-            replace: (m, mod) =>
-                `{section:${mod}.ID.HEADER,label:"Vencord"},` +
-                '{section:"VencordSetting",label:"Vencord",element:Vencord.Components.Settings},' +
-                '{section:"VencordUpdater",label:"Updater",element:Vencord.Components.Updater,predicate:()=>!IS_WEB},' +
-                `{section:${mod}.ID.DIVIDER},${m}`
-
+            replace: (m, mod) => {
+                const updater = !IS_WEB ? '{section:"VencordUpdater",label:"Updater",element:Vencord.Components.Updater},' : "";
+                return (
+                    `{section:${mod}.ID.HEADER,label:"Vencord"},` +
+                    '{section:"VencordSetting",label:"Vencord",element:Vencord.Components.Settings},' +
+                    updater +
+                    `{section:${mod}.ID.DIVIDER},${m}`
+                );
+            }
         }
     }]
 });