bump to v1.1.7

Co-authored-by: V <vendicated@riseup.net>

.github/workflows/build.yml

@@ -42,7 +42,7 @@ jobs:
 
             - name: Clean up obsolete files
               run: |
-                rm -rf dist/extension* Vencord.user.css
+                rm -rf dist/extension-unpacked Vencord.user.css vencordDesktopRenderer.css vencordDesktopRenderer.css.map
 
             - name: Get some values needed for the release
               id: release_values

.github/workflows/reportBrokenPlugins.yml

@@ -50,7 +50,7 @@ jobs:
                 export CHROMIUM_BIN=$(which chromium-browser)
                 export USE_CANARY=true
 
-                esbuild test/generateReport.ts > dist/report.mjs
+                esbuild scripts/generateReport.ts > dist/report.mjs
                 node dist/report.mjs >> $GITHUB_STEP_SUMMARY
               env:
                 DISCORD_TOKEN: ${{ secrets.DISCORD_TOKEN }}

.github/workflows/test.yml

@@ -15,7 +15,7 @@ jobs:
             - uses: pnpm/action-setup@v2 # Install pnpm using packageManager key in package.json
 
             - name: Use Node.js 18
-              uses: actions/setup-node@v2
+              uses: actions/setup-node@v3
               with:
                   node-version: 18
                   cache: "pnpm"

README.md

@@ -6,7 +6,7 @@ The cutest Discord client mod
 
 -   Super easy to install (Download Installer, open, click install button, done)
 -   100+ plugins built in: [See a list](https://gist.github.com/Vendicated/8696cde7b92548064a3ae92ead84d033)
-    -   Some highlights: SpotifyControls, Experiments, NoTrack, MessageLogger, QuickReply, Free Emotes/Stickers, CustomCommands, ShowHiddenChannels, PronounDB
+    -   Some highlights: SpotifyControls, GameActivityToggle, Experiments, NoTrack, MessageLogger, QuickReply, Free Emotes/Stickers, CustomCommands, ShowHiddenChannels, PronounDB
 -   Fairly lightweight despite the many inbuilt plugins
 -   Excellent Browser Support: Run Vencord in your Browser via extension or UserScript
 -   Works on any Discord branch: Stable, Canary or PTB all work (though for the best experience I recommend stable!)

browser/GMPolyfill.js

@@ -59,8 +59,8 @@ async function checkCors(url, method) {
     const origin = headers["access-control-allow-origin"];
     if (origin !== "*" && origin !== window.location.origin) return false;
 
-    const methods = headers["access-control-allow-methods"]?.split(/,\s/g);
+    const methods = headers["access-control-allow-methods"]?.toLowerCase().split(/,\s/g);
-    if (methods && !methods.includes(method)) return false;
+    if (methods && !methods.includes(method.toLowerCase())) return false;
 
     return true;
 }

browser/manifest.json

@@ -21,7 +21,8 @@
         {
             "run_at": "document_start",
             "matches": ["*://*.discord.com/*"],
-            "js": ["content.js"]
+            "js": ["content.js"],
+            "all_frames": true
         }
     ],
 

browser/modifyResponseHeaders.json

@@ -15,7 +15,7 @@
             ]
         },
         "condition": {
-            "resourceTypes": ["main_frame"]
+            "resourceTypes": ["main_frame", "sub_frame"]
         }
     },
     {

docs/1_INSTALLING.md

@@ -13,12 +13,6 @@ Welcome to Megu's Installation Guide! In this file, you will learn about how to
   - [Installing Vencord](#installing-vencord)
   - [Updating Vencord](#updating-vencord)
   - [Uninstalling Vencord](#uninstalling-vencord)
-  - [Manually Installing Vencord](#manually-installing-vencord)
-    - [On Windows](#on-windows)
-    - [On Linux](#on-linux)
-    - [On MacOS](#on-macos)
-    - [Manual Patching](#manual-patching)
-    - [Manually Uninstalling Vencord](#manually-uninstalling-vencord)
 
 ## Dependencies
 
@@ -27,11 +21,9 @@ Welcome to Megu's Installation Guide! In this file, you will learn about how to
 
 ## Installing Vencord
 
-> :exclamation: If this doesn't work, see [Manually Installing Vencord](#manually-installing-vencord)
-
 Install `pnpm`:
 
-> :exclamation: This next command may need to be run as admin/sudo depending on your system, and you may need to close and reopen your terminal for pnpm to be in your PATH.
+> :exclamation: This next command may need to be run as admin/root depending on your system, and you may need to close and reopen your terminal for pnpm to be in your PATH.
 
 ```shell
 npm i -g pnpm
@@ -103,102 +95,4 @@ Simply run:
 pnpm uninject
 ```
 
-The above command may ask you to also run:
-
-```shell
-pnpm install --frozen-lockfile
-pnpm uninject
-```
-
-## Manually Installing Vencord
-
--   [Windows](#on-windows)
--   [Linux](#on-linux)
--   [MacOS](#on-macos)
-
-### On Windows
-
-Press Win+R and enter: `%LocalAppData%` and hit enter. In this page, find the page (Discord, DiscordPTB, DiscordCanary, etc) that you want to patch.
-
-Now follow the instructions at [Manual Patching](#manual-patching)
-
-### On Linux
-
-The Discord folder is usually in one of the following paths:
-
--   /usr/share
--   /usr/lib64
--   /opt
--   /home/$USER/.local/share
-
-If you use flatpak, it will usually be in one of the following paths:
-
--   /var/lib/flatpak/app/com.discordapp.Discord/current/active/files
--   /home/$USER/.local/share/flatpak/app/com.discordapp.Discord/current/active/files
-
-You will need to give flatpak access to vencord with one of the following commands:
-
-> :exclamation: If not on stable, replace `com.discordapp.Discord` with your branch name, e.g., `com.discordapp.DiscordCanary`
-
-> :exclamation: Replace `/path/to/vencord/` with the path to your vencord folder (NOT the dist folder)
-
-If Discord flatpak install is in /home/:
-
-```shell
-flatpak override --user com.discordapp.Discord --filesystem="/path/to/vencord/"
-```
-
-If Discord flatpak install not in /home/:
-
-```shell
-sudo flatpak override com.discordapp.Discord --filesystem="/path/to/vencord"
-```
-
-Now follow the instructions at [Manual Patching](#manual-patching)
-
-### On MacOS
-
-Open finder and go to your Applications folder. Right-Click on the Discord application you want to patch, and view contents.
-
-Go to the `Contents/Resources` folder.
-
-Now follow the instructions at [Manual Patching](#manual-patching)
-
-### Manual Patching
-
-> :exclamation: If using Flatpak on linux, go to the folder that contains the `app.asar` file, and skip to where we create the `app` folder below.
-
-> :exclamation: On Linux/MacOS, there's a chance there won't be an `app-<number>` folder, but there probably is a `resources` folder, so keep reading :)
-
-Inside there, look for the `app-<number>` folders. If you have multiple, use the highest number. If that doesn't work, do it for the rest of the `app-<number>` folders.
-
-Inside there, go to the `resources` folder. There should be a file called `app.asar`. If there isn't, look at a different `app-<number>` folder instead.
-
-Make a new folder in `resources` called `app`. In here, we will make two files:
-
-`package.json` and `index.js`
-
-In `index.js`:
-
-> :exclamation: Replace the path in the first line with the path to `patcher.js` in your vencord dist folder.
-> On Windows, you can get this by shift-rightclicking the patcher.js file and selecting "copy as path"
-
-```js
-require("C:/Users/<your user>/path/to/vencord/dist/patcher.js");
-```
-
-And in `package.json`:
-
-```json
-{ "name": "discord", "main": "index.js" }
-```
-
-Finally, fully close & reopen your Discord client and check to see that `Vencord` appears in settings!
-
-### Manually Uninstalling Vencord
-
-> :exclamation: Do not delete `app.asar` - Only delete the `app` folder we created.
-
-Use the instructions above to find the `app` folder, and delete it. Then Close & Reopen Discord.
-
 If you need more help, ask in the support channel in our [Discord Server](https://discord.gg/D9uwnFnqmd).

package.json

@@ -1,9 +1,8 @@
 {
     "name": "vencord",
     "private": "true",
-    "version": "1.1.3",
+    "version": "1.1.7",
     "description": "The cutest Discord client mod",
-    "keywords": [ ],
     "homepage": "https://github.com/Vendicated/Vencord#readme",
     "bugs": {
         "url": "https://github.com/Vendicated/Vencord/issues"
@@ -22,8 +21,8 @@
         "buildWeb": "node --require=./scripts/suppressExperimentalWarnings.js scripts/build/buildWeb.mjs",
         "generatePluginJson": "tsx scripts/generatePluginList.ts",
         "inject": "node scripts/runInstaller.mjs",
-        "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
+        "lint": "eslint . --ext .js,.jsx,.ts,.tsx --ignore-pattern src/userplugins",
-        "lint-styles": "stylelint \"src/**/*.css\"",
+        "lint-styles": "stylelint \"src/**/*.css\" --ignore-pattern src/userplugins",
         "lint:fix": "pnpm lint --fix",
         "test": "pnpm build && pnpm lint && pnpm lint-styles && pnpm testTsc",
         "testWeb": "pnpm lint && pnpm buildWeb && pnpm testTsc",
@@ -34,7 +33,9 @@
     "dependencies": {
         "@vap/core": "0.0.12",
         "@vap/shiki": "0.10.3",
-        "fflate": "^0.7.4"
+        "fflate": "^0.7.4",
+        "nanoid": "^4.0.2",
+        "virtual-merge": "^1.0.1"
     },
     "devDependencies": {
         "@types/diff": "^5.0.2",
@@ -64,7 +65,7 @@
         "type-fest": "^3.5.3",
         "typescript": "^4.9.4"
     },
-    "packageManager": "pnpm@7.13.4",
+    "packageManager": "pnpm@8.1.1",
     "pnpm": {
         "patchedDependencies": {
             "eslint-plugin-path-alias@1.0.0": "patches/eslint-plugin-path-alias@1.0.0.patch",
@@ -91,6 +92,7 @@
         "sourceDir": "./dist/extension-v2-unpacked"
     },
     "engines": {
-        "node": ">=18"
+        "node": ">=18",
+        "pnpm": ">=8"
     }
 }

scripts/build/build.mjs

@@ -48,6 +48,7 @@ const sourceMapFooter = s => watch ? "" : `//# sourceMappingURL=vencord://${s}.j
 const sourcemap = watch ? "inline" : "external";
 
 await Promise.all([
+    // common preload
     esbuild.build({
         ...nodeCommonOpts,
         entryPoints: ["src/preload.ts"],
@@ -55,12 +56,19 @@ await Promise.all([
         footer: { js: "//# sourceURL=VencordPreload\n" + sourceMapFooter("preload") },
         sourcemap,
     }),
+
+    // Discord Desktop main & renderer
     esbuild.build({
         ...nodeCommonOpts,
-        entryPoints: ["src/patcher.ts"],
+        entryPoints: ["src/main/index.ts"],
         outfile: "dist/patcher.js",
         footer: { js: "//# sourceURL=VencordPatcher\n" + sourceMapFooter("patcher") },
         sourcemap,
+        define: {
+            ...defines,
+            IS_DISCORD_DESKTOP: true,
+            IS_VENCORD_DESKTOP: false
+        }
     }),
     esbuild.build({
         ...commonOpts,
@@ -72,12 +80,48 @@ await Promise.all([
         globalName: "Vencord",
         sourcemap,
         plugins: [
-            globPlugins,
+            globPlugins("discordDesktop"),
             ...commonOpts.plugins
         ],
         define: {
             ...defines,
-            IS_WEB: false
+            IS_WEB: false,
+            IS_DISCORD_DESKTOP: true,
+            IS_VENCORD_DESKTOP: false
+        }
+    }),
+
+    // Vencord Desktop main & renderer
+    esbuild.build({
+        ...nodeCommonOpts,
+        entryPoints: ["src/main/index.ts"],
+        outfile: "dist/vencordDesktopMain.js",
+        footer: { js: "//# sourceURL=VencordDesktopMain\n" + sourceMapFooter("vencordDesktopMain") },
+        sourcemap,
+        define: {
+            ...defines,
+            IS_DISCORD_DESKTOP: false,
+            IS_VENCORD_DESKTOP: true
+        }
+    }),
+    esbuild.build({
+        ...commonOpts,
+        entryPoints: ["src/Vencord.ts"],
+        outfile: "dist/vencordDesktopRenderer.js",
+        format: "iife",
+        target: ["esnext"],
+        footer: { js: "//# sourceURL=VencordDesktopRenderer\n" + sourceMapFooter("vencordDesktopRenderer") },
+        globalName: "Vencord",
+        sourcemap,
+        plugins: [
+            globPlugins("vencordDesktop"),
+            ...commonOpts.plugins
+        ],
+        define: {
+            ...defines,
+            IS_WEB: false,
+            IS_DISCORD_DESKTOP: false,
+            IS_VENCORD_DESKTOP: true
         }
     }),
 ]).catch(err => {

scripts/build/buildWeb.mjs

@@ -36,16 +36,18 @@ const commonOptions = {
     entryPoints: ["browser/Vencord.ts"],
     globalName: "Vencord",
     format: "iife",
-    external: ["plugins", "git-hash"],
+    external: ["plugins", "git-hash", "/assets/*"],
     plugins: [
-        globPlugins,
+        globPlugins("web"),
         ...commonOpts.plugins,
     ],
     target: ["esnext"],
     define: {
         IS_WEB: "true",
         IS_STANDALONE: "true",
-        IS_DEV: JSON.stringify(watch)
+        IS_DEV: JSON.stringify(watch),
+        IS_DISCORD_DESKTOP: "false",
+        IS_VENCORD_DESKTOP: "false"
     }
 };
 

scripts/build/common.mjs

@@ -48,9 +48,9 @@ export const makeAllPackagesExternalPlugin = {
 };
 
 /**
- * @type {import("esbuild").Plugin}
+ * @type {(kind: "web" | "discordDesktop" | "vencordDesktop") => import("esbuild").Plugin}
  */
-export const globPlugins = {
+export const globPlugins = kind => ({
     name: "glob-plugins",
     setup: build => {
         const filter = /^~plugins$/;
@@ -76,8 +76,10 @@ export const globPlugins = {
                     if (fileBits.length > 2 && ["ts", "tsx"].includes(fileBits.at(-1))) {
                         const mod = fileBits.at(-2);
                         if (mod === "dev" && !watch) continue;
-                        if (mod === "web" && !isWeb) continue;
+                        if (mod === "web" && kind === "discordDesktop") continue;
-                        if (mod === "desktop" && isWeb) continue;
+                        if (mod === "desktop" && kind === "web") continue;
+                        if (mod === "discordDesktop" && kind !== "discordDesktop") continue;
+                        if (mod === "vencordDesktop" && kind !== "vencordDesktop") continue;
                     }
 
                     const mod = `p${i}`;
@@ -93,7 +95,7 @@ export const globPlugins = {
             };
         });
     }
-};
+});
 
 /**
  * @type {import("esbuild").Plugin}
@@ -193,7 +195,7 @@ export const commonOpts = {
     legalComments: "linked",
     banner,
     plugins: [fileIncludePlugin, gitHashPlugin, gitRemotePlugin, stylePlugin],
-    external: ["~plugins", "~git-hash", "~git-remote"],
+    external: ["~plugins", "~git-hash", "~git-remote", "/assets/*"],
     inject: ["./scripts/build/inject/react.mjs"],
     jsxFactory: "VencordCreateElement",
     jsxFragment: "VencordFragment",

scripts/generatePluginList.ts

@@ -35,7 +35,7 @@ interface PluginData {
     hasCommands: boolean;
     required: boolean;
     enabledByDefault: boolean;
-    target: "desktop" | "web" | "dev";
+    target: "discordDesktop" | "vencordDesktop" | "web" | "dev";
 }
 
 const devs = {} as Record<string, Dev>;
@@ -150,7 +150,7 @@ async function parseFile(fileName: string) {
         const fileBits = fileName.split(".");
         if (fileBits.length > 2 && ["ts", "tsx"].includes(fileBits.at(-1)!)) {
             const mod = fileBits.at(-2)!;
-            if (!["web", "desktop", "dev"].includes(mod)) throw fail(`invalid target ${fileBits.at(-2)}`);
+            if (!["web", "discordDesktop", "vencordDesktop", "dev"].includes(mod)) throw fail(`invalid target ${fileBits.at(-2)}`);
             data.target = mod as any;
         }
 

src/Vencord.ts

@@ -30,17 +30,45 @@ import "./webpack/patchWebpack";
 import { showNotification } from "./api/Notifications";
 import { PlainSettings, Settings } from "./api/settings";
 import { patches, PMLogger, startAllPlugins } from "./plugins";
+import { localStorage } from "./utils/localStorage";
+import { relaunch } from "./utils/native";
+import { getCloudSettings, putCloudSettings } from "./utils/settingsSync";
 import { checkForUpdates, rebuild, update, UpdateLogger } from "./utils/updater";
 import { onceReady } from "./webpack";
 import { SettingsRouter } from "./webpack/common";
 
 export let Components: any;
 
+async function syncSettings() {
+    if (
+        Settings.cloud.settingsSync && // if it's enabled
+        Settings.cloud.authenticated // if cloud integrations are enabled
+    ) {
+        if (localStorage.Vencord_settingsDirty) {
+            await putCloudSettings();
+            delete localStorage.Vencord_settingsDirty;
+        } else if (await getCloudSettings(false)) { // if we synchronized something (false means no sync)
+            // we show a notification here instead of allowing getCloudSettings() to show one to declutter the amount of
+            // potential notifications that might occur. getCloudSettings() will always send a notification regardless if
+            // there was an error to notify the user, but besides that we only want to show one notification instead of all
+            // of the possible ones it has (such as when your settings are newer).
+            showNotification({
+                title: "Cloud Settings",
+                body: "Your settings have been updated! Click here to restart to fully apply changes!",
+                color: "var(--green-360)",
+                onClick: relaunch
+            });
+        }
+    }
+}
+
 async function init() {
     await onceReady;
     startAllPlugins();
     Components = await import("./components");
 
+    syncSettings();
+
     if (!IS_WEB) {
         try {
             const isOutdated = await checkForUpdates();
@@ -48,18 +76,14 @@ async function init() {
 
             if (Settings.autoUpdate) {
                 await update();
-                const needsFullRestart = await rebuild();
+                await rebuild();
                 if (Settings.autoUpdateNotification)
                     setTimeout(() => showNotification({
                         title: "Vencord has been updated!",
                         body: "Click here to restart",
                         permanent: true,
-                        onClick() {
+                        noPersist: true,
-                            if (needsFullRestart)
+                        onClick: relaunch
-                                window.DiscordNative.app.relaunch();
-                            else
-                                location.reload();
-                        }
                     }), 10_000);
                 return;
             }
@@ -69,6 +93,7 @@ async function init() {
                     title: "A Vencord update is available!",
                     body: "Click here to view the update",
                     permanent: true,
+                    noPersist: true,
                     onClick() {
                         SettingsRouter.open("VencordUpdater");
                     }
@@ -94,7 +119,7 @@ async function init() {
 
 init();
 
-if (!IS_WEB && Settings.winNativeTitleBar && navigator.platform.toLowerCase().startsWith("win")) {
+if (IS_DISCORD_DESKTOP && Settings.winNativeTitleBar && navigator.platform.toLowerCase().startsWith("win")) {
     document.addEventListener("DOMContentLoaded", () => {
         document.head.append(Object.assign(document.createElement("style"), {
             id: "vencord-native-titlebar-style",

src/api/Badges.ts

@@ -29,11 +29,12 @@ export enum BadgePosition {
 
 export interface ProfileBadge {
     /** The tooltip to show on hover. Required for image badges */
-    tooltip?: string;
+    description?: string;
     /** Custom component for the badge (tooltip not included) */
     component?: ComponentType<ProfileBadge & BadgeUserArgs>;
     /** The custom image to use */
     image?: string;
+    link?: string;
     /** Action to perform when you click the badge */
     onClick?(): void;
     /** Should the user display this badge? */
@@ -69,17 +70,19 @@ export function removeBadge(badge: ProfileBadge) {
  * Inject badges into the profile badges array.
  * You probably don't need to use this.
  */
-export function inject(badgeArray: ProfileBadge[], args: BadgeUserArgs) {
+export function _getBadges(args: BadgeUserArgs) {
+    const badges = [] as ProfileBadge[];
     for (const badge of Badges) {
         if (!badge.shouldShow || badge.shouldShow(args)) {
             badge.position === BadgePosition.START
-                ? badgeArray.unshift({ ...badge, ...args })
+                ? badges.unshift({ ...badge, ...args })
-                : badgeArray.push({ ...badge, ...args });
+                : badges.push({ ...badge, ...args });
         }
     }
-    (Plugins.BadgeAPI as any).addDonorBadge(badgeArray, args.user.id);
+    const donorBadge = (Plugins.BadgeAPI as any).getDonorBadge(args.user.id);
+    if (donorBadge) badges.unshift(donorBadge);
 
-    return badgeArray;
+    return badges;
 }
 
 export interface BadgeUserArgs {

src/api/Commands/index.ts

@@ -111,6 +111,7 @@ function registerSubCommands(cmd: Command, plugin: string) {
             ...o,
             type: ApplicationCommandType.CHAT_INPUT,
             name: `${cmd.name} ${o.name}`,
+            id: `${o.name}-${cmd.id}`,
             displayName: `${cmd.name} ${o.name}`,
             subCommandPath: [{
                 name: o.name,

src/api/ContextMenu.ts

@@ -19,17 +19,20 @@
 import Logger from "@utils/Logger";
 import type { ReactElement } from "react";
 
+type ContextMenuPatchCallbackReturn = (() => void) | void;
 /**
  * @param children The rendered context menu elements
  * @param args Any arguments passed into making the context menu, like the guild, channel, user or message for example
+ * @returns A callback which is only ran once used to modify the context menu elements (Use to avoid duplicates)
  */
-export type NavContextMenuPatchCallback = (children: Array<React.ReactElement>, ...args: Array<any>) => void;
+export type NavContextMenuPatchCallback = (children: Array<React.ReactElement>, ...args: Array<any>) => ContextMenuPatchCallbackReturn;
 /**
- * @param The navId of the context menu being patched
+ * @param navId The navId of the context menu being patched
  * @param children The rendered context menu elements
  * @param args Any arguments passed into making the context menu, like the guild, channel, user or message for example
+ * @returns A callback which is only ran once used to modify the context menu elements (Use to avoid duplicates)
  */
-export type GlobalContextMenuPatchCallback = (navId: string, children: Array<React.ReactElement>, ...args: Array<any>) => void;
+export type GlobalContextMenuPatchCallback = (navId: string, children: Array<React.ReactElement>, ...args: Array<any>) => ContextMenuPatchCallbackReturn;
 
 const ContextMenuLogger = new Logger("ContextMenu");
 
@@ -78,6 +81,7 @@ export function removeContextMenuPatch<T extends string | Array<string>>(navId:
 
 /**
  * Remove a global context menu patch
+ * @param patch The patch to be removed
  * @returns Wheter the patch was sucessfully removed
  */
 export function removeGlobalContextMenuPatch(patch: GlobalContextMenuPatchCallback): boolean {
@@ -87,12 +91,13 @@ export function removeGlobalContextMenuPatch(patch: GlobalContextMenuPatchCallba
 /**
  * A helper function for finding the children array of a group nested inside a context menu based on the id of one of its childs
  * @param id The id of the child
+ * @param children The context menu children
  */
-export function findGroupChildrenByChildId(id: string, children: Array<React.ReactElement>, itemsArray?: Array<React.ReactElement>): Array<React.ReactElement> | null {
+export function findGroupChildrenByChildId(id: string, children: Array<React.ReactElement>, _itemsArray?: Array<React.ReactElement>): Array<React.ReactElement> | null {
     for (const child of children) {
         if (child == null) continue;
 
-        if (child.props?.id === id) return itemsArray ?? null;
+        if (child.props?.id === id) return _itemsArray ?? null;
 
         let nextChildren = child.props?.children;
         if (nextChildren) {
@@ -118,6 +123,8 @@ interface ContextMenuProps {
     onClose: (callback: (...args: Array<any>) => any) => void;
 }
 
+const patchedMenus = new WeakSet();
+
 export function _patchContextMenu(props: ContextMenuProps) {
     props.contextMenuApiArguments ??= [];
     const contextMenuPatches = navPatches.get(props.navId);
@@ -127,7 +134,8 @@ export function _patchContextMenu(props: ContextMenuProps) {
     if (contextMenuPatches) {
         for (const patch of contextMenuPatches) {
             try {
-                patch(props.children, ...props.contextMenuApiArguments);
+                const callback = patch(props.children, ...props.contextMenuApiArguments);
+                if (!patchedMenus.has(props)) callback?.();
             } catch (err) {
                 ContextMenuLogger.error(`Patch for ${props.navId} errored,`, err);
             }
@@ -136,9 +144,12 @@ export function _patchContextMenu(props: ContextMenuProps) {
 
     for (const patch of globalPatches) {
         try {
-            patch(props.navId, props.children, ...props.contextMenuApiArguments);
+            const callback = patch(props.navId, props.children, ...props.contextMenuApiArguments);
+            if (!patchedMenus.has(props)) callback?.();
         } catch (err) {
             ContextMenuLogger.error("Global patch errored,", err);
         }
     }
+
+    patchedMenus.add(props);
 }

src/api/Notifications/NotificationComponent.tsx

@@ -20,6 +20,7 @@ import "./styles.css";
 
 import { useSettings } from "@api/settings";
 import ErrorBoundary from "@components/ErrorBoundary";
+import { classes } from "@utils/misc";
 import { React, useEffect, useMemo, useState, useStateFromStores, WindowStore } from "@webpack/common";
 
 import { NotificationData } from "./Notifications";
@@ -33,8 +34,10 @@ export default ErrorBoundary.wrap(function NotificationComponent({
     onClick,
     onClose,
     image,
-    permanent
+    permanent,
-}: NotificationData) {
+    className,
+    dismissOnClick
+}: NotificationData & { className?: string; }) {
     const { timeout, position } = useSettings(["notifications.timeout", "notifications.position"]).notifications;
     const hasFocus = useStateFromStores([WindowStore], () => WindowStore.isFocused());
 
@@ -61,11 +64,12 @@ export default ErrorBoundary.wrap(function NotificationComponent({
 
     return (
         <button
-            className="vc-notification-root"
+            className={classes("vc-notification-root", className)}
             style={position === "bottom-right" ? { bottom: "1rem" } : { top: "3rem" }}
             onClick={() => {
-                onClose!();
                 onClick?.();
+                if (dismissOnClick !== false)
+                    onClose!();
             }}
             onContextMenu={e => {
                 e.preventDefault();

src/api/Notifications/Notifications.tsx

@@ -23,6 +23,7 @@ import type { ReactNode } from "react";
 import type { Root } from "react-dom/client";
 
 import NotificationComponent from "./NotificationComponent";
+import { persistNotification } from "./notificationLog";
 
 const NotificationQueue = new Queue();
 
@@ -56,6 +57,10 @@ export interface NotificationData {
     color?: string;
     /** Whether this notification should not have a timeout */
     permanent?: boolean;
+    /** Whether this notification should not be persisted in the Notification Log */
+    noPersist?: boolean;
+    /** Whether this notification should be dismissed when clicked (defaults to true) */
+    dismissOnClick?: boolean;
 }
 
 function _showNotification(notification: NotificationData, id: number) {
@@ -72,6 +77,8 @@ function _showNotification(notification: NotificationData, id: number) {
 }
 
 function shouldBeNative() {
+    if (typeof Notification === "undefined") return false;
+
     const { useNative } = Settings.notifications;
     if (useNative === "always") return true;
     if (useNative === "not-focused") return !document.hasFocus();
@@ -86,6 +93,8 @@ export async function requestPermission() {
 }
 
 export async function showNotification(data: NotificationData) {
+    persistNotification(data);
+
     if (shouldBeNative() && await requestPermission()) {
         const { title, body, icon, image, onClick = null, onClose = null } = data;
         const n = new Notification(title, {

src/api/Notifications/notificationLog.tsx

@@ -0,0 +1,203 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import * as DataStore from "@api/DataStore";
+import { Settings } from "@api/settings";
+import { classNameFactory } from "@api/Styles";
+import { useAwaiter } from "@utils/misc";
+import { closeModal, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
+import { Alerts, Button, Forms, moment, React, Text, Timestamp, useEffect, useReducer, useState } from "@webpack/common";
+import { nanoid } from "nanoid";
+import type { DispatchWithoutAction } from "react";
+
+import NotificationComponent from "./NotificationComponent";
+import type { NotificationData } from "./Notifications";
+
+interface PersistentNotificationData extends Pick<NotificationData, "title" | "body" | "image" | "icon" | "color"> {
+    timestamp: number;
+    id: string;
+}
+
+const KEY = "notification-log";
+
+const getLog = async () => {
+    const log = await DataStore.get(KEY) as PersistentNotificationData[] | undefined;
+    return log ?? [];
+};
+
+const cl = classNameFactory("vc-notification-log-");
+const signals = new Set<DispatchWithoutAction>();
+
+export async function persistNotification(notification: NotificationData) {
+    if (notification.noPersist) return;
+
+    const limit = Settings.notifications.logLimit;
+    if (limit === 0) return;
+
+    await DataStore.update(KEY, (old: PersistentNotificationData[] | undefined) => {
+        const log = old ?? [];
+
+        // Omit stuff we don't need
+        const {
+            onClick, onClose, richBody, permanent, noPersist, dismissOnClick,
+            ...pureNotification
+        } = notification;
+
+        log.unshift({
+            ...pureNotification,
+            timestamp: Date.now(),
+            id: nanoid()
+        });
+
+        if (log.length > limit && limit !== 200)
+            log.length = limit;
+
+        return log;
+    });
+
+    signals.forEach(x => x());
+}
+
+export async function deleteNotification(timestamp: number) {
+    const log = await getLog();
+    const index = log.findIndex(x => x.timestamp === timestamp);
+    if (index === -1) return;
+
+    log.splice(index, 1);
+    await DataStore.set(KEY, log);
+    signals.forEach(x => x());
+}
+
+export function useLogs() {
+    const [signal, setSignal] = useReducer(x => x + 1, 0);
+
+    useEffect(() => {
+        signals.add(setSignal);
+        return () => void signals.delete(setSignal);
+    }, []);
+
+    const [log, _, pending] = useAwaiter(getLog, {
+        fallbackValue: [],
+        deps: [signal]
+    });
+
+    return [log, pending] as const;
+}
+
+function NotificationEntry({ data }: { data: PersistentNotificationData; }) {
+    const [removing, setRemoving] = useState(false);
+    const ref = React.useRef<HTMLDivElement>(null);
+
+    useEffect(() => {
+        const div = ref.current!;
+
+        const setHeight = () => {
+            if (div.clientHeight === 0) return requestAnimationFrame(setHeight);
+            div.style.height = `${div.clientHeight}px`;
+        };
+
+        setHeight();
+    }, []);
+
+    return (
+        <div className={cl("wrapper", { removing })} ref={ref}>
+            <NotificationComponent
+                {...data}
+                permanent={true}
+                dismissOnClick={false}
+                onClose={() => {
+                    if (removing) return;
+                    setRemoving(true);
+
+                    setTimeout(() => deleteNotification(data.timestamp), 200);
+                }}
+                richBody={
+                    <div className={cl("body")}>
+                        {data.body}
+                        <Timestamp timestamp={moment(data.timestamp)} className={cl("timestamp")} />
+                    </div>
+                }
+            />
+        </div>
+    );
+}
+
+export function NotificationLog({ log, pending }: { log: PersistentNotificationData[], pending: boolean; }) {
+    if (!log.length && !pending)
+        return (
+            <div className={cl("container")}>
+                <div className={cl("empty")} />
+                <Forms.FormText style={{ textAlign: "center" }}>
+                    No notifications yet
+                </Forms.FormText>
+            </div>
+        );
+
+    return (
+        <div className={cl("container")}>
+            {log.map(n => <NotificationEntry data={n} key={n.id} />)}
+        </div>
+    );
+}
+
+function LogModal({ modalProps, close }: { modalProps: ModalProps; close(): void; }) {
+    const [log, pending] = useLogs();
+
+    return (
+        <ModalRoot {...modalProps} size={ModalSize.LARGE}>
+            <ModalHeader>
+                <Text variant="heading-lg/semibold" style={{ flexGrow: 1 }}>Notification Log</Text>
+                <ModalCloseButton onClick={close} />
+            </ModalHeader>
+
+            <ModalContent>
+                <NotificationLog log={log} pending={pending} />
+            </ModalContent>
+
+            <ModalFooter>
+                <Button
+                    disabled={log.length === 0}
+                    onClick={() => {
+                        Alerts.show({
+                            title: "Are you sure?",
+                            body: `This will permanently remove ${log.length} notification${log.length === 1 ? "" : "s"}. This action cannot be undone.`,
+                            async onConfirm() {
+                                await DataStore.set(KEY, []);
+                                signals.forEach(x => x());
+                            },
+                            confirmText: "Do it!",
+                            confirmColor: "vc-notification-log-danger-btn",
+                            cancelText: "Nevermind"
+                        });
+                    }}
+                >
+                    Clear Notification Log
+                </Button>
+            </ModalFooter>
+        </ModalRoot>
+    );
+}
+
+export function openNotificationLogModal() {
+    const key = openModal(modalProps => (
+        <LogModal
+            modalProps={modalProps}
+            close={() => closeModal(key)}
+        />
+    ));
+}

src/api/Notifications/styles.css

@@ -3,16 +3,20 @@
     all: unset;
     display: flex;
     flex-direction: column;
-    width: 25vw;
-    min-height: 10vh;
     color: var(--text-normal);
     background-color: var(--background-secondary-alt);
-    position: absolute;
-    z-index: 2147483647;
-    right: 1rem;
     border-radius: 6px;
     overflow: hidden;
     cursor: pointer;
+    width: 100%;
+}
+
+.vc-notification-root:not(.vc-notification-log-wrapper > .vc-notification-root) {
+    position: absolute;
+    z-index: 2147483647;
+    right: 1rem;
+    width: 25vw;
+    min-height: 10vh;
 }
 
 .vc-notification {
@@ -72,3 +76,47 @@
 .vc-notification-img {
     width: 100%;
 }
+
+.vc-notification-log-empty {
+    height: 218px;
+    background: url("/assets/b36de980b174d7b798c89f35c116e5c6.svg") center no-repeat;
+    margin-bottom: 40px;
+}
+
+.vc-notification-log-container {
+    display: flex;
+    flex-direction: column;
+    padding: 1em;
+    overflow: hidden;
+}
+
+.vc-notification-log-wrapper {
+    transition: 200ms ease;
+    transition-property: height, opacity;
+}
+
+.vc-notification-log-wrapper:not(:last-child) {
+    margin-bottom: 1em;
+}
+
+.vc-notification-log-removing {
+    height: 0 !important;
+    opacity: 0;
+    margin-bottom: 1em;
+}
+
+.vc-notification-log-body {
+    display: flex;
+    flex-direction: column;
+}
+
+.vc-notification-log-timestamp {
+    margin-left: auto;
+    font-size: 0.8em;
+    font-weight: lighter;
+}
+
+.vc-notification-log-danger-btn {
+    color: var(--white-500);
+    background-color: var(--button-danger-background);
+}

src/api/SettingsStore.ts

@@ -0,0 +1,69 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import Logger from "@utils/Logger";
+import { proxyLazy } from "@utils/proxyLazy";
+import { findModuleId, wreq } from "@webpack";
+
+import { Settings } from "./settings";
+
+interface Setting<T> {
+    /**
+     * Get the setting value
+     */
+    getSetting(): T;
+    /**
+     * Update the setting value
+     * @param value The new value
+     */
+    updateSetting(value: T | ((old: T) => T)): Promise<void>;
+    /**
+     * React hook for automatically updating components when the setting is updated
+     */
+    useSetting(): T;
+    settingsStoreApiGroup: string;
+    settingsStoreApiName: string;
+}
+
+const SettingsStores: Array<Setting<any>> | undefined = proxyLazy(() => {
+    const modId = findModuleId('"textAndImages","renderSpoilers"');
+    if (modId == null) return new Logger("SettingsStoreAPI").error("Didn't find stores module.");
+
+    const mod = wreq(modId);
+    if (mod == null) return;
+
+    return Object.values(mod).filter((s: any) => s?.settingsStoreApiGroup) as any;
+});
+
+/**
+ * Get the store for a setting
+ * @param group The setting group
+ * @param name The name of the setting
+ */
+export function getSettingStore<T = any>(group: string, name: string): Setting<T> | undefined {
+    if (!Settings.plugins.SettingsStoreAPI.enabled) throw new Error("Cannot use SettingsStoreAPI without setting as dependency.");
+
+    return SettingsStores?.find(s => s?.settingsStoreApiGroup === group && s?.settingsStoreApiName === name);
+}
+
+/**
+ * getSettingStore but lazy
+ */
+export function getSettingStoreLazy<T = any>(group: string, name: string) {
+    return proxyLazy(() => getSettingStore<T>(group, name));
+}

src/api/index.ts

@@ -28,6 +28,7 @@ import * as $MessagePopover from "./MessagePopover";
 import * as $Notices from "./Notices";
 import * as $Notifications from "./Notifications";
 import * as $ServerList from "./ServerList";
+import * as $SettingsStore from "./SettingsStore";
 import * as $Styles from "./Styles";
 
 /**
@@ -85,6 +86,10 @@ export const MessageDecorations = $MessageDecorations;
  * An API allowing you to add components to member list users, in both DM's and servers
  */
 export const MemberListDecorators = $MemberListDecorators;
+/**
+ * An API allowing you to read, manipulate and automatically update components based on Discord settings
+ */
+export const SettingsStore = $SettingsStore;
 /**
  * An API allowing you to dynamically load styles
  * a

src/api/settings.ts

@@ -16,9 +16,12 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import { debounce } from "@utils/debounce";
 import IpcEvents from "@utils/IpcEvents";
+import { localStorage } from "@utils/localStorage";
 import Logger from "@utils/Logger";
 import { mergeDefaults } from "@utils/misc";
+import { putCloudSettings } from "@utils/settingsSync";
 import { DefinedSettings, OptionType, SettingsChecks, SettingsDefinition } from "@utils/types";
 import { React } from "@webpack/common";
 
@@ -35,6 +38,8 @@ export interface Settings {
     frameless: boolean;
     transparent: boolean;
     winCtrlQ: boolean;
+    macosTranslucency: boolean;
+    disableMinSize: boolean;
     winNativeTitleBar: boolean;
     plugins: {
         [plugin: string]: {
@@ -47,6 +52,14 @@ export interface Settings {
         timeout: number;
         position: "top-right" | "bottom-right";
         useNative: "always" | "never" | "not-focused";
+        logLimit: number;
+    };
+
+    cloud: {
+        authenticated: boolean;
+        url: string;
+        settingsSync: boolean;
+        settingsSyncVersion: number;
     };
 }
 
@@ -60,13 +73,23 @@ const DefaultSettings: Settings = {
     frameless: false,
     transparent: false,
     winCtrlQ: false,
+    macosTranslucency: false,
+    disableMinSize: false,
     winNativeTitleBar: false,
     plugins: {},
 
     notifications: {
         timeout: 5000,
         position: "bottom-right",
-        useNative: "not-focused"
+        useNative: "not-focused",
+        logLimit: 50
+    },
+
+    cloud: {
+        authenticated: false,
+        url: "https://api.vencord.dev/",
+        settingsSync: false,
+        settingsSyncVersion: 0
     }
 };
 
@@ -78,6 +101,13 @@ try {
     logger.error("An error occurred while loading the settings. Corrupt settings file?\n", err);
 }
 
+const saveSettingsOnFrequentAction = debounce(async () => {
+    if (Settings.cloud.settingsSync && Settings.cloud.authenticated) {
+        await putCloudSettings();
+        delete localStorage.Vencord_settingsDirty;
+    }
+}, 60_000);
+
 type SubscriptionCallback = ((newValue: any, path: string) => void) & { _path?: string; };
 const subscriptions = new Set<SubscriptionCallback>();
 
@@ -133,12 +163,16 @@ function makeProxy(settings: any, root = settings, path = ""): Settings {
             target[p] = v;
             // Call any listeners that are listening to a setting of this path
             const setPath = `${path}${path && "."}${p}`;
+            delete proxyCache[setPath];
             for (const subscription of subscriptions) {
                 if (!subscription._path || subscription._path === setPath) {
                     subscription(v, setPath);
                 }
             }
             // And don't forget to persist the settings!
+            PlainSettings.cloud.settingsSyncVersion = Date.now();
+            localStorage.Vencord_settingsDirty = true;
+            saveSettingsOnFrequentAction();
             VencordNative.ipc.invoke(IpcEvents.SET_SETTINGS, JSON.stringify(root, null, 4));
             return true;
         }

src/components/PatchHelper.tsx

@@ -186,9 +186,10 @@ function ReplacementInput({ replacement, setReplacement, replacementError }) {
                 error={error ?? replacementError}
             />
             {!isFunc && (
-                <>
+                <div className="vc-text-selectable">
                     <Forms.FormTitle>Cheat Sheet</Forms.FormTitle>
                     {Object.entries({
+                        "\\i": "Special regex escape sequence that matches identifiers (varnames, classnames, etc.)",
                         "$$": "Insert a $",
                         "$&": "Insert the entire match",
                         "$`\u200b": "Insert the substring before the match",
@@ -200,7 +201,7 @@ function ReplacementInput({ replacement, setReplacement, replacementError }) {
                             {Parser.parse("`" + placeholder + "`")}: {desc}
                         </Forms.FormText>
                     ))}
-                </>
+                </div>
             )}
 
             <Switch

src/components/PluginSettings/PluginModal.tsx

@@ -20,7 +20,8 @@ import { generateId } from "@api/Commands";
 import { useSettings } from "@api/settings";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
-import { LazyComponent } from "@utils/misc";
+import { Margins } from "@utils/margins";
+import { classes, LazyComponent } from "@utils/misc";
 import { ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize } from "@utils/modal";
 import { proxyLazy } from "@utils/proxyLazy";
 import { OptionType, Plugin } from "@utils/types";
@@ -174,7 +175,7 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
     }
 
     return (
-        <ModalRoot transitionState={transitionState} size={ModalSize.MEDIUM}>
+        <ModalRoot transitionState={transitionState} size={ModalSize.MEDIUM} className="vc-text-selectable">
             <ModalHeader separator={false}>
                 <Text variant="heading-lg/semibold" style={{ flexGrow: 1 }}>{plugin.name}</Text>
                 <ModalCloseButton onClick={onClose} />
@@ -198,7 +199,7 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
                     </div>
                 </Forms.FormSection>
                 {!!plugin.settingsAboutComponent && (
-                    <div style={{ marginBottom: 8 }}>
+                    <div className={classes(Margins.bottom8, "vc-text-selectable")}>
                         <Forms.FormSection>
                             <ErrorBoundary message="An error occurred while rendering this plugin's custom InfoComponent">
                                 <plugin.settingsAboutComponent tempSettings={tempSettings} />

src/components/PluginSettings/index.tsx

@@ -46,6 +46,7 @@ const cl = classNameFactory("vc-plugins-");
 const logger = new Logger("PluginSettings", "#a6d189");
 
 const InputStyles = findByPropsLazy("inputDefault", "inputWrapper");
+const ButtonClasses = findByPropsLazy("button", "disabled", "enabled");
 
 const CogWheel = LazyComponent(() => findByCode("18.564C15.797 19.099 14.932 19.498 14 19.738V22H10V19.738C9.069"));
 const InfoIcon = LazyComponent(() => findByCode("4.4408921e-16 C4.4771525,-1.77635684e-15 4.4408921e-16"));
@@ -154,7 +155,7 @@ function PluginCard({ plugin, disabled, onRestartNeeded, onMouseEnter, onMouseLe
                 <Text variant="text-md/bold" className={cl("name")}>
                     {plugin.name}{isNew && <Badge text="NEW" color="#ED4245" />}
                 </Text>
-                <button role="switch" onClick={() => openModal()} className={classes("button-12Fmur", cl("info-button"))}>
+                <button role="switch" onClick={() => openModal()} className={classes(ButtonClasses.button, cl("info-button"))}>
                     {plugin.options
                         ? <CogWheel />
                         : <InfoIcon width="24" height="24" />}

src/components/VencordSettings/BackupRestoreTab.tsx

@@ -41,6 +41,7 @@ function BackupRestoreTab() {
                 Settings Export contains:
                 <ul>
                     <li>&mdash; Custom QuickCSS</li>
+                    <li>&mdash; Theme Links</li>
                     <li>&mdash; Plugin Settings</li>
                 </ul>
             </Text>

src/components/VencordSettings/CloudTab.tsx

@@ -0,0 +1,164 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { showNotification } from "@api/Notifications";
+import { Settings, useSettings } from "@api/settings";
+import { CheckedTextInput } from "@components/CheckedTextInput";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Link } from "@components/Link";
+import { authorizeCloud, cloudLogger, deauthorizeCloud, getCloudAuth, getCloudUrl } from "@utils/cloud";
+import { Margins } from "@utils/margins";
+import { deleteCloudSettings, getCloudSettings, putCloudSettings } from "@utils/settingsSync";
+import { Alerts, Button, Forms, Switch, Tooltip } from "@webpack/common";
+
+function validateUrl(url: string) {
+    try {
+        new URL(url);
+        return true;
+    } catch {
+        return "Invalid URL";
+    }
+}
+
+async function eraseAllData() {
+    const res = await fetch(new URL("/v1/", getCloudUrl()), {
+        method: "DELETE",
+        headers: new Headers({
+            Authorization: await getCloudAuth()
+        })
+    });
+
+    if (!res.ok) {
+        cloudLogger.error(`Failed to erase data, API returned ${res.status}`);
+        showNotification({
+            title: "Cloud Integrations",
+            body: `Could not erase all data (API returned ${res.status}), please contact support.`,
+            color: "var(--red-360)"
+        });
+        return;
+    }
+
+    Settings.cloud.authenticated = false;
+    await deauthorizeCloud();
+
+    showNotification({
+        title: "Cloud Integrations",
+        body: "Successfully erased all data.",
+        color: "var(--green-360)"
+    });
+}
+
+function SettingsSyncSection() {
+    const { cloud } = useSettings(["cloud.authenticated", "cloud.settingsSync"]);
+    const sectionEnabled = cloud.authenticated && cloud.settingsSync;
+
+    return (
+        <Forms.FormSection title="Settings Sync" className={Margins.top16}>
+            <Forms.FormText variant="text-md/normal" className={Margins.bottom20}>
+                Synchronize your settings to the cloud. This allows easy synchronization across multiple devices with
+                minimal effort.
+            </Forms.FormText>
+            <Switch
+                key="cloud-sync"
+                disabled={!cloud.authenticated}
+                value={cloud.settingsSync}
+                onChange={v => { cloud.settingsSync = v; }}
+            >
+                Settings Sync
+            </Switch>
+            <div className="vc-cloud-settings-sync-grid">
+                <Button
+                    size={Button.Sizes.SMALL}
+                    disabled={!sectionEnabled}
+                    onClick={() => putCloudSettings()}
+                >Sync to Cloud</Button>
+                <Tooltip text="This will overwrite your local settings with the ones on the cloud. Use wisely!">
+                    {({ onMouseLeave, onMouseEnter }) => (
+                        <Button
+                            onMouseLeave={onMouseLeave}
+                            onMouseEnter={onMouseEnter}
+                            size={Button.Sizes.SMALL}
+                            color={Button.Colors.RED}
+                            disabled={!sectionEnabled}
+                            onClick={() => getCloudSettings(true, true)}
+                        >Sync from Cloud</Button>
+                    )}
+                </Tooltip>
+                <Button
+                    size={Button.Sizes.SMALL}
+                    color={Button.Colors.RED}
+                    disabled={!sectionEnabled}
+                    onClick={() => deleteCloudSettings()}
+                >Delete Cloud Settings</Button>
+            </div>
+        </Forms.FormSection>
+    );
+}
+
+function CloudTab() {
+    const settings = useSettings(["cloud.authenticated", "cloud.url"]);
+
+    return (
+        <>
+            <Forms.FormSection title="Cloud Settings" className={Margins.top16}>
+                <Forms.FormText variant="text-md/normal" className={Margins.bottom20}>
+                    Vencord comes with a cloud integration that adds goodies like settings sync across devices.
+                    It <Link href="https://vencord.dev/cloud/privacy">respects your privacy</Link>, and
+                    the <Link href="https://github.com/Vencord/Backend">source code</Link> is AGPL 3.0 licensed so you
+                    can host it yourself.
+                </Forms.FormText>
+                <Switch
+                    key="backend"
+                    value={settings.cloud.authenticated}
+                    onChange={v => { v && authorizeCloud(); if (!v) settings.cloud.authenticated = v; }}
+                    note="This will request authorization if you have not yet set up cloud integrations."
+                >
+                    Enable Cloud Integrations
+                </Switch>
+                <Forms.FormTitle tag="h5">Backend URL</Forms.FormTitle>
+                <Forms.FormText className={Margins.bottom8}>
+                    Which backend to use when using cloud integrations.
+                </Forms.FormText>
+                <CheckedTextInput
+                    key="backendUrl"
+                    value={settings.cloud.url}
+                    onChange={v => { settings.cloud.url = v; settings.cloud.authenticated = false; deauthorizeCloud(); }}
+                    validate={validateUrl}
+                />
+                <Button
+                    className={Margins.top8}
+                    size={Button.Sizes.MEDIUM}
+                    color={Button.Colors.RED}
+                    disabled={!settings.cloud.authenticated}
+                    onClick={() => Alerts.show({
+                        title: "Are you sure?",
+                        body: "Once your data is erased, we cannot recover it. There's no going back!",
+                        onConfirm: eraseAllData,
+                        confirmText: "Erase it!",
+                        confirmColor: "vc-cloud-erase-data-danger-btn",
+                        cancelText: "Nevermind"
+                    })}
+                >Erase All Data</Button>
+                <Forms.FormDivider className={Margins.top16} />
+            </Forms.FormSection >
+            <SettingsSyncSection />
+        </>
+    );
+}
+
+export default ErrorBoundary.wrap(CloudTab);

src/components/VencordSettings/ThemesTab.tsx

@@ -90,8 +90,8 @@ export default ErrorBoundary.wrap(function () {
 
     return (
         <>
-            <Card className="vc-settings-card">
+            <Card className="vc-settings-card vc-text-selectable">
-                <Forms.FormTitle tag="h5">Paste links to .css / .theme.css files here</Forms.FormTitle>
+                <Forms.FormTitle tag="h5">Paste links to .theme.css files here</Forms.FormTitle>
                 <Forms.FormText>One link per line</Forms.FormText>
                 <Forms.FormText>Make sure to use the raw links or github.io links!</Forms.FormText>
                 <Forms.FormDivider className={Margins.top8 + " " + Margins.bottom8} />
@@ -103,7 +103,7 @@ export default ErrorBoundary.wrap(function () {
                     <Link href="https://github.com/search?q=discord+theme">GitHub</Link>
                 </div>
                 <Forms.FormText>If using the BD site, click on "Source" somewhere below the Download button</Forms.FormText>
-                <Forms.FormText>In the GitHub repository of your theme, find X.theme.css / X.css, click on it, then click the "Raw" button</Forms.FormText>
+                <Forms.FormText>In the GitHub repository of your theme, find X.theme.css, click on it, then click the "Raw" button</Forms.FormText>
                 <Forms.FormText>
                     If the theme has configuration that requires you to edit the file:
                     <ul>
@@ -117,7 +117,7 @@ export default ErrorBoundary.wrap(function () {
             <Forms.FormTitle tag="h5">Themes</Forms.FormTitle>
             <TextArea
                 value={themeText}
-                onChange={e => setThemeText(e.currentTarget.value)}
+                onChange={setThemeText}
                 className={`${TextAreaProps.textarea} vc-settings-theme-links`}
                 placeholder="Theme Links"
                 spellCheck={false}

src/components/VencordSettings/Updater.tsx

@@ -24,6 +24,7 @@ import { handleComponentFailed } from "@components/handleComponentFailed";
 import { Link } from "@components/Link";
 import { Margins } from "@utils/margins";
 import { classes, useAwaiter } from "@utils/misc";
+import { relaunch } from "@utils/native";
 import { changes, checkForUpdates, getRepo, isNewer, rebuild, update, updateError, UpdateLogger } from "@utils/updater";
 import { Alerts, Button, Card, Forms, Parser, React, Switch, Toasts } from "@webpack/common";
 
@@ -124,7 +125,7 @@ function Updatable(props: CommonProps) {
                     onClick={withDispatcher(setIsUpdating, async () => {
                         if (await update()) {
                             setUpdates([]);
-                            const needFullRestart = await rebuild();
+                            await rebuild();
                             await new Promise<void>(r => {
                                 Alerts.show({
                                     title: "Update Success!",
@@ -132,10 +133,7 @@ function Updatable(props: CommonProps) {
                                     confirmText: "Restart",
                                     cancelText: "Not now!",
                                     onConfirm() {
-                                        if (needFullRestart)
+                                        relaunch();
-                                            window.DiscordNative.app.relaunch();
-                                        else
-                                            location.reload();
                                         r();
                                     },
                                     onCancel: r
@@ -228,11 +226,19 @@ function Updater() {
 
             <Forms.FormTitle tag="h5">Repo</Forms.FormTitle>
 
-            <Forms.FormText>{repoPending ? repo : err ? "Failed to retrieve - check console" : (
+            <Forms.FormText className="vc-text-selectable">
+                {repoPending
+                    ? repo
+                    : err
+                        ? "Failed to retrieve - check console"
+                        : (
                             <Link href={repo}>
                                 {repo.split("/").slice(-2).join("/")}
                             </Link>
-            )} (<HashLink hash={gitHash} repo={repo} disabled={repoPending} />)</Forms.FormText>
+                        )
+                }
+                {" "}(<HashLink hash={gitHash} repo={repo} disabled={repoPending} />)
+            </Forms.FormText>
 
             <Forms.FormDivider className={Margins.top8 + " " + Margins.bottom8} />
 

src/components/VencordSettings/VencordTab.tsx

@@ -17,7 +17,8 @@
 */
 
 
-import { useSettings } from "@api/settings";
+import { openNotificationLogModal } from "@api/Notifications/notificationLog";
+import { Settings, useSettings } from "@api/settings";
 import { classNameFactory } from "@api/Styles";
 import DonateButton from "@components/DonateButton";
 import ErrorBoundary from "@components/ErrorBoundary";
@@ -25,6 +26,7 @@ import { ErrorCard } from "@components/ErrorCard";
 import IpcEvents from "@utils/IpcEvents";
 import { Margins } from "@utils/margins";
 import { identity, useAwaiter } from "@utils/misc";
+import { relaunch, showItemInFolder } from "@utils/native";
 import { Button, Card, Forms, React, Select, Slider, Switch } from "@webpack/common";
 
 const cl = classNameFactory("vc-settings-");
@@ -41,11 +43,11 @@ function VencordSettings() {
         fallbackValue: "Loading..."
     });
     const settings = useSettings();
-    const notifSettings = settings.notifications;
 
     const donateImage = React.useMemo(() => Math.random() > 0.5 ? DEFAULT_DONATE_IMAGE : SHIGGY_DONATE_IMAGE, []);
 
     const isWindows = navigator.platform.toLowerCase().startsWith("win");
+    const isMac = navigator.platform.toLowerCase().startsWith("mac");
 
     const Switches: Array<false | {
         key: KeysOfType<typeof settings, boolean>;
@@ -63,7 +65,7 @@ function VencordSettings() {
                 title: "Enable React Developer Tools",
                 note: "Requires a full restart"
             },
-            !IS_WEB && (!isWindows ? {
+            !IS_WEB && (!IS_DISCORD_DESKTOP || !isWindows ? {
                 key: "frameless",
                 title: "Disable the window frame",
                 note: "Requires a full restart"
@@ -72,7 +74,7 @@ function VencordSettings() {
                 title: "Use Windows' native title bar instead of Discord's custom one",
                 note: "Requires a full restart"
             }),
-            !IS_WEB && {
+            !IS_WEB && false /* This causes electron to freeze / white screen for some people */ && {
                 key: "transparent",
                 title: "Enable window transparency",
                 note: "Requires a full restart"
@@ -81,6 +83,16 @@ function VencordSettings() {
                 key: "winCtrlQ",
                 title: "Register Ctrl+Q as shortcut to close Discord (Alternative to Alt+F4)",
                 note: "Requires a full restart"
+            },
+            IS_DISCORD_DESKTOP && {
+                key: "disableMinSize",
+                title: "Disable minimum window size",
+                note: "Requires a full restart"
+            },
+            IS_DISCORD_DESKTOP && isMac && {
+                key: "macosTranslucency",
+                title: "Enable translucent window",
+                note: "Requires a full restart"
             }
         ];
 
@@ -99,7 +111,7 @@ function VencordSettings() {
                     ) : (
                         <React.Fragment>
                             <Button
-                                onClick={() => window.DiscordNative.app.relaunch()}
+                                onClick={relaunch}
                                 size={Button.Sizes.SMALL}>
                                 Restart Client
                             </Button>
@@ -110,7 +122,7 @@ function VencordSettings() {
                                 Open QuickCSS File
                             </Button>
                             <Button
-                                onClick={() => window.DiscordNative.fileManager.showItemInFolder(settingsDir)}
+                                onClick={() => showItemInFolder(settingsDir)}
                                 size={Button.Sizes.SMALL}
                                 disabled={settingsDirPending}>
                                 Open Settings Folder
@@ -145,8 +157,16 @@ function VencordSettings() {
             </Forms.FormSection>
 
 
+            {typeof Notification !== "undefined" && <NotificationSection settings={settings.notifications} />}
+        </React.Fragment>
+    );
+}
+
+function NotificationSection({ settings }: { settings: typeof Settings["notifications"]; }) {
+    return (
+        <>
             <Forms.FormTitle tag="h5">Notification Style</Forms.FormTitle>
-            {notifSettings.useNative !== "never" && Notification.permission === "denied" && (
+            {settings.useNative !== "never" && Notification?.permission === "denied" && (
                 <ErrorCard style={{ padding: "1em" }} className={Margins.bottom8}>
                     <Forms.FormTitle tag="h5">Desktop Notification Permission denied</Forms.FormTitle>
                     <Forms.FormText>You have denied Notification Permissions. Thus, Desktop notifications will not work!</Forms.FormText>
@@ -165,44 +185,66 @@ function VencordSettings() {
                     { label: "Only use Desktop notifications when Discord is not focused", value: "not-focused", default: true },
                     { label: "Always use Desktop notifications", value: "always" },
                     { label: "Always use Vencord notifications", value: "never" },
-                ]satisfies Array<{ value: typeof settings["notifications"]["useNative"]; } & Record<string, any>>}
+                ] satisfies Array<{ value: typeof settings["useNative"]; } & Record<string, any>>}
                 closeOnSelect={true}
-                select={v => notifSettings.useNative = v}
+                select={v => settings.useNative = v}
-                isSelected={v => v === notifSettings.useNative}
+                isSelected={v => v === settings.useNative}
                 serialize={identity}
             />
 
             <Forms.FormTitle tag="h5" className={Margins.top16 + " " + Margins.bottom8}>Notification Position</Forms.FormTitle>
             <Select
-                isDisabled={notifSettings.useNative === "always"}
+                isDisabled={settings.useNative === "always"}
                 placeholder="Notification Position"
                 options={[
                     { label: "Bottom Right", value: "bottom-right", default: true },
                     { label: "Top Right", value: "top-right" },
-                ]satisfies Array<{ value: typeof settings["notifications"]["position"]; } & Record<string, any>>}
+                ] satisfies Array<{ value: typeof settings["position"]; } & Record<string, any>>}
-                select={v => notifSettings.position = v}
+                select={v => settings.position = v}
-                isSelected={v => v === notifSettings.position}
+                isSelected={v => v === settings.position}
                 serialize={identity}
             />
 
             <Forms.FormTitle tag="h5" className={Margins.top16 + " " + Margins.bottom8}>Notification Timeout</Forms.FormTitle>
             <Forms.FormText className={Margins.bottom16}>Set to 0s to never automatically time out</Forms.FormText>
             <Slider
-                disabled={notifSettings.useNative === "always"}
+                disabled={settings.useNative === "always"}
                 markers={[0, 1000, 2500, 5000, 10_000, 20_000]}
                 minValue={0}
                 maxValue={20_000}
-                initialValue={notifSettings.timeout}
+                initialValue={settings.timeout}
-                onValueChange={v => notifSettings.timeout = v}
+                onValueChange={v => settings.timeout = v}
                 onValueRender={v => (v / 1000).toFixed(2) + "s"}
                 onMarkerRender={v => (v / 1000) + "s"}
                 stickToMarkers={false}
             />
-        </React.Fragment>
+
+            <Forms.FormTitle tag="h5" className={Margins.top16 + " " + Margins.bottom8}>Notification Log Limit</Forms.FormTitle>
+            <Forms.FormText className={Margins.bottom16}>
+                The amount of notifications to save in the log until old ones are removed.
+                Set to <code>0</code> to disable Notification log and <code>∞</code> to never automatically remove old Notifications
+            </Forms.FormText>
+            <Slider
+                markers={[0, 25, 50, 75, 100, 200]}
+                minValue={0}
+                maxValue={200}
+                stickToMarkers={true}
+                initialValue={settings.logLimit}
+                onValueChange={v => settings.logLimit = v}
+                onValueRender={v => v === 200 ? "∞" : v}
+                onMarkerRender={v => v === 200 ? "∞" : v}
+            />
+
+            <Button
+                onClick={openNotificationLogModal}
+                disabled={settings.logLimit === 0}
+            >
+                Open Notification Log
+            </Button>
+        </>
     );
 }
 
-
 interface DonateCardProps {
     image: string;
 }

src/components/VencordSettings/index.tsx

@@ -21,10 +21,11 @@ import "./settingsStyles.css";
 import { classNameFactory } from "@api/Styles";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { handleComponentFailed } from "@components/handleComponentFailed";
-import { findByCodeLazy } from "@webpack";
+import { isMobile } from "@utils/misc";
-import { Forms, SettingsRouter, Text } from "@webpack/common";
+import { Forms, SettingsRouter, TabBar, Text } from "@webpack/common";
 
 import BackupRestoreTab from "./BackupRestoreTab";
+import CloudTab from "./CloudTab";
 import PluginsTab from "./PluginsTab";
 import ThemesTab from "./ThemesTab";
 import Updater from "./Updater";
@@ -32,8 +33,6 @@ import VencordSettings from "./VencordTab";
 
 const cl = classNameFactory("vc-settings-");
 
-const TabBar = findByCodeLazy('[role="tab"][aria-disabled="false"]');
-
 interface SettingsProps {
     tab: string;
 }
@@ -48,7 +47,8 @@ const SettingsTabs: Record<string, SettingsTab> = {
     VencordPlugins: { name: "Plugins", component: () => <PluginsTab /> },
     VencordThemes: { name: "Themes", component: () => <ThemesTab /> },
     VencordUpdater: { name: "Updater" }, // Only show updater if IS_WEB is false
-    VencordSettingsSync: { name: "Backup & Restore", component: () => <BackupRestoreTab /> },
+    VencordCloud: { name: "Cloud", component: () => <CloudTab /> },
+    VencordSettingsSync: { name: "Backup & Restore", component: () => <BackupRestoreTab /> }
 };
 
 if (!IS_WEB) SettingsTabs.VencordUpdater.component = () => Updater && <Updater />;
@@ -56,7 +56,10 @@ if (!IS_WEB) SettingsTabs.VencordUpdater.component = () => Updater && <Updater /
 function Settings(props: SettingsProps) {
     const { tab = "VencordSettings" } = props;
 
-    const CurrentTab = SettingsTabs[tab]?.component;
+    const CurrentTab = SettingsTabs[tab]?.component ?? null;
+    if (isMobile) {
+        return CurrentTab && <CurrentTab />;
+    }
 
     return <Forms.FormSection>
         <Text variant="heading-lg/semibold" style={{ color: "var(--header-primary)" }} tag="h2">Vencord Settings</Text>

src/components/VencordSettings/settingsStyles.css

@@ -46,3 +46,23 @@
     padding: 0.5em;
     border: 1px solid var(--background-modifier-accent);
 }
+
+.vc-cloud-settings-sync-grid {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    grid-gap: 1em;
+}
+
+.vc-cloud-erase-data-danger-btn {
+    color: var(--white-500);
+    background-color: var(--button-danger-background);
+}
+
+.vc-text-selectable,
+.vc-text-selectable :not(a, button) {
+    /* make text selectable, silly discord makes the entirety of settings not selectable */
+    user-select: text;
+
+    /* discord also sets cursor: default which prevents the cursor from showing as text */
+    cursor: initial;
+}

src/components/monacoWin.html

@@ -3,7 +3,7 @@
 
 <head>
     <meta charset="utf-8">
-    <title>QuickCss Editor</title>
+    <title>Vencord QuickCSS Editor</title>
     <link rel="stylesheet" data-name="vs/editor/editor.main"
         href="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.34.0/min/vs/editor/editor.main.min.css">
     <style>

src/globals.d.ts

@@ -35,6 +35,8 @@ declare global {
     export var IS_WEB: boolean;
     export var IS_DEV: boolean;
     export var IS_STANDALONE: boolean;
+    export var IS_DISCORD_DESKTOP: boolean;
+    export var IS_VENCORD_DESKTOP: boolean;
 
     export var VencordNative: typeof import("./VencordNative").default;
     export var Vencord: typeof import("./Vencord");
@@ -54,6 +56,8 @@ declare global {
      * If you really must use it, mark your plugin as Desktop App only by naming it Foo.desktop.ts(x)
      */
     export var DiscordNative: any;
+    export var VencordDesktop: any;
+    export var VencordDesktopNative: any;
 
     interface Window {
         webpackChunkdiscord_app: {

src/main/index.ts

@@ -0,0 +1,110 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { app, protocol, session } from "electron";
+import { join } from "path";
+
+import { getSettings } from "./ipcMain";
+import { IS_VANILLA } from "./utils/constants";
+import { installExt } from "./utils/extensions";
+
+if (IS_VENCORD_DESKTOP || !IS_VANILLA) {
+    app.whenReady().then(() => {
+        // Source Maps! Maybe there's a better way but since the renderer is executed
+        // from a string I don't think any other form of sourcemaps would work
+        protocol.registerFileProtocol("vencord", ({ url: unsafeUrl }, cb) => {
+            let url = unsafeUrl.slice("vencord://".length);
+            if (url.endsWith("/")) url = url.slice(0, -1);
+            switch (url) {
+                case "renderer.js.map":
+                case "vencordDesktopRenderer.js.map":
+                case "preload.js.map":
+                case "patcher.js.map":
+                case "vencordDesktopMain.js.map":
+                    cb(join(__dirname, url));
+                    break;
+                default:
+                    cb({ statusCode: 403 });
+            }
+        });
+
+        try {
+            if (getSettings().enableReactDevtools)
+                installExt("fmkadmapgofadopljbjfkapdkoienihi")
+                    .then(() => console.info("[Vencord] Installed React Developer Tools"))
+                    .catch(err => console.error("[Vencord] Failed to install React Developer Tools", err));
+        } catch { }
+
+
+        // Remove CSP
+        type PolicyResult = Record<string, string[]>;
+
+        const parsePolicy = (policy: string): PolicyResult => {
+            const result: PolicyResult = {};
+            policy.split(";").forEach(directive => {
+                const [directiveKey, ...directiveValue] = directive.trim().split(/\s+/g);
+                if (directiveKey && !Object.prototype.hasOwnProperty.call(result, directiveKey)) {
+                    result[directiveKey] = directiveValue;
+                }
+            });
+            return result;
+        };
+        const stringifyPolicy = (policy: PolicyResult): string =>
+            Object.entries(policy)
+                .filter(([, values]) => values?.length)
+                .map(directive => directive.flat().join(" "))
+                .join("; ");
+
+        function patchCsp(headers: Record<string, string[]>, header: string) {
+            if (header in headers) {
+                const csp = parsePolicy(headers[header][0]);
+
+                for (const directive of ["style-src", "connect-src", "img-src", "font-src", "media-src", "worker-src"]) {
+                    csp[directive] = ["*", "blob:", "data:", "'unsafe-inline'"];
+                }
+                // TODO: Restrict this to only imported packages with fixed version.
+                // Perhaps auto generate with esbuild
+                csp["script-src"] ??= [];
+                csp["script-src"].push("'unsafe-eval'", "https://unpkg.com", "https://cdnjs.cloudflare.com");
+                headers[header] = [stringifyPolicy(csp)];
+            }
+        }
+
+        session.defaultSession.webRequest.onHeadersReceived(({ responseHeaders, resourceType }, cb) => {
+            if (responseHeaders) {
+                if (resourceType === "mainFrame")
+                    patchCsp(responseHeaders, "content-security-policy");
+
+                // Fix hosts that don't properly set the css content type, such as
+                // raw.githubusercontent.com
+                if (resourceType === "stylesheet")
+                    responseHeaders["content-type"] = ["text/css"];
+            }
+            cb({ cancel: false, responseHeaders });
+        });
+
+        // assign a noop to onHeadersReceived to prevent other mods from adding their own incompatible ones.
+        // For instance, OpenAsar adds their own that doesn't fix content-type for stylesheets which makes it
+        // impossible to load css from github raw despite our fix above
+        session.defaultSession.webRequest.onHeadersReceived = () => { };
+    });
+}
+
+if (IS_DISCORD_DESKTOP) {
+    require("./patcher");
+}

src/main/ipcMain.ts

@@ -28,7 +28,7 @@ import { join } from "path";
 
 import monacoHtml from "~fileContent/../components/monacoWin.html;base64";
 
-import { ALLOWED_PROTOCOLS, QUICKCSS_PATH, SETTINGS_DIR, SETTINGS_FILE } from "./constants";
+import { ALLOWED_PROTOCOLS, QUICKCSS_PATH, SETTINGS_DIR, SETTINGS_FILE } from "./utils/constants";
 
 mkdirSync(SETTINGS_DIR, { recursive: true });
 
@@ -44,6 +44,14 @@ export function readSettings() {
     }
 }
 
+export function getSettings(): typeof import("@api/settings").Settings {
+    try {
+        return JSON.parse(readSettings());
+    } catch {
+        return {} as any;
+    }
+}
+
 ipcMain.handle(IpcEvents.OPEN_QUICKCSS, () => shell.openPath(QUICKCSS_PATH));
 
 ipcMain.handle(IpcEvents.OPEN_EXTERNAL, (_, url) => {
@@ -85,7 +93,7 @@ export function initIpc(mainWindow: BrowserWindow) {
 
 ipcMain.handle(IpcEvents.OPEN_MONACO_EDITOR, async () => {
     const win = new BrowserWindow({
-        title: "QuickCss Editor",
+        title: "Vencord QuickCSS Editor",
         autoHideMenuBar: true,
         darkTheme: true,
         webPreferences: {

src/main/patcher.ts

@@ -20,9 +20,8 @@ import { onceDefined } from "@utils/onceDefined";
 import electron, { app, BrowserWindowConstructorOptions, Menu } from "electron";
 import { dirname, join } from "path";
 
-import { initIpc } from "./ipcMain";
+import { getSettings, initIpc } from "./ipcMain";
-import { installExt } from "./ipcMain/extensions";
+import { IS_VANILLA } from "./utils/constants";
-import { readSettings } from "./ipcMain/index";
 
 console.log("[Vencord] Starting up...");
 
@@ -41,11 +40,8 @@ require.main!.filename = join(asarPath, discordPkg.main);
 // @ts-ignore Untyped method? Dies from cringe
 app.setAppPath(asarPath);
 
-if (!process.argv.includes("--vanilla")) {
+if (!IS_VANILLA) {
-    let settings: typeof import("@api/settings").Settings = {} as any;
+    const settings = getSettings();
-    try {
-        settings = JSON.parse(readSettings());
-    } catch { }
 
     // Repatch after host updates on Windows
     if (process.platform === "win32") {
@@ -83,11 +79,17 @@ if (!process.argv.includes("--vanilla")) {
                     delete options.frame;
                 }
 
-                if (settings.transparent) {
+                // This causes electron to freeze / white screen for some people
+                if ((settings as any).transparentUNSAFE_USE_AT_OWN_RISK) {
                     options.transparent = true;
                     options.backgroundColor = "#00000000";
                 }
 
+                if (settings.macosTranslucency && process.platform === "darwin") {
+                    options.backgroundColor = "#00000000";
+                    options.vibrancy = "sidebar";
+                }
+
                 process.env.DISCORD_PRELOAD = original;
 
                 super(options);
@@ -109,85 +111,19 @@ if (!process.argv.includes("--vanilla")) {
         BrowserWindow
     };
 
-    // Patch appSettings to force enable devtools
+    // Patch appSettings to force enable devtools and optionally disable min size
-    onceDefined(global, "appSettings", s =>
+    onceDefined(global, "appSettings", s => {
-        s.set("DANGEROUS_ENABLE_DEVTOOLS_ONLY_ENABLE_IF_YOU_KNOW_WHAT_YOURE_DOING", true)
+        s.set("DANGEROUS_ENABLE_DEVTOOLS_ONLY_ENABLE_IF_YOU_KNOW_WHAT_YOURE_DOING", true);
-    );
+        if (settings.disableMinSize) {
+            s.set("MIN_WIDTH", 0);
+            s.set("MIN_HEIGHT", 0);
+        } else {
+            s.set("MIN_WIDTH", 940);
+            s.set("MIN_HEIGHT", 500);
+        }
+    });
 
     process.env.DATA_DIR = join(app.getPath("userData"), "..", "Vencord");
-
-    electron.app.whenReady().then(() => {
-        // Source Maps! Maybe there's a better way but since the renderer is executed
-        // from a string I don't think any other form of sourcemaps would work
-        electron.protocol.registerFileProtocol("vencord", ({ url: unsafeUrl }, cb) => {
-            let url = unsafeUrl.slice("vencord://".length);
-            if (url.endsWith("/")) url = url.slice(0, -1);
-            switch (url) {
-                case "renderer.js.map":
-                case "preload.js.map":
-                case "patcher.js.map": // doubt
-                    cb(join(__dirname, url));
-                    break;
-                default:
-                    cb({ statusCode: 403 });
-            }
-        });
-
-        try {
-            if (settings?.enableReactDevtools)
-                installExt("fmkadmapgofadopljbjfkapdkoienihi")
-                    .then(() => console.info("[Vencord] Installed React Developer Tools"))
-                    .catch(err => console.error("[Vencord] Failed to install React Developer Tools", err));
-        } catch { }
-
-
-        // Remove CSP
-        type PolicyResult = Record<string, string[]>;
-
-        const parsePolicy = (policy: string): PolicyResult => {
-            const result: PolicyResult = {};
-            policy.split(";").forEach(directive => {
-                const [directiveKey, ...directiveValue] = directive.trim().split(/\s+/g);
-                if (directiveKey && !Object.prototype.hasOwnProperty.call(result, directiveKey)) {
-                    result[directiveKey] = directiveValue;
-                }
-            });
-            return result;
-        };
-        const stringifyPolicy = (policy: PolicyResult): string =>
-            Object.entries(policy)
-                .filter(([, values]) => values?.length)
-                .map(directive => directive.flat().join(" "))
-                .join("; ");
-
-        function patchCsp(headers: Record<string, string[]>, header: string) {
-            if (header in headers) {
-                const csp = parsePolicy(headers[header][0]);
-
-                for (const directive of ["style-src", "connect-src", "img-src", "font-src", "media-src", "worker-src"]) {
-                    csp[directive] = ["*", "blob:", "data:", "'unsafe-inline'"];
-                }
-                // TODO: Restrict this to only imported packages with fixed version.
-                // Perhaps auto generate with esbuild
-                csp["script-src"] ??= [];
-                csp["script-src"].push("'unsafe-eval'", "https://unpkg.com", "https://cdnjs.cloudflare.com");
-                headers[header] = [stringifyPolicy(csp)];
-            }
-        }
-
-        electron.session.defaultSession.webRequest.onHeadersReceived(({ responseHeaders, resourceType }, cb) => {
-            if (responseHeaders) {
-                if (resourceType === "mainFrame")
-                    patchCsp(responseHeaders, "content-security-policy");
-
-                // Fix hosts that don't properly set the css content type, such as
-                // raw.githubusercontent.com
-                if (resourceType === "stylesheet")
-                    responseHeaders["content-type"] = ["text/css"];
-            }
-            cb({ cancel: false, responseHeaders });
-        });
-    });
 } else {
     console.log("[Vencord] Running in vanilla mode. Not loading Vencord");
 }

src/main/updater/common.ts

@@ -16,28 +16,13 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { createHash } from "crypto";
-import { createReadStream } from "fs";
-import { join } from "path";
 
-export async function calculateHashes() {
+export const VENCORD_FILES = [
-    const hashes = {} as Record<string, string>;
+    IS_DISCORD_DESKTOP ? "patcher.js" : "vencordDesktopMain.js",
-
+    "preload.js",
-    await Promise.all(
+    IS_DISCORD_DESKTOP ? "renderer.js" : "vencordDesktopRenderer.js",
-        ["patcher.js", "preload.js", "renderer.js", "renderer.css"].map(file => new Promise<void>(r => {
+    "renderer.css"
-            const fis = createReadStream(join(__dirname, file));
+];
-            const hash = createHash("sha1", { encoding: "hex" });
-            fis.once("end", () => {
-                hash.end();
-                hashes[file] = hash.read();
-                r();
-            });
-            fis.pipe(hash);
-        }))
-    );
-
-    return hashes;
-}
 
 export function serializeErrors(func: (...args: any[]) => any) {
     return async function () {

src/main/updater/git.ts

@@ -22,7 +22,7 @@ import { ipcMain } from "electron";
 import { join } from "path";
 import { promisify } from "util";
 
-import { calculateHashes, serializeErrors } from "./common";
+import { serializeErrors } from "./common";
 
 const VENCORD_SRC_DIR = join(__dirname, "..");
 
@@ -76,7 +76,6 @@ async function build() {
     return !res.stderr.includes("Build failed");
 }
 
-ipcMain.handle(IpcEvents.GET_HASHES, serializeErrors(calculateHashes));
 ipcMain.handle(IpcEvents.GET_REPO, serializeErrors(getRepo));
 ipcMain.handle(IpcEvents.GET_UPDATES, serializeErrors(calculateGitChanges));
 ipcMain.handle(IpcEvents.UPDATE, serializeErrors(pull));

src/main/updater/http.ts

@@ -25,8 +25,8 @@ import { join } from "path";
 import gitHash from "~git-hash";
 import gitRemote from "~git-remote";
 
-import { get } from "../simpleGet";
+import { get } from "../utils/simpleGet";
-import { calculateHashes, serializeErrors } from "./common";
+import { serializeErrors, VENCORD_FILES } from "./common";
 
 const API_BASE = `https://api.github.com/repos/${gitRemote}`;
 let PendingUpdates = [] as [string, string][];
@@ -66,7 +66,7 @@ async function fetchUpdates() {
         return false;
 
     data.assets.forEach(({ name, browser_download_url }) => {
-        if (["patcher.js", "preload.js", "renderer.js", "renderer.css"].some(s => name.startsWith(s))) {
+        if (VENCORD_FILES.some(s => name.startsWith(s))) {
             PendingUpdates.push([name, browser_download_url]);
         }
     });
@@ -75,13 +75,15 @@ async function fetchUpdates() {
 
 async function applyUpdates() {
     await Promise.all(PendingUpdates.map(
-        async ([name, data]) => writeFile(join(__dirname, name), await get(data)))
+        async ([name, data]) => writeFile(
-    );
+            join(__dirname, name),
+            await get(data)
+        )
+    ));
     PendingUpdates = [];
     return true;
 }
 
-ipcMain.handle(IpcEvents.GET_HASHES, serializeErrors(calculateHashes));
 ipcMain.handle(IpcEvents.GET_REPO, serializeErrors(() => `https://github.com/${gitRemote}`));
 ipcMain.handle(IpcEvents.GET_UPDATES, serializeErrors(calculateGitChanges));
 ipcMain.handle(IpcEvents.UPDATE, serializeErrors(fetchUpdates));

src/main/utils/constants.ts

@@ -33,3 +33,5 @@ export const ALLOWED_PROTOCOLS = [
     "steam:",
     "spotify:"
 ];
+
+export const IS_VANILLA = /* @__PURE__ */ process.argv.includes("--vanilla");

src/plugins/alwaysAnimate.ts

@@ -1,6 +1,6 @@
 /*
  * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2022 Vendicated and contributors
+ * Copyright (c) 2023 Vendicated and contributors
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -20,16 +20,18 @@ import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
 
 export default definePlugin({
-    name: "MuteNewGuild",
+    name: "AlwaysAnimate",
-    description: "Mutes newly joined guilds",
+    description: "Animates anything that can be animated, besides status emojis.",
-    authors: [Devs.Glitch],
+    authors: [Devs.FieryFlames],
+
     patches: [
         {
-            find: ",acceptInvite:function",
+            find: ".canAnimate",
+            all: true,
             replacement: {
-                match: /(\w=null!==[^;]+)/,
+                match: /\.canAnimate\b/g,
-                replace: "$1;Vencord.Webpack.findByProps('updateGuildNotificationSettings').updateGuildNotificationSettings($1,{'muted':true,'suppress_everyone':true,'suppress_roles':true})"
+                replace: ".canAnimate || true"
             }
         }
-    ],
+    ]
 });

src/plugins/apiBadges.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { BadgePosition, ProfileBadge } from "@api/Badges";
+import { BadgePosition, BadgeUserArgs, ProfileBadge } from "@api/Badges";
 import DonateButton from "@components/DonateButton";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
@@ -29,13 +29,13 @@ import { closeModal, Modals, openModal } from "@utils/modal";
 import definePlugin from "@utils/types";
 import { Forms } from "@webpack/common";
 
-const CONTRIBUTOR_BADGE = "https://media.discordapp.net/stickers/1026517526106087454.webp";
+const CONTRIBUTOR_BADGE = "https://cdn.discordapp.com/attachments/1033680203433660458/1092089947126780035/favicon.png";
 
 /** List of vencord contributor IDs */
 const contributorIds: string[] = Object.values(Devs).map(d => d.id.toString());
 
 const ContributorBadge: ProfileBadge = {
-    tooltip: "Vencord Contributor",
+    description: "Vencord Contributor",
     image: CONTRIBUTOR_BADGE,
     position: BadgePosition.START,
     props: {
@@ -45,23 +45,23 @@ const ContributorBadge: ProfileBadge = {
         }
     },
     shouldShow: ({ user }) => contributorIds.includes(user.id),
-    onClick: () => VencordNative.ipc.invoke(IpcEvents.OPEN_EXTERNAL, "https://github.com/Vendicated/Vencord")
+    link: "https://github.com/Vendicated/Vencord"
 };
 
-const DonorBadges = {} as Record<string, Pick<ProfileBadge, "image" | "tooltip">>;
+const DonorBadges = {} as Record<string, Pick<ProfileBadge, "image" | "description">>;
 
 export default definePlugin({
     name: "BadgeAPI",
     description: "API to add badges to users.",
-    authors: [Devs.Megu],
+    authors: [Devs.Megu, Devs.Ven, Devs.TheSun],
     required: true,
     patches: [
         /* Patch the badges array */
         {
-            find: "PREMIUM_GUILD_SUBSCRIPTION_TOOLTIP.format({date:",
+            find: "Messages.ACTIVE_DEVELOPER_BADGE_TOOLTIP",
             replacement: {
-                match: /&&((\w{1,3})\.push\({tooltip:\w{1,3}\.\w{1,3}\.Messages\.PREMIUM_GUILD_SUBSCRIPTION_TOOLTIP\.format.+?;)(?:return\s\w{1,3};?})/,
+                match: /(?<=void 0:)\i.getBadges\(\)/,
-                replace: (_, m, badgeArray) => `&&${m} return Vencord.Api.Badges.inject(${badgeArray}, arguments[0]);}`,
+                replace: "Vencord.Api.Badges._getBadges(arguments[0]).concat($&??[])",
             }
         },
         /* Patch the badge list component on user profiles */
@@ -69,21 +69,28 @@ export default definePlugin({
             find: "Messages.PROFILE_USER_BADGES,role:",
             replacement: [
                 {
-                    match: /src:(\w{1,3})\[(\w{1,3})\.key\],/,
+                    // alt: "", aria-hidden: false, src: originalSrc
-                    // <img src={badge.image ?? imageMap[badge.key]} {...badge.props} />
+                    match: /alt:" ","aria-hidden":!0,src:(?=.{0,10}\b(\i)\.(?:icon|key))/g,
-                    replace: (_, imageMap, badge) => `src: ${badge}.image ?? ${imageMap}[${badge}.key], ...${badge}.props,`
+                    // ...badge.props, ..., src: badge.image ?? ...
+                    replace: "...$1.props,$& $1.image??"
                 },
                 {
-                    match: /spacing:(\d{1,2}),children:(.{1,40}(\i)\.jsx.+?(\i)\.onClick.+?\)})},/,
+                    match: /children:function(?<=(\i)\.(?:tooltip|description),spacing:\d.+?)/g,
-                    // if the badge provides it's own component, render that instead of an image
+                    replace: "children:$1.component ? () => $self.renderBadgeComponent($1) : function"
-                    // the badge also includes info about the user that has it (type BadgeUserArgs), which is why it's passed as props
+                },
-                    replace: (_, s, origBadgeComponent, React, badge) =>
+                {
-                        `spacing:${s},children:${badge}.component ? () => (0,${React}.jsx)(${badge}.component, { ...${badge} }) : ${origBadgeComponent}},`
+                    match: /onClick:function(?=.{0,200}href:(\i)\.link)/,
+                    replace: "onClick:$1.onClick??function"
                 }
             ]
         }
     ],
 
+    renderBadgeComponent: ErrorBoundary.wrap((badge: ProfileBadge & BadgeUserArgs) => {
+        const Component = badge.component!;
+        return <Component {...badge} />;
+    }, { noop: true }),
+
     async start() {
         Vencord.Api.Badges.addBadge(ContributorBadge);
         const badges = await fetch("https://gist.githubusercontent.com/Vendicated/51a3dd775f6920429ec6e9b735ca7f01/raw/badges.csv").then(r => r.text());
@@ -93,15 +100,15 @@ export default definePlugin({
             return;
         }
         for (const line of lines) {
-            const [id, tooltip, image] = line.split(",");
+            const [id, description, image] = line.split(",");
-            DonorBadges[id] = { image, tooltip };
+            DonorBadges[id] = { image, description };
         }
     },
 
-    addDonorBadge(badges: ProfileBadge[], userId: string) {
+    getDonorBadge(userId: string) {
         const badge = DonorBadges[userId];
         if (badge) {
-            badges.unshift({
+            return {
                 ...badge,
                 position: BadgePosition.START,
                 props: {
@@ -165,7 +172,7 @@ export default definePlugin({
                         </ErrorBoundary>
                     ));
                 },
-            });
+            };
         }
     }
 });

src/plugins/apiContextMenu.ts

@@ -16,77 +16,15 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Settings } from "@api/settings";
 import { Devs } from "@utils/constants";
-import definePlugin, { type PatchReplacement } from "@utils/types";
+import definePlugin from "@utils/types";
-import { addListener, removeListener } from "@webpack";
-
-/**
- * The last var name corresponding to the Context Menu API (Discord, not ours) module
- */
-let lastVarName = "";
-
-/**
- * @param target The patch replacement object
- * @param exportKey The key exporting the build Context Menu component function
- */
-function makeReplacementProxy(target: PatchReplacement, exportKey: string) {
-    return new Proxy(target, {
-        get(_, p) {
-            if (p === "match") return RegExp(`${exportKey},{(?<=${lastVarName}\\.${exportKey},{)`, "g");
-            // @ts-expect-error
-            return Reflect.get(...arguments);
-        }
-    });
-}
-
-function listener(exports: any, id: number) {
-    if (!Settings.plugins.ContextMenuAPI.enabled) return removeListener(listener);
-
-    if (typeof exports !== "object" || exports === null) return;
-
-    for (const key in exports) if (key.length <= 3) {
-        const prop = exports[key];
-        if (typeof prop !== "function") continue;
-
-        const str = Function.prototype.toString.call(prop);
-        if (str.includes('path:["empty"]')) {
-            Vencord.Plugins.patches.push({
-                plugin: "ContextMenuAPI",
-                all: true,
-                noWarn: true,
-                find: "navId:",
-                replacement: [
-                    {
-                        // Set the lastVarName for our proxy to use
-                        match: RegExp(`${id}(?<=(\\i)=.+?)`),
-                        replace: (id, varName) => {
-                            lastVarName = varName;
-                            return id;
-                        }
-                    },
-                    /**
-                     * We are using a proxy here to utilize the whole code the patcher gives us, instead of matching the entire module (which is super slow)
-                     * Our proxy returns the corresponding match for that module utilizing lastVarName, which is set by the patch before
-                     */
-                    makeReplacementProxy({
-                        match: "", // Needed to canonicalizeDescriptor
-                        replace: "$&contextMenuApiArguments:arguments,",
-                    }, key)
-                ]
-            });
-
-            removeListener(listener);
-        }
-    }
-}
-
-addListener(listener);
 
 export default definePlugin({
     name: "ContextMenuAPI",
     description: "API for adding/removing items to/from context menus.",
-    authors: [Devs.Nuckyz],
+    authors: [Devs.Nuckyz, Devs.Ven],
+    required: true,
+
     patches: [
         {
             find: "♫ (つ｡◕‿‿◕｡)つ ♪",
@@ -94,6 +32,14 @@ export default definePlugin({
                 match: /(?<=function \i\((\i)\){)(?=var \i,\i=\i\.navId)/,
                 replace: (_, props) => `Vencord.Api.ContextMenu._patchContextMenu(${props});`
             }
+        },
+        {
+            find: ".Menu,{",
+            all: true,
+            replacement: {
+                match: /Menu,{(?<=\.jsxs?\)\(\i\.Menu,{)/g,
+                replace: "$&contextMenuApiArguments:typeof arguments!=='undefined'?arguments:[],"
+            }
         }
     ]
 });

src/plugins/apiMenuItemDeobfuscator.ts

@@ -1,82 +0,0 @@
-/*
- * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2022 Vendicated and contributors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <https://www.gnu.org/licenses/>.
-*/
-
-import { migratePluginSettings } from "@api/settings";
-import { Devs } from "@utils/constants";
-import definePlugin from "@utils/types";
-
-// duplicate values have multiple branches with different types. Just include all to be safe
-const nameMap = {
-    radio: "MenuRadioItem",
-    separator: "MenuSeparator",
-    checkbox: "MenuCheckboxItem",
-    groupstart: "MenuGroup",
-
-    control: "MenuControlItem",
-    compositecontrol: "MenuControlItem",
-
-    item: "MenuItem",
-    customitem: "MenuItem",
-};
-
-migratePluginSettings("MenuItemDeobfuscatorAPI", "MenuItemDeobfuscatorApi");
-export default definePlugin({
-    name: "MenuItemDeobfuscatorAPI",
-    description: "Deobfuscates Discord's Menu Item module",
-    authors: [Devs.Ven],
-    patches: [
-        {
-            find: '"Menu API',
-            replacement: {
-                match: /function.{0,80}type===(\i)\).{0,50}navigable:.+?Menu API/s,
-                replace: (m, mod) => {
-                    let nicenNames = "";
-                    const redefines = [] as string[];
-                    // if (t.type === m.MenuItem)
-                    const typeCheckRe = /\(.{1,3}\.type===(.{1,5})\)/g;
-                    // push({type:"item"})
-                    const pushTypeRe = /type:"(\w+)"/g;
-
-                    let typeMatch: RegExpExecArray | null;
-                    // for each if (t.type === ...)
-                    while ((typeMatch = typeCheckRe.exec(m)) !== null) {
-                        // extract the current menu item
-                        const item = typeMatch[1];
-                        // Set the starting index of the second regex to that of the first to start
-                        // matching from after the if
-                        pushTypeRe.lastIndex = typeCheckRe.lastIndex;
-                        // extract the first type: "..."
-                        const type = pushTypeRe.exec(m)?.[1];
-                        if (type && type in nameMap) {
-                            const name = nameMap[type];
-                            nicenNames += `Object.defineProperty(${item},"name",{value:"${name}"});`;
-                            redefines.push(`${name}:${item}`);
-                        }
-                    }
-                    if (redefines.length < 6) {
-                        console.warn("[ApiMenuItemDeobfuscator] Expected to at least remap 6 items, only remapped", redefines.length);
-                    }
-
-                    // Merge all our redefines with the actual module
-                    return `${nicenNames}Object.assign(${mod},{${redefines.join(",")}});${m}`;
-                },
-            },
-        },
-    ],
-});
-

src/plugins/apiMessagePopover.ts

@@ -22,12 +22,12 @@ import definePlugin from "@utils/types";
 export default definePlugin({
     name: "MessagePopoverAPI",
     description: "API to add buttons to message popovers.",
-    authors: [Devs.KingFish, Devs.Ven],
+    authors: [Devs.KingFish, Devs.Ven, Devs.Nuckyz],
     patches: [{
         find: "Messages.MESSAGE_UTILITIES_A11Y_LABEL",
         replacement: {
-            // foo && !bar ? createElement(blah,...makeElement(addReactionData))
+            // foo && !bar ? createElement(reactionStuffs)... createElement(blah,...makeElement(reply-other))
-            match: /\i&&!\i\?\(0,\i\.jsxs?\)\(.{0,200}renderPopout:.{0,300}?(\i)\(.{3,20}\{key:"add-reaction".+?\}/,
+            match: /\i&&!\i\?\(0,\i\.jsxs?\)\(.{0,200}renderEmojiPicker:.{0,500}\?(\i)\(\{key:"reply-other"/,
             replace: (m, makeElement) => {
                 const msg = m.match(/message:(.{1,3}),/)?.[1];
                 if (!msg) throw new Error("Could not find message variable");

src/plugins/apiSettingsStore.ts

@@ -0,0 +1,38 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { Devs } from "@utils/constants";
+import definePlugin from "@utils/types";
+
+export default definePlugin({
+    name: "SettingsStoreAPI",
+    description: "Patches Discord's SettingsStores to expose their group and name",
+    authors: [Devs.Nuckyz],
+
+    patches: [
+        {
+            find: '"textAndImages","renderSpoilers"',
+            replacement: [
+                {
+                    match: /(?<=INFREQUENT_USER_ACTION.{0,20}),useSetting:function/,
+                    replace: ",settingsStoreApiGroup:arguments[0],settingsStoreApiName:arguments[1]$&"
+                }
+            ]
+        }
+    ]
+});

src/plugins/betterFolders/FolderSideBar.tsx

@@ -0,0 +1,84 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { Settings } from "@api/settings";
+import { classNameFactory } from "@api/Styles";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { findByPropsLazy, findStoreLazy } from "@webpack";
+import { i18n, React, useStateFromStores } from "@webpack/common";
+
+const cl = classNameFactory("vc-bf-");
+const classes = findByPropsLazy("sidebar", "guilds");
+
+const Animations = findByPropsLazy("a", "animated", "useTransition");
+const ChannelRTCStore = findStoreLazy("ChannelRTCStore");
+const ExpandedGuildFolderStore = findStoreLazy("ExpandedGuildFolderStore");
+
+function Guilds(props: {
+    className: string;
+    bfGuildFolders: any[];
+}) {
+    // @ts-expect-error
+    const res = Vencord.Plugins.plugins.BetterFolders.Guilds(props);
+
+    const scrollerProps = res.props.children?.props?.children?.[1]?.props;
+    if (scrollerProps?.children) {
+        const servers = scrollerProps.children.find(c => c?.props?.["aria-label"] === i18n.Messages.SERVERS);
+        if (servers) scrollerProps.children = servers;
+    }
+
+    return res;
+}
+
+export default ErrorBoundary.wrap(() => {
+    const expandedFolders = useStateFromStores([ExpandedGuildFolderStore], () => ExpandedGuildFolderStore.getExpandedFolders());
+    const fullscreen = useStateFromStores([ChannelRTCStore], () => ChannelRTCStore.isFullscreenInContext());
+
+    const guilds = document.querySelector(`.${classes.guilds}`);
+
+    const visible = !!expandedFolders.size;
+    const className = cl("folder-sidebar", { fullscreen });
+
+    const Sidebar = (
+        <Guilds
+            className={classes.guilds}
+            bfGuildFolders={Array.from(expandedFolders)}
+        />
+    );
+
+    if (!guilds || !Settings.plugins.BetterFolders.sidebarAnim)
+        return visible
+            ? <div className={className}>{Sidebar}</div>
+            : null;
+
+    return (
+        <Animations.Transition
+            items={visible}
+            from={{ width: 0 }}
+            enter={{ width: guilds.getBoundingClientRect().width }}
+            leave={{ width: 0 }}
+            config={{ duration: 200 }}
+        >
+            {(style, show) => show && (
+                <Animations.animated.div style={style} className={className}>
+                    {Sidebar}
+                </Animations.animated.div>
+            )}
+        </Animations.Transition>
+    );
+}, { noop: true });

src/plugins/betterFolders/betterFolders.css

@@ -0,0 +1,17 @@
+.vc-bf-folder-sidebar [class*="wrapper-"] > [class*="listItem-"]:first-of-type,
+.vc-bf-folder-sidebar [class*="unreadMentionsIndicator"] {
+    display: none;
+}
+
+.vc-bf-folder-sidebar [class*="expandedFolderBackground-"] {
+    background-color: transparent;
+}
+
+.vc-bf-folder-sidebar {
+    display: flex;
+}
+
+.vc-bf-fullscreen {
+    width: 0 !important;
+    visibility: hidden;
+}

src/plugins/betterFolders/index.ts

@@ -0,0 +1,177 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import "./betterFolders.css";
+
+import { definePluginSettings } from "@api/settings";
+import { Devs } from "@utils/constants";
+import definePlugin, { OptionType } from "@utils/types";
+import { findByPropsLazy, findLazy, findStoreLazy } from "@webpack";
+import { FluxDispatcher } from "@webpack/common";
+
+import FolderSideBar from "./FolderSideBar";
+
+const GuildsTree = findLazy(m => m.prototype?.convertToFolder);
+const GuildFolderStore = findStoreLazy("SortedGuildStore");
+const ExpandedFolderStore = findStoreLazy("ExpandedGuildFolderStore");
+const FolderUtils = findByPropsLazy("move", "toggleGuildFolderExpand");
+
+const settings = definePluginSettings({
+    sidebar: {
+        type: OptionType.BOOLEAN,
+        description: "Display servers from folder on dedicated sidebar",
+        default: true,
+    },
+    sidebarAnim: {
+        type: OptionType.BOOLEAN,
+        description: "Animate opening the folder sidebar",
+        default: true,
+    },
+    closeAllFolders: {
+        type: OptionType.BOOLEAN,
+        description: "Close all folders when selecting a server not in a folder",
+        default: false,
+    },
+    closeAllHomeButton: {
+        type: OptionType.BOOLEAN,
+        description: "Close all folders when clicking on the home button",
+        default: false,
+    },
+    closeOthers: {
+        type: OptionType.BOOLEAN,
+        description: "Close other folders when opening a folder",
+        default: false,
+    },
+    forceOpen: {
+        type: OptionType.BOOLEAN,
+        description: "Force a folder to open when switching to a server of that folder",
+        default: false,
+    },
+});
+
+export default definePlugin({
+    name: "BetterFolders",
+    description: "Shows server folders on dedicated sidebar and adds folder related improvements",
+    authors: [Devs.juby, Devs.AutumnVN],
+    patches: [
+        {
+            find: '("guildsnav")',
+            predicate: () => settings.store.sidebar,
+            replacement: [
+                {
+                    match: /(\i)\(\){return \i\(\(0,\i\.jsx\)\("div",{className:\i\(\)\.guildSeparator}\)\)}/,
+                    replace: "$&$self.Separator=$1;"
+                },
+
+                // Folder component patch
+                {
+                    match: /\i\(\(function\(\i,\i,\i\){var \i=\i\.key;return.+\(\i\)},\i\)}\)\)/,
+                    replace: "arguments[0].bfHideServers?null:$&"
+                },
+
+                // BEGIN Guilds component patch
+                {
+                    match: /(\i)\.themeOverride,(.{15,25}\(function\(\){var \i=)(\i\.\i\.getGuildsTree\(\))/,
+                    replace: "$1.themeOverride,bfPatch=$1.bfGuildFolders,$2bfPatch?$self.getGuildsTree(bfPatch,$3):$3"
+                },
+                {
+                    match: /return(\(0,\i\.jsx\))(\(\i,{)(folderNode:\i,setNodeRef:\i\.setNodeRef,draggable:!0,.+},\i\.id\));case/,
+                    replace: "var bfHideServers=typeof bfPatch==='undefined',folder=$1$2bfHideServers,$3;return !bfHideServers&&arguments[1]?[$1($self.Separator,{}),folder]:folder;case"
+                },
+                // END
+
+                {
+                    match: /\("guildsnav"\);return\(0,\i\.jsx\)\(.{1,6},{navigator:\i,children:\(0,\i\.jsx\)\(/,
+                    replace: "$&$self.Guilds="
+                }
+            ]
+        },
+        {
+            find: "APPLICATION_LIBRARY,render",
+            predicate: () => settings.store.sidebar,
+            replacement: {
+                match: /(\(0,\i\.jsx\))\(\i\..,{className:\i\(\)\.guilds,themeOverride:\i}\)/,
+                replace: "$&,$1($self.FolderSideBar,{})"
+            }
+        },
+        {
+            find: '("guildsnav")',
+            predicate: () => settings.store.closeAllHomeButton,
+            replacement: {
+                match: ",onClick:function(){if(!__OVERLAY__){",
+                replace: "$&$self.closeFolders();"
+            }
+        }
+    ],
+
+    settings,
+
+    start() {
+        const getGuildFolder = (id: string) => GuildFolderStore.getGuildFolders().find(f => f.guildIds.includes(id));
+
+        FluxDispatcher.subscribe("CHANNEL_SELECT", this.onSwitch = data => {
+            if (!settings.store.closeAllFolders && !settings.store.forceOpen)
+                return;
+
+            if (this.lastGuildId !== data.guildId) {
+                this.lastGuildId = data.guildId;
+
+                const guildFolder = getGuildFolder(data.guildId);
+                if (guildFolder?.folderId) {
+                    if (settings.store.forceOpen && !ExpandedFolderStore.isFolderExpanded(guildFolder.folderId))
+                        FolderUtils.toggleGuildFolderExpand(guildFolder.folderId);
+                } else if (settings.store.closeAllFolders)
+                    this.closeFolders();
+            }
+        });
+
+        FluxDispatcher.subscribe("TOGGLE_GUILD_FOLDER_EXPAND", this.onToggleFolder = e => {
+            if (settings.store.closeOthers && !this.dispatching)
+                FluxDispatcher.wait(() => {
+                    const expandedFolders = ExpandedFolderStore.getExpandedFolders();
+                    if (expandedFolders.size > 1) {
+                        this.dispatching = true;
+
+                        for (const id of expandedFolders) if (id !== e.folderId)
+                            FolderUtils.toggleGuildFolderExpand(id);
+
+                        this.dispatching = false;
+                    }
+                });
+        });
+    },
+
+    stop() {
+        FluxDispatcher.unsubscribe("CHANNEL_SELECT", this.onSwitch);
+        FluxDispatcher.unsubscribe("TOGGLE_GUILD_FOLDER_EXPAND", this.onToggleFolder);
+    },
+
+    FolderSideBar,
+
+    getGuildsTree(folders, oldTree) {
+        const tree = new GuildsTree();
+        tree.root.children = oldTree.root.children.filter(e => folders.includes(e.id));
+        tree.nodes = folders.map(id => oldTree.nodes[id]);
+        return tree;
+    },
+
+    closeFolders() {
+        for (const id of ExpandedFolderStore.getExpandedFolders())
+            FolderUtils.toggleGuildFolderExpand(id);
+    },
+});

src/plugins/betterRoleDot.ts

@@ -44,7 +44,7 @@ export default definePlugin({
                 match: /"(?:username|dot)"===\i(?!\.\i)/g,
                 replace: "true",
             },
-        },
+        }
     ],
 
     options: {

src/plugins/consoleShortcuts.ts

@@ -17,10 +17,13 @@
 */
 
 import { Devs } from "@utils/constants";
+import { relaunch } from "@utils/native";
+import { canonicalizeMatch, canonicalizeReplace, canonicalizeReplacement } from "@utils/patches";
 import definePlugin from "@utils/types";
 import * as Webpack from "@webpack";
 import { extract, filters, findAll, search } from "@webpack";
-import { React } from "@webpack/common";
+import { React, ReactDOM } from "@webpack/common";
+import type { ComponentType } from "react";
 
 const WEB_ONLY = (f: string) => () => {
     throw new Error(`'${f}' is Discord Desktop only.`);
@@ -58,6 +61,7 @@ export default definePlugin({
             };
         }
 
+        let fakeRenderWin: WeakRef<Window> | undefined;
         return {
             wp: Vencord.Webpack,
             wpc: Webpack.wreq.c,
@@ -71,13 +75,25 @@ export default definePlugin({
             findAllByProps: (...props: string[]) => findAll(filters.byProps(...props)),
             findByCode: newFindWrapper(filters.byCode),
             findAllByCode: (code: string) => findAll(filters.byCode(code)),
+            findStore: newFindWrapper(filters.byStoreName),
             PluginsApi: Vencord.Plugins,
             plugins: Vencord.Plugins.plugins,
             React,
             Settings: Vencord.Settings,
             Api: Vencord.Api,
             reload: () => location.reload(),
-            restart: IS_WEB ? WEB_ONLY("restart") : window.DiscordNative.app.relaunch
+            restart: IS_WEB ? WEB_ONLY("restart") : relaunch,
+            canonicalizeMatch,
+            canonicalizeReplace,
+            canonicalizeReplacement,
+            fakeRender: (component: ComponentType, props: any) => {
+                const prevWin = fakeRenderWin?.deref();
+                const win = prevWin?.closed === false ? prevWin : window.open("about:blank", "Fake Render", "popup,width=500,height=500")!;
+                fakeRenderWin = new WeakRef(win);
+                win.focus();
+
+                ReactDOM.render(React.createElement(component, props), win.document.body);
+            }
         };
     },
 

src/plugins/corruptMp4s.ts

@@ -1,105 +0,0 @@
-/*
- * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2022 Vendicated and contributors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <https://www.gnu.org/licenses/>.
-*/
-
-import { ApplicationCommandOptionType, sendBotMessage } from "@api/Commands";
-import { findOption } from "@api/Commands/commandHelpers";
-import { ApplicationCommandInputType } from "@api/Commands/types";
-import { Devs } from "@utils/constants";
-import definePlugin from "@utils/types";
-import { findByCode, findByProps } from "@webpack";
-
-const DRAFT_TYPE = 0;
-
-export default definePlugin({
-    name: "CorruptMp4s",
-    description: "Create corrupt mp4s with extremely high or negative duration",
-    authors: [Devs.Ven],
-    dependencies: ["CommandsAPI"],
-    commands: [{
-        name: "corrupt",
-        description: "Create a corrupt mp4 with extremely high or negative duration",
-        inputType: ApplicationCommandInputType.BUILT_IN,
-        options: [
-            {
-                name: "mp4",
-                description: "the video to corrupt",
-                type: ApplicationCommandOptionType.ATTACHMENT,
-                required: true
-            },
-            {
-                name: "kind",
-                description: "the kind of corruption",
-                type: ApplicationCommandOptionType.STRING,
-                choices: [
-                    {
-                        name: "infinite",
-                        value: "infinite",
-                        label: "Very high duration"
-                    },
-                    {
-                        name: "negative",
-                        value: "negative",
-                        label: "Negative duration"
-                    }
-                ]
-            }
-        ],
-        execute: async (args, ctx) => {
-            const UploadStore = findByProps("getUploads");
-            const upload = UploadStore.getUploads(ctx.channel.id, DRAFT_TYPE)[0];
-
-            const video = upload?.item?.file as File | undefined;
-
-            if (video?.type !== "video/mp4")
-                return void sendBotMessage(ctx.channel.id, {
-                    content: "Please upload a mp4 file"
-                });
-
-            const corruption = findOption<string>(args, "kind", "infinite");
-
-            const buf = new Uint8Array(await video.arrayBuffer());
-            let found = false;
-
-            // adapted from https://github.com/GeopJr/exorcism/blob/c9a12d77ccbcb49c987b385eafae250906efc297/src/App.svelte#L41-L48
-            for (let i = 0; i < buf.length; i++) {
-                if (buf[i] === 0x6d && buf[i + 1] === 0x76 && buf[i + 2] === 0x68 && buf[i + 3] === 0x64) {
-                    let start = i + 18;
-                    buf[start++] = 0x00;
-                    buf[start++] = 0x01;
-                    buf[start++] = corruption === "negative" ? 0xff : 0x7f;
-                    buf[start++] = 0xff;
-                    buf[start++] = 0xff;
-                    buf[start++] = corruption === "negative" ? 0xf0 : 0xff;
-                    found = true;
-                    break;
-                }
-            }
-
-            if (!found) {
-                return void sendBotMessage(ctx.channel.id, {
-                    content: "Could not find signature. Is this even a mp4?"
-                });
-            }
-
-            const newName = video.name.replace(/\.mp4$/i, ".corrupt.mp4");
-            const promptToUpload = findByCode("UPLOAD_FILE_LIMIT_ERROR");
-            const file = new File([buf], newName, { type: "video/mp4" });
-            setTimeout(() => promptToUpload([file], ctx.channel, DRAFT_TYPE), 10);
-        }
-    }]
-});

src/plugins/crashHandler.ts

@@ -43,6 +43,7 @@ const settings = definePluginSettings({
 
 let crashCount: number = 0;
 let lastCrashTimestamp: number = 0;
+let shouldAttemptNextHandle = false;
 
 export default definePlugin({
     name: "CrashHandler",
@@ -72,12 +73,17 @@ export default definePlugin({
     ],
 
     handleCrash(_this: ReactElement & { forceUpdate: () => void; }) {
+        if (Date.now() - lastCrashTimestamp <= 1_000 && !shouldAttemptNextHandle) return true;
+
+        shouldAttemptNextHandle = false;
+
         if (++crashCount > 5) {
             try {
                 showNotification({
                     color: "#eed202",
                     title: "Discord has crashed!",
                     body: "Awn :( Discord has crashed more than five times, not attempting to recover.",
+                    noPersist: true,
                 });
             } catch { }
 
@@ -111,6 +117,7 @@ export default definePlugin({
                     color: "#eed202",
                     title: "Discord has crashed!",
                     body: "Attempting to recover...",
+                    noPersist: true,
                 });
             } catch { }
         }
@@ -149,6 +156,7 @@ export default definePlugin({
         }
 
         try {
+            shouldAttemptNextHandle = true;
             _this.forceUpdate();
         } catch (err) {
             CrashHandlerLogger.debug("Failed to update crash handler component.", err);

src/plugins/devCompanion.dev.tsx

@@ -102,7 +102,8 @@ function initWs(isManual = false) {
 
         (settings.store.notifyOnAutoConnect || isManual) && showNotification({
             title: "Dev Companion Connected",
-            body: "Connected to WebSocket"
+            body: "Connected to WebSocket",
+            noPersist: true
         });
     });
 
@@ -116,7 +117,8 @@ function initWs(isManual = false) {
         showNotification({
             title: "Dev Companion Error",
             body: (e as ErrorEvent).message || "No Error Message",
-            color: "var(--status-danger, red)"
+            color: "var(--status-danger, red)",
+            noPersist: true,
         });
     });
 
@@ -128,7 +130,8 @@ function initWs(isManual = false) {
         showNotification({
             title: "Dev Companion Disconnected",
             body: e.reason || "No Reason provided",
-            color: "var(--status-danger, red)"
+            color: "var(--status-danger, red)",
+            noPersist: true,
         });
     });
 
@@ -159,7 +162,11 @@ function initWs(isManual = false) {
                     return reply("Expected exactly one 'find' matches, found " + keys.length);
 
                 const mod = candidates[keys[0]];
-                let src = String(mod.original ?? mod);
+                let src = String(mod.original ?? mod).replaceAll("\n", "");
+
+                if (src.startsWith("function(")) {
+                    src = "0," + src;
+                }
 
                 let i = 0;
 
@@ -231,10 +238,8 @@ function initWs(isManual = false) {
     });
 }
 
-const contextMenuPatch: NavContextMenuPatchCallback = kids => {
+const contextMenuPatch: NavContextMenuPatchCallback = children => () => {
-    if (kids.some(k => k?.props?.id === NAV_ID)) return;
+    children.unshift(
-
-    kids.unshift(
         <Menu.MenuItem
             id={NAV_ID}
             label="Reconnect Dev Companion"
@@ -250,7 +255,6 @@ export default definePlugin({
     name: "DevCompanion",
     description: "Dev Companion Plugin",
     authors: [Devs.Ven],
-    dependencies: ["ContextMenuAPI"],
     settings,
 
     start() {

src/plugins/emoteCloner.tsx

@@ -210,7 +210,7 @@ function isGifUrl(url: string) {
     return new URL(url).pathname.endsWith(".gif");
 }
 
-const messageContextMenuPatch: NavContextMenuPatchCallback = (children, props) => {
+const messageContextMenuPatch: NavContextMenuPatchCallback = (children, props) => () => {
     const { favoriteableId, itemHref, itemSrc, favoriteableType } = props ?? {};
 
     if (!favoriteableId || favoriteableType !== "emoji") return;
@@ -220,17 +220,15 @@ const messageContextMenuPatch: NavContextMenuPatchCallback = (children, props) =
     const name = match[1] ?? "FakeNitroEmoji";
 
     const group = findGroupChildrenByChildId("copy-link", children);
-    if (group && !group.some(child => child?.props?.id === "emote-cloner"))
+    if (group) group.push(buildMenuItem(favoriteableId, name, isGifUrl(itemHref ?? itemSrc)));
-        group.push(buildMenuItem(favoriteableId, name, isGifUrl(itemHref ?? itemSrc)));
 };
 
-const expressionPickerPatch: NavContextMenuPatchCallback = (children, props: { target: HTMLElement; }) => {
+const expressionPickerPatch: NavContextMenuPatchCallback = (children, props: { target: HTMLElement; }) => () => {
     const { id, name, type } = props?.target?.dataset ?? {};
     if (!id || !name || type !== "emoji") return;
 
     const firstChild = props.target.firstChild as HTMLImageElement;
 
-    if (!children.some(c => c?.props?.id === "emote-cloner"))
     children.push(buildMenuItem(id, name, firstChild && isGifUrl(firstChild.src)));
 };
 
@@ -238,7 +236,6 @@ export default definePlugin({
     name: "EmoteCloner",
     description: "Adds a Clone context menu item to emotes to clone them your own server",
     authors: [Devs.Ven, Devs.Nuckyz],
-    dependencies: ["MenuItemDeobfuscatorAPI", "ContextMenuAPI"],
 
     start() {
         addContextMenuPatch("message", messageContextMenuPatch);

src/plugins/fakeNitro.tsx

@@ -17,20 +17,29 @@
 */
 
 import { addPreEditListener, addPreSendListener, removePreEditListener, removePreSendListener } from "@api/MessageEvents";
-import { migratePluginSettings, Settings } from "@api/settings";
+import { definePluginSettings, migratePluginSettings, Settings } from "@api/settings";
 import { Devs } from "@utils/constants";
-import { ApngDisposeOp, getGifEncoder, importApngJs } from "@utils/dependencies";
+import { ApngBlendOp, ApngDisposeOp, getGifEncoder, importApngJs } from "@utils/dependencies";
 import { getCurrentGuild } from "@utils/discord";
 import { proxyLazy } from "@utils/proxyLazy";
 import definePlugin, { OptionType } from "@utils/types";
 import { findByCodeLazy, findByPropsLazy, findLazy, findStoreLazy } from "@webpack";
-import { ChannelStore, FluxDispatcher, PermissionStore, UserStore } from "@webpack/common";
+import { ChannelStore, FluxDispatcher, Parser, PermissionStore, UserStore } from "@webpack/common";
+import type { Message } from "discord-types/general";
+import type { ReactNode } from "react";
 
 const DRAFT_TYPE = 0;
 const promptToUpload = findByCodeLazy("UPLOAD_FILE_LIMIT_ERROR");
 const UserSettingsProtoStore = findStoreLazy("UserSettingsProtoStore");
 const PreloadedUserSettingsProtoHandler = findLazy(m => m.ProtoClass?.typeName === "discord_protos.discord_users.v1.PreloadedUserSettings");
 const ReaderFactory = findByPropsLazy("readerFactory");
+const StickerStore = findStoreLazy("StickersStore") as {
+    getPremiumPacks(): StickerPack[];
+    getAllGuildStickers(): Map<string, Sticker[]>;
+    getStickerById(id: string): Sticker | undefined;
+};
+const EmojiStore = findStoreLazy("EmojiStore");
+
 
 function searchProtoClass(localName: string, parentProtoClass: any) {
     if (!parentProtoClass) return;
@@ -86,18 +95,74 @@ interface StickerPack {
     stickers: Sticker[];
 }
 
+const fakeNitroEmojiRegex = /\/emojis\/(\d+?)\.(png|webp|gif)/;
+const fakeNitroStickerRegex = /\/stickers\/(\d+?)\./;
+const fakeNitroGifStickerRegex = /\/attachments\/\d+?\/\d+?\/(\d+?)\.gif/;
+
+const settings = definePluginSettings({
+    enableEmojiBypass: {
+        description: "Allow sending fake emojis",
+        type: OptionType.BOOLEAN,
+        default: true,
+        restartNeeded: true
+    },
+    emojiSize: {
+        description: "Size of the emojis when sending",
+        type: OptionType.SLIDER,
+        default: 48,
+        markers: [32, 48, 64, 128, 160, 256, 512]
+    },
+    transformEmojis: {
+        description: "Whether to transform fake emojis into real ones",
+        type: OptionType.BOOLEAN,
+        default: true,
+        restartNeeded: true
+    },
+    enableStickerBypass: {
+        description: "Allow sending fake stickers",
+        type: OptionType.BOOLEAN,
+        default: true,
+        restartNeeded: true
+    },
+    stickerSize: {
+        description: "Size of the stickers when sending",
+        type: OptionType.SLIDER,
+        default: 160,
+        markers: [32, 64, 128, 160, 256, 512]
+    },
+    transformStickers: {
+        description: "Whether to transform fake stickers into real ones",
+        type: OptionType.BOOLEAN,
+        default: true,
+        restartNeeded: true
+    },
+    transformCompoundSentence: {
+        description: "Whether to transform fake stickers and emojis in compound sentences (sentences with more content than just the fake emoji or sticker link)",
+        type: OptionType.BOOLEAN,
+        default: false
+    },
+    enableStreamQualityBypass: {
+        description: "Allow streaming in nitro quality",
+        type: OptionType.BOOLEAN,
+        default: true,
+        restartNeeded: true
+    }
+});
+
 migratePluginSettings("FakeNitro", "NitroBypass");
 
 export default definePlugin({
     name: "FakeNitro",
-    authors: [Devs.Arjix, Devs.D3SOX, Devs.Ven, Devs.obscurity, Devs.captain, Devs.Nuckyz],
+    authors: [Devs.Arjix, Devs.D3SOX, Devs.Ven, Devs.obscurity, Devs.captain, Devs.Nuckyz, Devs.AutumnVN],
     description: "Allows you to stream in nitro quality, send fake emojis/stickers and use client themes.",
     dependencies: ["MessageEventsAPI"],
 
+    settings,
+
     patches: [
         {
             find: ".PREMIUM_LOCKED;",
-            predicate: () => Settings.plugins.FakeNitro.enableEmojiBypass === true,
+            predicate: () => settings.store.enableEmojiBypass,
             replacement: [
                 {
                     match: /(?<=(\i)=\i\.intention)/,
@@ -115,7 +180,7 @@ export default definePlugin({
         },
         {
             find: "canUseAnimatedEmojis:function",
-            predicate: () => Settings.plugins.FakeNitro.enableEmojiBypass === true,
+            predicate: () => settings.store.enableEmojiBypass,
             replacement: {
                 match: /((?:canUseEmojisEverywhere|canUseAnimatedEmojis):function\(\i)\){(.+?\))/g,
                 replace: (_, rest, premiumCheck) => `${rest},fakeNitroIntention){${premiumCheck}||fakeNitroIntention==null||[${EmojiIntentions.CHAT},${EmojiIntentions.GUILD_STICKER_RELATED_EMOJI}].includes(fakeNitroIntention)`
@@ -123,7 +188,7 @@ export default definePlugin({
         },
         {
             find: "canUseStickersEverywhere:function",
-            predicate: () => Settings.plugins.FakeNitro.enableStickerBypass === true,
+            predicate: () => settings.store.enableStickerBypass,
             replacement: {
                 match: /canUseStickersEverywhere:function\(\i\){/,
                 replace: "$&return true;"
@@ -131,7 +196,7 @@ export default definePlugin({
         },
         {
             find: "\"SENDABLE\"",
-            predicate: () => Settings.plugins.FakeNitro.enableStickerBypass === true,
+            predicate: () => settings.store.enableStickerBypass,
             replacement: {
                 match: /(\w+)\.available\?/,
                 replace: "true?"
@@ -139,7 +204,7 @@ export default definePlugin({
         },
         {
             find: "canStreamHighQuality:function",
-            predicate: () => Settings.plugins.FakeNitro.enableStreamQualityBypass === true,
+            predicate: () => settings.store.enableStreamQualityBypass,
             replacement: [
                 "canUseHighVideoUploadQuality",
                 "canStreamHighQuality",
@@ -153,7 +218,7 @@ export default definePlugin({
         },
         {
             find: "STREAM_FPS_OPTION.format",
-            predicate: () => Settings.plugins.FakeNitro.enableStreamQualityBypass === true,
+            predicate: () => settings.store.enableStreamQualityBypass,
             replacement: {
                 match: /(userPremiumType|guildPremiumTier):.{0,10}TIER_\d,?/g,
                 replace: ""
@@ -186,77 +251,65 @@ export default definePlugin({
                 replace: (_, rest, backgroundGradientPresetId, originalCall, theme) => `${rest}$self.handleGradientThemeSelect(${backgroundGradientPresetId},${theme},()=>${originalCall});`
             }
         },
-        {
-            find: 'jumboable?"jumbo":"default"',
-            predicate: () => Settings.plugins.FakeNitro.transformEmojis === true,
-            replacement: {
-                match: /jumboable\?"jumbo":"default",emojiId.+?}}\)},(?<=(\i)=function\(\i\){var \i=\i\.node.+?)/,
-                replace: (m, component) => `${m}fakeNitroEmojiComponentExport=($self.EmojiComponent=${component},void 0),`
-            }
-        },
         {
             find: '["strong","em","u","text","inlineCode","s","spoiler"]',
-            predicate: () => Settings.plugins.FakeNitro.transformEmojis === true,
             replacement: [
                 {
+                    predicate: () => settings.store.transformEmojis,
                     match: /1!==(\i)\.length\|\|1!==\i\.length/,
-                    replace: (m, content) => `${m}||${content}[0].target?.startsWith("https://cdn.discordapp.com/emojis/")`
+                    replace: (m, content) => `${m}||$self.shouldKeepEmojiLink(${content}[0])`
                 },
                 {
+                    predicate: () => settings.store.transformEmojis || settings.store.transformStickers,
                     match: /(?=return{hasSpoilerEmbeds:\i,content:(\i)})/,
-                    replace: (_, content) => `${content}=$self.patchFakeNitroEmojis(${content});`
+                    replace: (_, content) => `${content}=$self.patchFakeNitroEmojisOrRemoveStickersLinks(${content},arguments[2]?.formatInline);`
                 }
             ]
         },
         {
             find: "renderEmbeds=function",
-            predicate: () => Settings.plugins.FakeNitro.transformEmojis === true,
+            replacement: [
+                {
+                    predicate: () => settings.store.transformEmojis || settings.store.transformStickers,
+                    match: /(renderEmbeds=function\((\i)\){)(.+?embeds\.map\(\(function\((\i)\){)/,
+                    replace: (_, rest1, message, rest2, embed) => `${rest1}const fakeNitroMessage=${message};${rest2}if($self.shouldIgnoreEmbed(${embed},fakeNitroMessage))return null;`
+                },
+                {
+                    predicate: () => settings.store.transformStickers,
+                    match: /renderStickersAccessories=function\((\i)\){var (\i)=\(0,\i\.\i\)\(\i\),/,
+                    replace: (m, message, stickers) => `${m}${stickers}=$self.patchFakeNitroStickers(${stickers},${message}),`
+                },
+                {
+                    predicate: () => settings.store.transformStickers,
+                    match: /renderAttachments=function\(\i\){var (\i)=\i.attachments.+?;/,
+                    replace: (m, attachments) => `${m}${attachments}=$self.filterAttachments(${attachments});`
+                }
+            ]
+        },
+        {
+            find: ".STICKER_IN_MESSAGE_HOVER,",
+            predicate: () => settings.store.transformStickers,
+            replacement: [
+                {
+                    match: /var (\i)=\i\.renderableSticker,.{0,50}closePopout.+?channel:\i,closePopout:\i,/,
+                    replace: (m, renderableSticker) => `${m}renderableSticker:${renderableSticker},`
+                },
+                {
+                    match: /(emojiSection.{0,50}description:)(\i)(?<=(\i)\.sticker,.+?)(?=,)/,
+                    replace: (_, rest, reactNode, props) => `${rest}$self.addFakeNotice("STICKER",${reactNode},!!${props}.renderableSticker?.fake)`
+                }
+            ]
+        },
+        {
+            find: ".Messages.EMOJI_POPOUT_PREMIUM_JOINED_GUILD_DESCRIPTION",
+            predicate: () => settings.store.transformEmojis,
             replacement: {
-                match: /renderEmbeds=function\(\i\){.+?embeds\.map\(\(function\((\i)\){/,
+                match: /((\i)=\i\.node,\i=\i\.emojiSourceDiscoverableGuild)(.+?return )(.{0,450}Messages\.EMOJI_POPOUT_PREMIUM_JOINED_GUILD_DESCRIPTION.+?}\))/,
-                replace: (m, embed) => `${m}if(${embed}.url?.startsWith("https://cdn.discordapp.com/emojis/"))return null;`
+                replace: (_, rest1, node, rest2, reactNode) => `${rest1},fakeNitroNode=${node}${rest2}$self.addFakeNotice("EMOJI",${reactNode},fakeNitroNode.fake)`
             }
         }
     ],
 
-    options: {
-        enableEmojiBypass: {
-            description: "Allow sending fake emojis",
-            type: OptionType.BOOLEAN,
-            default: true,
-            restartNeeded: true,
-        },
-        emojiSize: {
-            description: "Size of the emojis when sending",
-            type: OptionType.SLIDER,
-            default: 48,
-            markers: [32, 48, 64, 128, 160, 256, 512],
-        },
-        transformEmojis: {
-            description: "Whether to transform fake emojis into real ones",
-            type: OptionType.BOOLEAN,
-            default: true,
-            restartNeeded: true,
-        },
-        enableStickerBypass: {
-            description: "Allow sending fake stickers",
-            type: OptionType.BOOLEAN,
-            default: true,
-            restartNeeded: true,
-        },
-        stickerSize: {
-            description: "Size of the stickers when sending",
-            type: OptionType.SLIDER,
-            default: 160,
-            markers: [32, 64, 128, 160, 256, 512],
-        },
-        enableStreamQualityBypass: {
-            description: "Allow streaming in nitro quality",
-            type: OptionType.BOOLEAN,
-            default: true,
-            restartNeeded: true,
-        }
-    },
-
     get guildId() {
         return getCurrentGuild()?.id;
     },
@@ -331,37 +384,166 @@ export default definePlugin({
         });
     },
 
-    EmojiComponent: null as any,
+    patchFakeNitroEmojisOrRemoveStickersLinks(content: Array<any>, inline: boolean) {
-
+        if (content.length > 1 && !settings.store.transformCompoundSentence) return content;
-    patchFakeNitroEmojis(content: Array<any>) {
-        if (!this.EmojiComponent) return content;
 
         const newContent: Array<any> = [];
 
+        let nextIndex = content.length;
+
         for (const element of content) {
             if (element.props?.trusted == null) {
                 newContent.push(element);
                 continue;
             }
 
-            const fakeNitroMatch = element.props.href.match(/https:\/\/cdn\.discordapp\.com\/emojis\/(\d+?)\.(png|webp|gif).+?(?=\s|$)/);
+            if (settings.store.transformEmojis) {
-            if (!fakeNitroMatch) {
+                const fakeNitroMatch = element.props.href.match(fakeNitroEmojiRegex);
+                if (fakeNitroMatch) {
+                    let url: URL | null = null;
+                    try {
+                        url = new URL(element.props.href);
+                    } catch { }
+
+                    const emojiName = EmojiStore.getCustomEmojiById(fakeNitroMatch[1])?.name ?? url?.searchParams.get("name") ?? "FakeNitroEmoji";
+
+                    newContent.push(Parser.defaultRules.customEmoji.react({
+                        jumboable: !inline && content.length === 1,
+                        animated: fakeNitroMatch[2] === "gif",
+                        emojiId: fakeNitroMatch[1],
+                        name: emojiName,
+                        fake: true
+                    }, void 0, { key: String(nextIndex++) }));
+
+                    continue;
+                }
+            }
+
+            if (settings.store.transformStickers) {
+                if (fakeNitroStickerRegex.test(element.props.href)) continue;
+
+                const gifMatch = element.props.href.match(fakeNitroGifStickerRegex);
+                if (gifMatch) {
+                    // There is no way to differentiate a regular gif attachment from a fake nitro animated sticker, so we check if the StickerStore contains the id of the fake sticker
+                    if (StickerStore.getStickerById(gifMatch[1])) continue;
+                }
+            }
+
             newContent.push(element);
+        }
+
+        const firstContent = newContent[0];
+        if (typeof firstContent === "string") newContent[0] = firstContent.trimStart();
+
+        return newContent;
+    },
+
+    patchFakeNitroStickers(stickers: Array<any>, message: Message) {
+        const itemsToMaybePush: Array<string> = [];
+
+        const contentItems = message.content.split(/\s/);
+        if (contentItems.length === 1 && !settings.store.transformCompoundSentence) itemsToMaybePush.push(contentItems[0]);
+        else itemsToMaybePush.push(...contentItems);
+
+        itemsToMaybePush.push(...message.attachments.filter(attachment => attachment.content_type === "image/gif").map(attachment => attachment.url));
+
+        for (const item of itemsToMaybePush) {
+            const imgMatch = item.match(fakeNitroStickerRegex);
+            if (imgMatch) {
+                let url: URL | null = null;
+                try {
+                    url = new URL(item);
+                } catch { }
+
+                const stickerName = StickerStore.getStickerById(imgMatch[1])?.name ?? url?.searchParams.get("name") ?? "FakeNitroSticker";
+                stickers.push({
+                    format_type: 1,
+                    id: imgMatch[1],
+                    name: stickerName,
+                    fake: true
+                });
+
                 continue;
             }
 
-            newContent.push((
+            const gifMatch = item.match(fakeNitroGifStickerRegex);
-                <this.EmojiComponent node={{
+            if (gifMatch) {
-                    type: "customEmoji",
+                if (!StickerStore.getStickerById(gifMatch[1])) continue;
-                    jumboable: content.length === 1,
+
-                    animated: fakeNitroMatch[2] === "gif",
+                const stickerName = StickerStore.getStickerById(gifMatch[1])?.name ?? "FakeNitroSticker";
-                    name: ":FakeNitroEmoji:",
+                stickers.push({
-                    emojiId: fakeNitroMatch[1]
+                    format_type: 2,
-                }} />
+                    id: gifMatch[1],
-            ));
+                    name: stickerName,
+                    fake: true
+                });
+            }
         }
 
-        return newContent;
+        return stickers;
+    },
+
+    shouldIgnoreEmbed(embed: Message["embeds"][number], message: Message) {
+        if (message.content.split(/\s/).length > 1 && !settings.store.transformCompoundSentence) return false;
+
+        switch (embed.type) {
+            case "image": {
+                if (settings.store.transformEmojis) {
+                    if (fakeNitroEmojiRegex.test(embed.url!)) return true;
+                }
+
+                if (settings.store.transformStickers) {
+                    if (fakeNitroStickerRegex.test(embed.url!)) return true;
+
+                    const gifMatch = embed.url!.match(fakeNitroGifStickerRegex);
+                    if (gifMatch) {
+                        // There is no way to differentiate a regular gif attachment from a fake nitro animated sticker, so we check if the StickerStore contains the id of the fake sticker
+                        if (StickerStore.getStickerById(gifMatch[1])) return true;
+                    }
+                }
+
+                break;
+            }
+        }
+
+        return false;
+    },
+
+    filterAttachments(attachments: Message["attachments"]) {
+        return attachments.filter(attachment => {
+            if (attachment.content_type !== "image/gif") return true;
+
+            const match = attachment.url.match(fakeNitroGifStickerRegex);
+            if (match) {
+                // There is no way to differentiate a regular gif attachment from a fake nitro animated sticker, so we check if the StickerStore contains the id of the fake sticker
+                if (StickerStore.getStickerById(match[1])) return false;
+            }
+
+            return true;
+        });
+    },
+
+    shouldKeepEmojiLink(link: any) {
+        return link.target && fakeNitroEmojiRegex.test(link.target);
+    },
+
+    addFakeNotice(type: "STICKER" | "EMOJI", node: Array<ReactNode>, fake: boolean) {
+        if (!fake) return node;
+
+        node = Array.isArray(node) ? node : [node];
+
+        switch (type) {
+            case "STICKER": {
+                node.push(" This is a FakeNitro sticker and renders like a real sticker only for you. Appears as a link to non-plugin users.");
+
+                return node;
+            }
+            case "EMOJI": {
+                node.push(" This is a FakeNitro emoji and renders like a real emoji only for you. Appears as a link to non-plugin users.");
+
+                return node;
+            }
+        }
     },
 
     hasPermissionToUseExternalEmojis(channelId: string) {
@@ -407,8 +589,17 @@ export default definePlugin({
         const scale = resolution / Math.max(width, height);
         ctx.scale(scale, scale);
 
-        let lastImg: HTMLImageElement | null = null;
+        let previousFrameData: ImageData;
-        for (const { left, top, width, height, disposeOp, img, delay } of frames) {
+
+        for (const frame of frames) {
+            const { left, top, width, height, img, delay, blendOp, disposeOp } = frame;
+
+            previousFrameData = ctx.getImageData(left, top, width, height);
+
+            if (blendOp === ApngBlendOp.SOURCE) {
+                ctx.clearRect(left, top, width, height);
+            }
+
             ctx.drawImage(img, left, top, width, height);
 
             const { data } = ctx.getImageData(0, 0, resolution, resolution);
@@ -419,19 +610,18 @@ export default definePlugin({
             gif.writeFrame(index, resolution, resolution, {
                 transparent: true,
                 palette,
-                delay,
+                delay
             });
 
             if (disposeOp === ApngDisposeOp.BACKGROUND) {
                 ctx.clearRect(left, top, width, height);
-            } else if (disposeOp === ApngDisposeOp.PREVIOUS && lastImg) {
+            } else if (disposeOp === ApngDisposeOp.PREVIOUS) {
-                ctx.drawImage(lastImg, left, top, width, height);
+                ctx.putImageData(previousFrameData, left, top);
             }
-
-            lastImg = img;
         }
 
         gif.finish();
+
         const file = new File([gif.bytesView()], `${stickerId}.gif`, { type: "image/gif" });
         promptToUpload([file], ChannelStore.getChannel(channelId), DRAFT_TYPE);
     },
@@ -442,13 +632,6 @@ export default definePlugin({
             return;
         }
 
-        const EmojiStore = findByPropsLazy("getCustomEmojiById");
-        const StickerStore = findByPropsLazy("getAllGuildStickers") as {
-            getPremiumPacks(): StickerPack[];
-            getAllGuildStickers(): Map<string, Sticker[]>;
-            getStickerById(id: string): Sticker | undefined;
-        };
-
         function getWordBoundary(origStr: string, offset: number) {
             return (!origStr[offset] || /\s/.test(origStr[offset])) ? "" : " ";
         }
@@ -469,7 +652,7 @@ export default definePlugin({
 
                 let link = this.getStickerLink(sticker.id);
                 if (sticker.format_type === 2) {
-                    this.sendAnimatedSticker(this.getStickerLink(sticker.id), sticker.id, channelId);
+                    this.sendAnimatedSticker(link, sticker.id, channelId);
                     return { cancel: true };
                 } else {
                     if ("pack_id" in sticker) {
@@ -483,7 +666,7 @@ export default definePlugin({
                     }
 
                     delete extra.stickerIds;
-                    messageObj.content += " " + link;
+                    messageObj.content += " " + link + `&name=${encodeURIComponent(sticker.name)}`;
                 }
             }
 
@@ -493,7 +676,10 @@ export default definePlugin({
                     if (emoji.guildId === guildId && !emoji.animated) continue;
 
                     const emojiString = `<${emoji.animated ? "a" : ""}:${emoji.originalName || emoji.name}:${emoji.id}>`;
-                    const url = emoji.url.replace(/\?size=\d+/, `?size=${Settings.plugins.FakeNitro.emojiSize}`);
+                    const url = emoji.url.replace(/\?size=\d+/, "?" + new URLSearchParams({
+                        size: Settings.plugins.FakeNitro.emojiSize,
+                        name: encodeURIComponent(emoji.name)
+                    }));
                     messageObj.content = messageObj.content.replace(emojiString, (match, offset, origStr) => {
                         return `${getWordBoundary(origStr, offset - 1)}${url}${getWordBoundary(origStr, offset + match.length)}`;
                     });
@@ -513,7 +699,10 @@ export default definePlugin({
                 if (emoji == null || (emoji.guildId === guildId && !emoji.animated)) continue;
                 if (!emoji.require_colons) continue;
 
-                const url = emoji.url.replace(/\?size=\d+/, `?size=${Settings.plugins.FakeNitro.emojiSize}`);
+                const url = emoji.url.replace(/\?size=\d+/, "?" + new URLSearchParams({
+                    size: Settings.plugins.FakeNitro.emojiSize,
+                    name: encodeURIComponent(emoji.name)
+                }));
                 messageObj.content = messageObj.content.replace(emojiStr, (match, offset, origStr) => {
                     return `${getWordBoundary(origStr, offset - 1)}${url}${getWordBoundary(origStr, offset + match.length)}`;
                 });

src/plugins/fakeProfileThemes.tsx

@@ -0,0 +1,145 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+// This plugin is a port from Alyxia's Vendetta plugin
+import { definePluginSettings } from "@api/settings";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Devs } from "@utils/constants";
+import { Margins } from "@utils/margins";
+import { copyWithToast } from "@utils/misc";
+import definePlugin, { OptionType } from "@utils/types";
+import { Button, Forms } from "@webpack/common";
+import { User } from "discord-types/general";
+import virtualMerge from "virtual-merge";
+
+interface UserProfile extends User {
+    themeColors?: Array<number>;
+}
+
+interface Colors {
+    primary: number;
+    accent: number;
+}
+
+function encode(primary: number, accent: number): string {
+    const message = `[#${primary.toString(16).padStart(6, "0")},#${accent.toString(16).padStart(6, "0")}]`;
+    const padding = "";
+    const encoded = Array.from(message)
+        .map(x => x.codePointAt(0))
+        .filter(x => x! >= 0x20 && x! <= 0x7f)
+        .map(x => String.fromCodePoint(x! + 0xe0000))
+        .join("");
+
+    return (padding || "") + " " + encoded;
+}
+
+// Courtesy of Cynthia.
+function decode(bio: string): Array<number> | null {
+    if (bio == null) return null;
+
+    const colorString = bio.match(
+        /\u{e005b}\u{e0023}([\u{e0061}-\u{e0066}\u{e0041}-\u{e0046}\u{e0030}-\u{e0039}]+?)\u{e002c}\u{e0023}([\u{e0061}-\u{e0066}\u{e0041}-\u{e0046}\u{e0030}-\u{e0039}]+?)\u{e005d}/u,
+    );
+    if (colorString != null) {
+        const parsed = [...colorString[0]]
+            .map(x => String.fromCodePoint(x.codePointAt(0)! - 0xe0000))
+            .join("");
+        const colors = parsed
+            .substring(1, parsed.length - 1)
+            .split(",")
+            .map(x => parseInt(x.replace("#", "0x"), 16));
+
+        return colors;
+    } else {
+        return null;
+    }
+}
+
+const settings = definePluginSettings({
+    nitroFirst: {
+        description: "Default color source if both are present",
+        type: OptionType.SELECT,
+        options: [
+            { label: "Nitro colors", value: true, default: true },
+            { label: "Fake colors", value: false },
+        ]
+    }
+});
+
+export default definePlugin({
+    name: "FakeProfileThemes",
+    description: "Allows profile theming by hiding the colors in your bio thanks to invisible 3y3 encoding",
+    authors: [Devs.Alyxia, Devs.Remty],
+    patches: [
+        {
+            find: "getUserProfile=",
+            replacement: {
+                match: /(?<=getUserProfile=function\(\i\){return )(\i\[\i\])/,
+                replace: "$self.colorDecodeHook($1)"
+            }
+        }, {
+            find: ".USER_SETTINGS_PROFILE_THEME_ACCENT",
+            replacement: {
+                match: /RESET_PROFILE_THEME}\)(?<=},color:(\i).+?},color:(\i).+?)/,
+                replace: "$&,$self.addCopy3y3Button({primary:$1,accent:$2})"
+            }
+        }
+    ],
+    settingsAboutComponent: () => (
+        <Forms.FormSection>
+            <Forms.FormTitle tag="h3">Usage</Forms.FormTitle>
+            <Forms.FormText>
+                After enabling this plugin, you will see custom colors in the profiles of other people using compatible plugins. <br />
+                To set your own colors:
+                <ul>
+                    <li>• go to your profile settings</li>
+                    <li>• choose your own colors in the Nitro preview</li>
+                    <li>• click the "Copy 3y3" button</li>
+                    <li>• paste the invisible text anywhere in your bio</li>
+                </ul><br />
+                <b>Please note:</b> if you are using a theme which hides nitro ads, you should disable it temporarily to set colors.
+            </Forms.FormText>
+        </Forms.FormSection>),
+    settings,
+    colorDecodeHook(user: UserProfile) {
+        if (user) {
+            // don't replace colors if already set with nitro
+            if (settings.store.nitroFirst && user.themeColors) return user;
+            const colors = decode(user.bio);
+            if (colors) {
+                return virtualMerge(user, {
+                    premiumType: 2,
+                    themeColors: colors
+                });
+            }
+        }
+        return user;
+    },
+    addCopy3y3Button: ErrorBoundary.wrap(function ({ primary, accent }: Colors) {
+        return <Button
+            onClick={() => {
+                const colorString = encode(primary, accent);
+                copyWithToast(colorString);
+            }}
+            color={Button.Colors.PRIMARY}
+            size={Button.Sizes.XLARGE}
+            className={Margins.left16}
+        >Copy 3y3
+        </Button >;
+    }, { noop: true }),
+});

src/plugins/friendInvites.ts

@@ -19,12 +19,16 @@
 import { ApplicationCommandInputType, sendBotMessage } from "@api/Commands";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
-import { findByProps } from "@webpack";
+import { findByPropsLazy } from "@webpack";
+import { RestAPI, UserStore } from "@webpack/common";
+
+const FriendInvites = findByPropsLazy("createFriendInvite");
+const uuid = findByPropsLazy("v4", "v1");
 
 export default definePlugin({
     name: "FriendInvites",
     description: "Create and manage friend invite links via slash commands (/create friend invite, /view friend invites, /revoke friend invites).",
-    authors: [Devs.afn],
+    authors: [Devs.afn, Devs.Dziurwa],
     dependencies: ["CommandsAPI"],
     commands: [
         {
@@ -32,14 +36,35 @@ export default definePlugin({
             description: "Generates a friend invite link.",
             inputType: ApplicationCommandInputType.BOT,
             execute: async (_, ctx) => {
-                const friendInvites = findByProps("createFriendInvite");
+                if (!UserStore.getCurrentUser().phone)
-                const createInvite = await friendInvites.createFriendInvite();
+                    return sendBotMessage(ctx.channel.id, {
+                        content: "You need to have a phone number connected to your account to create a friend invite!"
+                    });
 
-                return void sendBotMessage(ctx.channel.id, {
+                const random = uuid.v4();
+                const invite = await RestAPI.post({
+                    url: "/friend-finder/find-friends",
+                    body: {
+                        modified_contacts: {
+                            [random]: [1, "", ""]
+                        },
+                        phone_contact_methods_count: 1
+                    }
+                }).then(res =>
+                    FriendInvites.createFriendInvite({
+                        code: res.body.invite_suggestions[0][3],
+                        recipient_phone_number_or_email: random,
+                        contact_visibility: 1,
+                        filter_visibilities: [],
+                        filtered_invite_suggestions_index: 1
+                    })
+                );
+
+                sendBotMessage(ctx.channel.id, {
                     content: `
-                        discord.gg/${createInvite.code} ·
+                        discord.gg/${invite.code} ·
-                        Expires: <t:${new Date(createInvite.expires_at).getTime() / 1000}:R> ·
+                        Expires: <t:${new Date(invite.expires_at).getTime() / 1000}:R> ·
-                        Max uses: \`${createInvite.max_uses}\`
+                        Max uses: \`${invite.max_uses}\`
                     `.trim().replace(/\s+/g, " ")
                 });
             },
@@ -49,15 +74,16 @@ export default definePlugin({
             description: "View a list of all generated friend invites.",
             inputType: ApplicationCommandInputType.BOT,
             execute: async (_, ctx) => {
-                const friendInvites = findByProps("createFriendInvite");
+                const invites = await FriendInvites.getAllFriendInvites();
-                const invites = await friendInvites.getAllFriendInvites();
                 const friendInviteList = invites.map(i =>
-                    `_discord.gg/${i.code}_ ·
+                    `
+                    _discord.gg/${i.code}_ ·
                     Expires: <t:${new Date(i.expires_at).getTime() / 1000}:R> ·
-                    Times used: \`${i.uses}/${i.max_uses}\``.trim().replace(/\s+/g, " ")
+                    Times used: \`${i.uses}/${i.max_uses}\`
+                    `.trim().replace(/\s+/g, " ")
                 );
 
-                return void sendBotMessage(ctx.channel.id, {
+                sendBotMessage(ctx.channel.id, {
                     content: friendInviteList.join("\n") || "You have no active friend invites!"
                 });
             },
@@ -67,7 +93,7 @@ export default definePlugin({
             description: "Revokes all generated friend invites.",
             inputType: ApplicationCommandInputType.BOT,
             execute: async (_, ctx) => {
-                await findByProps("createFriendInvite").revokeFriendInvites();
+                await FriendInvites.revokeFriendInvites();
 
                 return void sendBotMessage(ctx.channel.id, {
                     content: "All friend invites have been revoked."

src/plugins/gameActivityToggle/index.tsx

@@ -0,0 +1,85 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { getSettingStoreLazy } from "@api/SettingsStore";
+import { disableStyle, enableStyle } from "@api/Styles";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Devs } from "@utils/constants";
+import definePlugin from "@utils/types";
+import { findByCodeLazy } from "@webpack";
+
+import style from "./style.css?managed";
+
+const ShowCurrentGame = getSettingStoreLazy<boolean>("status", "showCurrentGame");
+const Button = findByCodeLazy("Button.Sizes.NONE,disabled:");
+
+function makeIcon(showCurrentGame?: boolean) {
+    return function () {
+        return (
+            <svg
+                width="24"
+                height="24"
+                viewBox="0 96 960 960"
+            >
+                <path fill="currentColor" d="M182 856q-51 0-79-35.5T82 734l42-300q9-60 53.5-99T282 296h396q60 0 104.5 39t53.5 99l42 300q7 51-21 86.5T778 856q-21 0-39-7.5T706 826l-90-90H344l-90 90q-15 15-33 22.5t-39 7.5Zm498-240q17 0 28.5-11.5T720 576q0-17-11.5-28.5T680 536q-17 0-28.5 11.5T640 576q0 17 11.5 28.5T680 616Zm-80-120q17 0 28.5-11.5T640 456q0-17-11.5-28.5T600 416q-17 0-28.5 11.5T560 456q0 17 11.5 28.5T600 496ZM310 616h60v-70h70v-60h-70v-70h-60v70h-70v60h70v70Z" />
+                {!showCurrentGame && <line x1="920" y1="280" x2="40" y2="880" stroke="var(--status-danger)" stroke-width="80" />}
+            </svg>
+        );
+    };
+}
+
+function GameActivityToggleButton() {
+    const showCurrentGame = ShowCurrentGame?.useSetting();
+
+    return (
+        <Button
+            tooltipText={showCurrentGame ? "Disable Game Activity" : "Enable Game Activity"}
+            icon={makeIcon(showCurrentGame)}
+            role="switch"
+            aria-checked={!showCurrentGame}
+            onClick={() => ShowCurrentGame?.updateSetting(old => !old)}
+        />
+    );
+}
+
+export default definePlugin({
+    name: "GameActivityToggle",
+    description: "Adds a button next to the mic and deafen button to toggle game activity.",
+    authors: [Devs.Nuckyz],
+    dependencies: ["SettingsStoreAPI"],
+
+    patches: [
+        {
+            find: ".Messages.ACCOUNT_SPEAKING_WHILE_MUTED",
+            replacement: {
+                match: /this\.renderNameZone\(\).+?children:\[/,
+                replace: "$&$self.GameActivityToggleButton(),"
+            }
+        }
+    ],
+
+    GameActivityToggleButton: ErrorBoundary.wrap(GameActivityToggleButton, { noop: true }),
+
+    start() {
+        enableStyle(style);
+    },
+
+    stop() {
+        disableStyle(style);
+    }
+});

src/plugins/gameActivityToggle/style.css

@@ -0,0 +1,3 @@
+[class*="withTagAsButton"] {
+    min-width: 88px;
+}

src/plugins/gifPaste.ts

@@ -0,0 +1,47 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { Devs } from "@utils/constants";
+import definePlugin from "@utils/types";
+import { filters, mapMangledModuleLazy } from "@webpack";
+import { ComponentDispatch } from "@webpack/common";
+
+const ExpressionPickerState = mapMangledModuleLazy('name:"expression-picker-last-active-view"', {
+    close: filters.byCode("activeView:null", "setState")
+});
+
+export default definePlugin({
+    name: "GifPaste",
+    description: "Makes picking a gif in the gif picker insert a link into the chatbox instead of instantly sending it",
+    authors: [Devs.Ven],
+
+    patches: [{
+        find: ".handleSelectGIF=",
+        replacement: {
+            match: /\.handleSelectGIF=function.+?\{/,
+            replace: ".handleSelectGIF=function(gif){return $self.handleSelect(gif);"
+        }
+    }],
+
+    handleSelect(gif?: { url: string; }) {
+        if (gif) {
+            ComponentDispatch.dispatchToLastSubscribed("INSERT_TEXT", { rawText: gif.url + " " });
+            ExpressionPickerState.close();
+        }
+    }
+});

src/plugins/ignoreActivities.tsx

@@ -88,7 +88,7 @@ function ToggleIconOn({ forceWhite }: { forceWhite?: boolean; }) {
     );
 }
 
-function ToggleActivityComponent({ activity, forceWhite }: { activity: IgnoredActivity; forceWhite?: boolean; }) {
+function ToggleActivityComponent({ activity, forceWhite, forceLeftMargin }: { activity: IgnoredActivity; forceWhite?: boolean; forceLeftMargin?: boolean; }) {
     const forceUpdate = useForceUpdater();
 
     return (
@@ -101,6 +101,7 @@ function ToggleActivityComponent({ activity, forceWhite }: { activity: IgnoredAc
                     role="button"
                     aria-label="Toggle activity"
                     tabIndex={0}
+                    style={forceLeftMargin ? { marginLeft: "2px" } : undefined}
                     onClick={e => handleActivityToggle(e, activity, forceUpdate)}
                 >
                     {
@@ -147,8 +148,8 @@ export default definePlugin({
         {
             find: ".Messages.SETTINGS_GAMES_TOGGLE_OVERLAY",
             replacement: {
-                match: /!(\i)\|\|(null==\i\)return null;var \i=(\i)\.overlay.+?children:)(\[.{0,70}overlayStatusText.+?\])(?=}\)}\(\))/,
+                match: /!(\i)(\)return null;var \i=(\i)\.overlay.+?children:)(\[.{0,70}overlayStatusText.+?\])(?=}\)}\(\))/,
-                replace: (_, platformCheck, restWithoutPlatformCheck, props, children) => ""
+                replace: (_, platformCheck, restWithoutPlatformCheck, props, children) => "false"
                     + `${restWithoutPlatformCheck}`
                     + `(${platformCheck}?${children}:[])`
                     + `.concat(Vencord.Plugins.plugins.IgnoreActivities.renderToggleGameActivityButton(${props}))`
@@ -200,7 +201,7 @@ export default definePlugin({
     renderToggleGameActivityButton(props: { id?: string; exePath: string; }) {
         return (
             <ErrorBoundary noop>
-                <ToggleActivityComponent activity={{ id: props.id ?? props.exePath, type: ActivitiesTypes.Game }} />
+                <ToggleActivityComponent activity={{ id: props.id ?? props.exePath, type: ActivitiesTypes.Game }} forceLeftMargin={true} />
             </ErrorBoundary>
         );
     },

src/plugins/imageZoom/components/Magnifier.tsx

@@ -0,0 +1,198 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { FluxDispatcher, React, useRef, useState } from "@webpack/common";
+
+import { ELEMENT_ID } from "../constants";
+import { settings } from "../index";
+import { waitFor } from "../utils/waitFor";
+
+interface Vec2 {
+    x: number,
+    y: number;
+}
+
+export interface MagnifierProps {
+    zoom: number;
+    size: number,
+    instance: any;
+}
+
+export const Magnifier: React.FC<MagnifierProps> = ({ instance, size: initialSize, zoom: initalZoom }) => {
+    const [ready, setReady] = useState(false);
+
+    const [lensPosition, setLensPosition] = useState<Vec2>({ x: 0, y: 0 });
+    const [imagePosition, setImagePosition] = useState<Vec2>({ x: 0, y: 0 });
+    const [opacity, setOpacity] = useState(0);
+
+    const isShiftDown = useRef(false);
+
+    const zoom = useRef(initalZoom);
+    const size = useRef(initialSize);
+
+    const element = useRef<HTMLDivElement | null>(null);
+    const currentVideoElementRef = useRef<HTMLVideoElement | null>(null);
+    const originalVideoElementRef = useRef<HTMLVideoElement | null>(null);
+    const imageRef = useRef<HTMLImageElement | null>(null);
+
+    // since we accessing document im gonna use useLayoutEffect
+    React.useLayoutEffect(() => {
+        const onKeyDown = (e: KeyboardEvent) => {
+            if (e.key === "Shift") {
+                isShiftDown.current = true;
+            }
+        };
+        const onKeyUp = (e: KeyboardEvent) => {
+            if (e.key === "Shift") {
+                isShiftDown.current = false;
+            }
+        };
+        const syncVideos = () => {
+            currentVideoElementRef.current!.currentTime = originalVideoElementRef.current!.currentTime;
+        };
+
+        const updateMousePosition = (e: MouseEvent) => {
+            if (instance.state.mouseOver && instance.state.mouseDown) {
+                const offset = size.current / 2;
+                const pos = { x: e.pageX, y: e.pageY };
+                const x = -((pos.x - element.current!.getBoundingClientRect().left) * zoom.current - offset);
+                const y = -((pos.y - element.current!.getBoundingClientRect().top) * zoom.current - offset);
+                setLensPosition({ x: e.x - offset, y: e.y - offset });
+                setImagePosition({ x, y });
+                setOpacity(1);
+            } else {
+                setOpacity(0);
+            }
+
+        };
+
+        const onMouseDown = (e: MouseEvent) => {
+            if (instance.state.mouseOver && e.button === 0 /* left click */) {
+                zoom.current = settings.store.zoom;
+                size.current = settings.store.size;
+
+                // close context menu if open
+                if (document.getElementById("image-context")) {
+                    FluxDispatcher.dispatch({ type: "CONTEXT_MENU_CLOSE" });
+                }
+
+                updateMousePosition(e);
+                setOpacity(1);
+            }
+        };
+
+        const onMouseUp = () => {
+            setOpacity(0);
+            if (settings.store.saveZoomValues) {
+                settings.store.zoom = zoom.current;
+                settings.store.size = size.current;
+            }
+        };
+
+        const onWheel = async (e: WheelEvent) => {
+            if (instance.state.mouseOver && instance.state.mouseDown && !isShiftDown.current) {
+                const val = zoom.current + ((e.deltaY / 100) * (settings.store.invertScroll ? -1 : 1)) * settings.store.zoomSpeed;
+                zoom.current = val <= 1 ? 1 : val;
+                updateMousePosition(e);
+            }
+            if (instance.state.mouseOver && instance.state.mouseDown && isShiftDown.current) {
+                const val = size.current + (e.deltaY * (settings.store.invertScroll ? -1 : 1)) * settings.store.zoomSpeed;
+                size.current = val <= 50 ? 50 : val;
+                updateMousePosition(e);
+            }
+        };
+
+        waitFor(() => instance.state.readyState === "READY", () => {
+            const elem = document.getElementById(ELEMENT_ID) as HTMLDivElement;
+            element.current = elem;
+            elem.firstElementChild!.setAttribute("draggable", "false");
+            if (instance.props.animated) {
+                originalVideoElementRef.current = elem!.querySelector("video")!;
+                originalVideoElementRef.current.addEventListener("timeupdate", syncVideos);
+                setReady(true);
+            } else {
+                setReady(true);
+            }
+        });
+        document.addEventListener("keydown", onKeyDown);
+        document.addEventListener("keyup", onKeyUp);
+        document.addEventListener("mousemove", updateMousePosition);
+        document.addEventListener("mousedown", onMouseDown);
+        document.addEventListener("mouseup", onMouseUp);
+        document.addEventListener("wheel", onWheel);
+        return () => {
+            document.removeEventListener("keydown", onKeyDown);
+            document.removeEventListener("keyup", onKeyUp);
+            document.removeEventListener("mousemove", updateMousePosition);
+            document.removeEventListener("mousedown", onMouseDown);
+            document.removeEventListener("mouseup", onMouseUp);
+            document.removeEventListener("wheel", onWheel);
+
+            if (settings.store.saveZoomValues) {
+                settings.store.zoom = zoom.current;
+                settings.store.size = size.current;
+            }
+        };
+    }, []);
+
+    if (!ready) return null;
+
+    const box = element.current!.getBoundingClientRect();
+
+    return (
+        <div
+            className="vc-imgzoom-lens"
+            style={{
+                opacity,
+                width: size.current + "px",
+                height: size.current + "px",
+                transform: `translate(${lensPosition.x}px, ${lensPosition.y}px)`,
+            }}
+        >
+            {instance.props.animated ?
+                (
+                    <video
+                        ref={currentVideoElementRef}
+                        style={{
+                            position: "absolute",
+                            left: `${imagePosition.x}px`,
+                            top: `${imagePosition.y}px`
+                        }}
+                        width={`${box.width * zoom.current}px`}
+                        height={`${box.height * zoom.current}px`}
+                        poster={instance.props.src}
+                        src={originalVideoElementRef.current?.src ?? instance.props.src}
+                        autoPlay
+                        loop
+                    />
+                ) : (
+                    <img
+                        ref={imageRef}
+                        style={{
+                            position: "absolute",
+                            transform: `translate(${imagePosition.x}px, ${imagePosition.y}px)`
+                        }}
+                        width={`${box.width * zoom.current}px`}
+                        height={`${box.height * zoom.current}px`}
+                        src={instance.props.src}
+                        alt=""
+                    />
+                )}
+        </div>
+    );
+};

src/plugins/imageZoom/constants.ts

@@ -0,0 +1,19 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+export const ELEMENT_ID = "vc-imgzoom-magnify-modal";

src/plugins/imageZoom/index.tsx

@@ -0,0 +1,234 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { addContextMenuPatch, NavContextMenuPatchCallback, removeContextMenuPatch } from "@api/ContextMenu";
+import { definePluginSettings } from "@api/settings";
+import { disableStyle, enableStyle } from "@api/Styles";
+import { makeRange } from "@components/PluginSettings/components";
+import { Devs } from "@utils/constants";
+import { debounce } from "@utils/debounce";
+import definePlugin, { OptionType } from "@utils/types";
+import { Menu, React, ReactDOM } from "@webpack/common";
+import type { Root } from "react-dom/client";
+
+import { Magnifier, MagnifierProps } from "./components/Magnifier";
+import { ELEMENT_ID } from "./constants";
+import styles from "./styles.css?managed";
+
+export const settings = definePluginSettings({
+    saveZoomValues: {
+        type: OptionType.BOOLEAN,
+        description: "Whether to save zoom and lens size values",
+        default: true,
+    },
+
+    preventCarouselFromClosingOnClick: {
+        type: OptionType.BOOLEAN,
+        // Thanks chat gpt
+        description: "Allow the image modal in the image slideshow thing / carousel to remain open when clicking on the image",
+        default: true,
+    },
+
+    invertScroll: {
+        type: OptionType.BOOLEAN,
+        description: "Invert scroll",
+        default: true,
+    },
+
+    zoom: {
+        description: "Zoom of the lens",
+        type: OptionType.SLIDER,
+        markers: makeRange(1, 50, 4),
+        default: 2,
+        stickToMarkers: false,
+    },
+    size: {
+        description: "Radius / Size of the lens",
+        type: OptionType.SLIDER,
+        markers: makeRange(50, 1000, 50),
+        default: 100,
+        stickToMarkers: false,
+    },
+
+    zoomSpeed: {
+        description: "How fast the zoom / lens size changes",
+        type: OptionType.SLIDER,
+        markers: makeRange(0.1, 5, 0.2),
+        default: 0.5,
+        stickToMarkers: false,
+    },
+});
+
+
+const imageContextMenuPatch: NavContextMenuPatchCallback = children => () => {
+    children.push(
+        <Menu.MenuGroup id="image-zoom">
+            {/* thanks SpotifyControls */}
+            <Menu.MenuControlItem
+                id="zoom"
+                label="Zoom"
+                control={(props, ref) => (
+                    <Menu.MenuSliderControl
+                        ref={ref}
+                        {...props}
+                        minValue={1}
+                        maxValue={50}
+                        value={settings.store.zoom}
+                        onChange={debounce((value: number) => settings.store.zoom = value, 100)}
+                    />
+                )}
+            />
+            <Menu.MenuControlItem
+                id="size"
+                label="Lens Size"
+                control={(props, ref) => (
+                    <Menu.MenuSliderControl
+                        ref={ref}
+                        {...props}
+                        minValue={50}
+                        maxValue={1000}
+                        value={settings.store.size}
+                        onChange={debounce((value: number) => settings.store.size = value, 100)}
+                    />
+                )}
+            />
+            <Menu.MenuControlItem
+                id="zoom-speed"
+                label="Zoom Speed"
+                control={(props, ref) => (
+                    <Menu.MenuSliderControl
+                        ref={ref}
+                        {...props}
+                        minValue={0.1}
+                        maxValue={5}
+                        value={settings.store.zoomSpeed}
+                        onChange={debounce((value: number) => settings.store.zoomSpeed = value, 100)}
+                        renderValue={(value: number) => `${value.toFixed(3)}x`}
+                    />
+                )}
+            />
+        </Menu.MenuGroup>
+    );
+};
+
+export default definePlugin({
+    name: "ImageZoom",
+    description: "Lets you zoom in to images and gifs. Use scroll wheel to zoom in and shift + scroll wheel to increase lens radius / size",
+    authors: [Devs.Aria],
+    patches: [
+        {
+            find: '"renderLinkComponent","maxWidth"',
+            replacement: {
+                match: /(return\(.{1,100}\(\)\.wrapper.{1,100})(src)/,
+                replace: `$1id: '${ELEMENT_ID}',$2`
+            }
+        },
+
+        {
+            find: "handleImageLoad=",
+            replacement: [
+                {
+                    match: /(render=function\(\){.{1,500}limitResponsiveWidth.{1,600})onMouseEnter:/,
+                    replace: "$1...$self.makeProps(this),onMouseEnter:"
+                },
+
+                {
+                    match: /componentDidMount=function\(\){/,
+                    replace: "$&$self.renderMagnifier(this);",
+                },
+
+                {
+                    match: /componentWillUnmount=function\(\){/,
+                    replace: "$&$self.unMountMagnifier();"
+                }
+            ]
+        },
+
+        {
+            find: ".carouselModal,",
+            replacement: {
+                match: /onClick:(\i),/,
+                replace: "onClick:$self.settings.store.preventCarouselFromClosingOnClick ? () => {} : $1,"
+            }
+        }
+    ],
+
+    settings,
+
+    // to stop from rendering twice /shrug
+    currentMagnifierElement: null as React.FunctionComponentElement<MagnifierProps & JSX.IntrinsicAttributes> | null,
+    element: null as HTMLDivElement | null,
+
+    Magnifier,
+    root: null as Root | null,
+    makeProps(instance) {
+        return {
+            onMouseOver: () => this.onMouseOver(instance),
+            onMouseOut: () => this.onMouseOut(instance),
+            onMouseDown: (e: React.MouseEvent) => this.onMouseDown(e, instance),
+            onMouseUp: () => this.onMouseUp(instance),
+            id: instance.props.id,
+        };
+    },
+
+    renderMagnifier(instance) {
+        if (instance.props.id === ELEMENT_ID) {
+            if (!this.currentMagnifierElement) {
+                this.currentMagnifierElement = <Magnifier size={settings.store.size} zoom={settings.store.zoom} instance={instance} />;
+                this.root = ReactDOM.createRoot(this.element!);
+                this.root.render(this.currentMagnifierElement);
+            }
+        }
+    },
+
+    unMountMagnifier() {
+        this.root?.unmount();
+        this.currentMagnifierElement = null;
+        this.root = null;
+    },
+
+    onMouseOver(instance) {
+        instance.setState((state: any) => ({ ...state, mouseOver: true }));
+    },
+    onMouseOut(instance) {
+        instance.setState((state: any) => ({ ...state, mouseOver: false }));
+    },
+    onMouseDown(e: React.MouseEvent, instance) {
+        if (e.button === 0 /* left */)
+            instance.setState((state: any) => ({ ...state, mouseDown: true }));
+    },
+    onMouseUp(instance) {
+        instance.setState((state: any) => ({ ...state, mouseDown: false }));
+    },
+
+    start() {
+        enableStyle(styles);
+        addContextMenuPatch("image-context", imageContextMenuPatch);
+        this.element = document.createElement("div");
+        this.element.classList.add("MagnifierContainer");
+        document.body.appendChild(this.element);
+    },
+
+    stop() {
+        disableStyle(styles);
+        // so componenetWillUnMount gets called if Magnifier component is still alive
+        this.root && this.root.unmount();
+        this.element?.remove();
+        removeContextMenuPatch("image-context", imageContextMenuPatch);
+    }
+});

src/plugins/imageZoom/styles.css

@@ -0,0 +1,31 @@
+.vc-imgzoom-lens {
+    position: absolute;
+    inset: 0;
+    z-index: 9999;
+    border: 2px solid grey;
+    border-radius: 50%;
+    overflow: hidden;
+    cursor: none;
+    box-shadow: inset 0 0 10px 2px grey;
+    filter: drop-shadow(0 0 2px grey);
+    pointer-events: none;
+}
+
+/* make the carousel take up less space so we can click the backdrop and exit out of it */
+[class|="carouselModal"] {
+    height: fit-content;
+    box-shadow: none;
+}
+
+[class*="modalCarouselWrapper"] {
+    height: fit-content;
+    top: 50%;
+    transform: translateY(-50%);
+}
+
+[class|="wrapper"]:has(> #vc-imgzoom-magnify-modal) {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+}

src/plugins/imageZoom/utils/waitFor.ts

@@ -0,0 +1,22 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+export function waitFor(condition: () => boolean, cb: () => void) {
+    if (condition()) cb();
+    else requestAnimationFrame(() => waitFor(condition, cb));
+}

src/plugins/invisibleChat/components/EncryptionModal.tsx

@@ -24,13 +24,10 @@ import {
     ModalRoot,
     openModal,
 } from "@utils/modal";
-import { findLazy } from "@webpack";
+import { Button, ComponentDispatch, Forms, React, Switch, TextInput } from "@webpack/common";
-import { Button, Forms, React, Switch, TextInput } from "@webpack/common";
 
 import { encrypt } from "../index";
 
-const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
-
 function EncModal(props: ModalProps) {
     const [secret, setSecret] = React.useState("");
     const [cover, setCover] = React.useState("");

src/plugins/invisibleChat/index.tsx

@@ -119,6 +119,7 @@ export default definePlugin({
     name: "InvisibleChat",
     description: "Encrypt your Messages in a non-suspicious way! This plugin makes requests to >>https://embed.sammcheese.net<< to provide embeds to decrypted links!",
     authors: [Devs.SammCheese],
+    dependencies: ["MessagePopoverAPI"],
     patches: [
         {
             // Indicator

src/plugins/memberCount.tsx

@@ -22,11 +22,14 @@ import { Devs } from "@utils/constants";
 import { getCurrentChannel } from "@utils/discord";
 import { useForceUpdater } from "@utils/misc";
 import definePlugin from "@utils/types";
+import { findStoreLazy } from "@webpack";
 import { FluxDispatcher, Tooltip } from "@webpack/common";
 
 const counts = {} as Record<string, [number, number]>;
 let forceUpdate: () => void;
 
+const GuildMemberCountStore = findStoreLazy("GuildMemberCountStore");
+
 function MemberCount() {
     const guildId = getCurrentChannel().guild_id;
     const c = counts[guildId];
@@ -37,7 +40,8 @@ function MemberCount() {
 
     let total = c[0].toLocaleString();
     if (total === "0" && c[1] > 0) {
-        total = "Loading...";
+        const approx = GuildMemberCountStore.getMemberCount(guildId);
+        total = approx ? approx.toLocaleString() : "Loading...";
     }
 
     const online = c[1].toLocaleString();

src/plugins/messageLogger/deleteStyleOverlay.css

@@ -1,3 +1,3 @@
 .messagelogger-deleted {
-    background-color: rgba(240 71 71 / 15%);
+    background-color: rgba(240 71 71 / 15%) !important;
 }

src/plugins/messageLogger/deleteStyleText.css

@@ -1,8 +1,8 @@
-.messagelogger-deleted div {
+.messagelogger-deleted :is(div, h1, h2, h3, p) {
-    color: #f04747;
+    color: #f04747 !important;
 }
 
 .messagelogger-deleted a {
-    color: #be3535;
+    color: #be3535 !important;
     text-decoration: underline;
 }

src/plugins/messageLogger/index.tsx

@@ -43,21 +43,21 @@ function addDeleteStyle() {
     }
 }
 
-const MENU_ITEM_ID = "message-logger-remove-history";
+const REMOVE_HISTORY_ID = "ml-remove-history";
-const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) => {
+const TOGGLE_DELETE_STYLE_ID = "ml-toggle-style";
+const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) => () => {
     const { message } = props;
     const { deleted, editHistory, id, channel_id } = message;
 
     if (!deleted && !editHistory?.length) return;
-    if (children.some(c => c?.props?.id === MENU_ITEM_ID)) return;
 
     children.push((
         <Menu.MenuItem
-            id={MENU_ITEM_ID}
+            id={REMOVE_HISTORY_ID}
-            key={MENU_ITEM_ID}
+            key={REMOVE_HISTORY_ID}
             label="Remove Message History"
             action={() => {
-                if (message.deleted) {
+                if (deleted) {
                     FluxDispatcher.dispatch({
                         type: "MESSAGE_DELETE",
                         channelId: channel_id,
@@ -70,13 +70,26 @@ const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) =
             }}
         />
     ));
+
+    if (!deleted) return;
+
+    const domElement = document.getElementById(`chat-messages-${channel_id}-${id}`);
+    if (!domElement) return;
+
+    children.push((
+        <Menu.MenuItem
+            id={TOGGLE_DELETE_STYLE_ID}
+            key={TOGGLE_DELETE_STYLE_ID}
+            label="Toggle Deleted Highlight"
+            action={() => domElement.classList.toggle("messagelogger-deleted")}
+        />
+    ));
 };
 
 export default definePlugin({
     name: "MessageLogger",
     description: "Temporarily logs deleted and edited messages.",
     authors: [Devs.rushii, Devs.Ven],
-    dependencies: ["ContextMenuAPI", "MenuItemDeobfuscatorAPI"],
 
     start() {
         addDeleteStyle();
@@ -209,6 +222,11 @@ export default definePlugin({
                         "       m" +
                         ")" +
                         ".update($3"
+                },
+                {
+                    // fix up key (edit last message) attempting to edit a deleted message
+                    match: /(?<=getLastEditableMessage=.{0,200}\.find\(\(function\((\i)\)\{)return/,
+                    replace: "return !$1.deleted &&"
                 }
             ]
         },

src/plugins/messageLogger/messageLogger.css

@@ -2,15 +2,17 @@
     display: none;
 }
 
-.messagelogger-deleted-attachment,
+.messagelogger-deleted :is(video, .emoji, [data-type="sticker"]),
+.messagelogger-deleted .messagelogger-deleted-attachment,
 .messagelogger-deleted div iframe {
-    filter: grayscale(1);
+    filter: grayscale(1) !important;
     transition: 150ms filter ease-in-out;
 }
 
-.messagelogger-deleted-attachment:hover,
+.messagelogger-deleted:hover :is(video, .emoji, [data-type="sticker"]),
-.messagelogger-deleted div iframe:hover {
+.messagelogger-deleted .messagelogger-deleted-attachment:hover,
-    filter: grayscale(0);
+.messagelogger-deleted iframe:hover {
+    filter: grayscale(0) !important;
 }
 
 .theme-dark .messagelogger-edited {

src/plugins/messageTags.ts

@@ -234,12 +234,15 @@ export default definePlugin({
                         });
                         break; // end 'preview'
                     }
-                }
 
-                return sendBotMessage(ctx.channel.id, {
+                    default: {
+                        sendBotMessage(ctx.channel.id, {
                             author,
                             content: "Invalid sub-command"
                         });
+                        break;
+                    }
+                }
             }
         }
     ]

src/plugins/moreUserTags.ts

@@ -0,0 +1,285 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { definePluginSettings } from "@api/settings";
+import { Devs } from "@utils/constants";
+import { proxyLazy } from "@utils/proxyLazy.js";
+import definePlugin, { OptionType } from "@utils/types";
+import { find, findByPropsLazy } from "@webpack";
+import { ChannelStore, GuildStore } from "@webpack/common";
+import { Channel, Message, User } from "discord-types/general";
+
+type PermissionName = "CREATE_INSTANT_INVITE" | "KICK_MEMBERS" | "BAN_MEMBERS" | "ADMINISTRATOR" | "MANAGE_CHANNELS" | "MANAGE_GUILD" | "CHANGE_NICKNAME" | "MANAGE_NICKNAMES" | "MANAGE_ROLES" | "MANAGE_WEBHOOKS" | "MANAGE_GUILD_EXPRESSIONS" | "CREATE_GUILD_EXPRESSIONS" | "VIEW_AUDIT_LOG" | "VIEW_CHANNEL" | "VIEW_GUILD_ANALYTICS" | "VIEW_CREATOR_MONETIZATION_ANALYTICS" | "MODERATE_MEMBERS" | "SEND_MESSAGES" | "SEND_TTS_MESSAGES" | "MANAGE_MESSAGES" | "EMBED_LINKS" | "ATTACH_FILES" | "READ_MESSAGE_HISTORY" | "MENTION_EVERYONE" | "USE_EXTERNAL_EMOJIS" | "ADD_REACTIONS" | "USE_APPLICATION_COMMANDS" | "MANAGE_THREADS" | "CREATE_PUBLIC_THREADS" | "CREATE_PRIVATE_THREADS" | "USE_EXTERNAL_STICKERS" | "SEND_MESSAGES_IN_THREADS" | "CONNECT" | "SPEAK" | "MUTE_MEMBERS" | "DEAFEN_MEMBERS" | "MOVE_MEMBERS" | "USE_VAD" | "PRIORITY_SPEAKER" | "STREAM" | "USE_EMBEDDED_ACTIVITIES" | "USE_SOUNDBOARD" | "USE_EXTERNAL_SOUNDS" | "REQUEST_TO_SPEAK" | "MANAGE_EVENTS" | "CREATE_EVENTS";
+
+interface Tag {
+    // name used for identifying, must be alphanumeric + underscores
+    name: string;
+    // name shown on the tag itself, can be anything probably; automatically uppercase'd
+    displayName: string;
+    description: string;
+    permissions?: PermissionName[];
+    condition?(message: Message | null, user: User, channel: Channel): boolean;
+}
+
+const CLYDE_ID = "1081004946872352958";
+
+// PermissionStore.computePermissions is not the same function and doesn't work here
+const PermissionUtil = findByPropsLazy("computePermissions", "canEveryoneRole") as {
+    computePermissions({ ...args }): bigint;
+};
+
+const Permissions = findByPropsLazy("SEND_MESSAGES", "VIEW_CREATOR_MONETIZATION_ANALYTICS") as Record<PermissionName, bigint>;
+const Tags = proxyLazy(() => find(m => m.Types?.[0] === "BOT").Types) as Record<string, number>;
+
+const isWebhook = (message: Message, user: User) => !!message?.webhookId && user.isNonUserBot();
+
+const tags: Tag[] = [
+    {
+        name: "WEBHOOK",
+        displayName: "Webhook",
+        description: "Messages sent by webhooks",
+        condition: isWebhook
+    }, {
+        name: "OWNER",
+        displayName: "Owner",
+        description: "Owns the server",
+        condition: (_, user, channel) => GuildStore.getGuild(channel?.guild_id)?.ownerId === user.id
+    }, {
+        name: "ADMINISTRATOR",
+        displayName: "Admin",
+        description: "Has the administrator permission",
+        permissions: ["ADMINISTRATOR"]
+    }, {
+        name: "MODERATOR_STAFF",
+        displayName: "Staff",
+        description: "Can manage the server, channels or roles",
+        permissions: ["MANAGE_GUILD", "MANAGE_CHANNELS", "MANAGE_ROLES"]
+    }, {
+        name: "MODERATOR",
+        displayName: "Mod",
+        description: "Can manage messages or kick/ban people",
+        permissions: ["MANAGE_MESSAGES", "KICK_MEMBERS", "BAN_MEMBERS"]
+    }, {
+        name: "VOICE_MODERATOR",
+        displayName: "VC Mod",
+        description: "Can manage voice chats",
+        permissions: ["MOVE_MEMBERS", "MUTE_MEMBERS", "DEAFEN_MEMBERS"]
+    }
+];
+
+const settings = definePluginSettings({
+    dontShowForBots: {
+        description: "Don't show tags (not including the webhook tag) for bots",
+        type: OptionType.BOOLEAN
+    },
+    dontShowBotTag: {
+        description: "Don't show [BOT] text for bots with other tags (verified bots will still have checkmark)",
+        type: OptionType.BOOLEAN
+    },
+    ...Object.fromEntries(tags.map(({ name, displayName, description }) => [
+        `visibility_${name}`, {
+            description: `Show ${displayName} tags (${description})`,
+            type: OptionType.SELECT,
+            options: [
+                {
+                    label: "Always",
+                    value: "always",
+                    default: true
+                }, {
+                    label: "Only in chat",
+                    value: "chat"
+                }, {
+                    label: "Only in member list and profiles",
+                    value: "not-chat"
+                }, {
+                    label: "Never",
+                    value: "never"
+                }
+            ]
+        }
+    ]))
+});
+
+export default definePlugin({
+    name: "MoreUserTags",
+    description: "Adds tags for webhooks and moderative roles (owner, admin, etc.)",
+    authors: [Devs.Cyn, Devs.TheSun, Devs.RyanCaoDev],
+    settings,
+    patches: [
+        // add tags to the tag list
+        {
+            find: '.BOT=0]="BOT"',
+            replacement: [
+                // add tags to the exported tags list (the Tags variable here)
+                {
+                    match: /(\i)\[.\.BOT=0\]="BOT";/,
+                    replace: "$&$1=$self.addTagVariants($1);"
+                },
+                // make the tag show the right text
+                {
+                    match: /(switch\((\i)\){.+?)case (\i)\.BOT:default:(\i)=(\i\.\i\.Messages)\.BOT_TAG_BOT/,
+                    replace: (_, origSwitch, variant, tags, displayedText, strings) =>
+                        `${origSwitch}default:{${displayedText} = $self.getTagText(${tags}[${variant}], ${strings})}`
+                },
+                // show OP tags correctly
+                {
+                    match: /(\i)=(\i)===\i\.ORIGINAL_POSTER/,
+                    replace: "$1=$self.isOPTag($2)"
+                },
+                // add HTML data attributes (for easier theming)
+                {
+                    match: /children:\[(?=\i,\(0,\i\.jsx\)\("span",{className:\i\(\)\.botText,children:(\i)}\)\])/,
+                    replace: "'data-tag':$1.toLowerCase(),children:["
+                }
+            ],
+        },
+        // in messages
+        {
+            find: ".Types.ORIGINAL_POSTER",
+            replacement: {
+                match: /return null==(\i)\?null:\(0,/,
+                replace: "$1=$self.getTag({...arguments[0],origType:$1,location:'chat'});$&"
+            }
+        },
+        // in the member list
+        {
+            find: ".renderBot=function(){",
+            replacement: {
+                match: /this.props.user;return null!=(\i)&&.{0,10}\?(.{0,50})\.botTag/,
+                replace: "this.props.user;var type=$self.getTag({...this.props,origType:$1.bot?0:null,location:'not-chat'});\
+return type!==null?$2.botTag,type"
+            }
+        },
+        // pass channel id down props to be used in profiles
+        {
+            find: ".hasAvatarForGuild(null==",
+            replacement: {
+                match: /\.usernameSection,user/,
+                replace: ".usernameSection,moreTags_channelId:arguments[0].channelId,user"
+            }
+        },
+        {
+            find: 'copyMetaData:"User Tag"',
+            replacement: {
+                match: /discriminatorClass:(.{1,100}),botClass:/,
+                replace: "discriminatorClass:$1,moreTags_channelId:arguments[0].moreTags_channelId,botClass:"
+            }
+        },
+        // in profiles
+        {
+            find: ",botType:",
+            replacement: {
+                match: /,botType:(\i\((\i)\)),/g,
+                replace: ",botType:$self.getTag({user:$2,channelId:arguments[0].moreTags_channelId,origType:$1,location:'not-chat'}),"
+            }
+        },
+    ],
+
+    getPermissions(user: User, channel: Channel): string[] {
+        const guild = GuildStore.getGuild(channel?.guild_id);
+        if (!guild) return [];
+
+        const permissions = PermissionUtil.computePermissions({ user, context: guild, overwrites: channel.permissionOverwrites });
+        return Object.entries(Permissions)
+            .map(([perm, permInt]) =>
+                permissions & permInt ? perm : ""
+            )
+            .filter(Boolean);
+    },
+
+    addTagVariants(val: any /* i cant think of a good name */) {
+        let i = 100;
+        tags.forEach(({ name }) => {
+            val[name] = ++i;
+            val[i] = name;
+            val[`${name}-BOT`] = ++i;
+            val[i] = `${name}-BOT`;
+            val[`${name}-OP`] = ++i;
+            val[i] = `${name}-OP`;
+        });
+        return val;
+    },
+
+    isOPTag: (tag: number) => tag === Tags.ORIGINAL_POSTER || tags.some(t => tag === Tags[`${t.name}-OP`]),
+
+    getTagText(passedTagName: string, strings: Record<string, string>) {
+        if (!passedTagName) return "BOT";
+        const [tagName, variant] = passedTagName.split("-");
+        const tag = tags.find(({ name }) => tagName === name);
+        if (!tag) return "BOT";
+        if (variant === "BOT" && tagName !== "WEBHOOK" && this.settings.store.dontShowForBots) return strings.BOT_TAG_BOT;
+
+        switch (variant) {
+            case "OP":
+                return `${strings.BOT_TAG_FORUM_ORIGINAL_POSTER} • ${tag.displayName}`;
+            case "BOT":
+                return `${strings.BOT_TAG_BOT} • ${tag.displayName}`;
+            default:
+                return tag.displayName;
+        }
+    },
+
+    getTag({
+        message, user, channelId, origType, location, channel
+    }: {
+        message?: Message,
+        user: User,
+        channel?: Channel & { isForumPost(): boolean; },
+        channelId?: string;
+        origType?: number;
+        location: string;
+    }): number | null {
+        if (location === "chat" && user.id === "1")
+            return Tags.OFFICIAL;
+        if (user.id === CLYDE_ID)
+            return Tags.AI;
+
+        let type = typeof origType === "number" ? origType : null;
+
+        channel ??= ChannelStore.getChannel(channelId!) as any;
+        if (!channel) return type;
+
+        const settings = this.settings.store;
+        const perms = this.getPermissions(user, channel);
+
+        for (const tag of tags) {
+            switch (settings[`visibility_${tag.name}`]) {
+                case "always":
+                case location:
+                    break;
+                default:
+                    continue;
+            }
+
+            if (
+                tag.permissions?.some(perm => perms.includes(perm)) ||
+                (tag.condition?.(message!, user, channel))
+            ) {
+                if (channel.isForumPost() && channel.ownerId === user.id)
+                    type = Tags[`${tag.name}-OP`];
+                else if (user.bot && !isWebhook(message!, user) && !settings.dontShowBotTag)
+                    type = Tags[`${tag.name}-BOT`];
+                else
+                    type = Tags[tag.name];
+                break;
+            }
+        }
+
+        return type;
+    }
+});

src/plugins/muteNewGuild.tsx

@@ -0,0 +1,80 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { Devs } from "@utils/constants";
+import { ModalContent, ModalFooter, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
+import definePlugin from "@utils/types";
+import { findByProps, findStoreLazy } from "@webpack";
+import { Button, Text } from "@webpack/common";
+
+const UserGuildSettingsStore = findStoreLazy("UserGuildSettingsStore");
+
+function NoDMNotificationsModal({ modalProps }: { modalProps: ModalProps; }) {
+    return (
+        <ModalRoot {...modalProps} size={ModalSize.MEDIUM}>
+            <ModalContent>
+                <div style={{ display: "flex", flexDirection: "column", justifyContent: "center", "alignItems": "center", textAlign: "center", height: "100%", padding: "8px 0", gap: "16px" }}>
+                    <Text variant="text-lg/semibold">You seem to have been affected by a bug that caused DM notifications to be muted and break if you used the MuteNewGuild plugin.</Text>
+                    <Text variant="text-lg/semibold">If you haven't received any notifications for private messages, this is why. This issue is now fixed, so they should work again. Please verify, and in case they are still broken, ask for help in the Vencord support channel!</Text>
+                    <Text variant="text-lg/semibold">We're very sorry for any inconvenience caused by this issue :(</Text>
+                </div>
+            </ModalContent>
+            <ModalFooter>
+                <div style={{ display: "flex", justifyContent: "center", width: "100%" }}>
+                    <Button
+                        onClick={modalProps.onClose}
+                        size={Button.Sizes.MEDIUM}
+                        color={Button.Colors.BRAND}
+                    >
+                        Understood!
+                    </Button>
+                </div>
+            </ModalFooter>
+        </ModalRoot>
+    );
+}
+
+export default definePlugin({
+    name: "MuteNewGuild",
+    description: "Mutes newly joined guilds",
+    authors: [Devs.Glitch, Devs.Nuckyz],
+    patches: [
+        {
+            find: ",acceptInvite:function",
+            replacement: {
+                match: /INVITE_ACCEPT_SUCCESS.+?;(\i)=null.+?;/,
+                replace: (m, guildId) => `${m}$self.handleMute(${guildId});`
+            }
+        }
+    ],
+
+    handleMute(guildId: string | null) {
+        if (guildId === "@me" || guildId === "null" || guildId == null) return;
+        findByProps("updateGuildNotificationSettings").updateGuildNotificationSettings(guildId, { muted: true, suppress_everyone: true, suppress_roles: true });
+    },
+
+    start() {
+        const [isMuted, isEveryoneSupressed, isRolesSupressed] = [UserGuildSettingsStore.isMuted(null), UserGuildSettingsStore.isSuppressEveryoneEnabled(null), UserGuildSettingsStore.isSuppressRolesEnabled(null)];
+
+        if (isMuted || isEveryoneSupressed || isRolesSupressed) {
+            findByProps("updateGuildNotificationSettings").updateGuildNotificationSettings(null, { muted: false, suppress_everyone: false, suppress_roles: false });
+
+            openModal(modalProps => <NoDMNotificationsModal modalProps={modalProps} />);
+        }
+    }
+});

src/plugins/noReplyMention.tsx

@@ -16,43 +16,43 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Settings } from "@api/settings";
+import { definePluginSettings } from "@api/settings";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
+import type { Message } from "discord-types/general";
 
-interface Reply {
+const settings = definePluginSettings({
-    message: {
+    exemptList: {
-        author: {
+        description:
-            id: string;
+            "List of users to exempt from this plugin (separated by commas or spaces)",
-        };
+        type: OptionType.STRING,
-    };
+        default: "1234567890123445,1234567890123445",
+    },
+    inverseShiftReply: {
+        description: "Invert Discord's shift replying behaviour (enable to make shift reply mention user)",
+        type: OptionType.BOOLEAN,
+        default: false,
     }
+});
 
 export default definePlugin({
     name: "NoReplyMention",
     description: "Disables reply pings by default",
-    authors: [Devs.DustyAngel47, Devs.axyie],
+    authors: [Devs.DustyAngel47, Devs.axyie, Devs.pylix],
-    options: {
+    settings,
-        exemptList: {
+
-            description:
+    shouldMention(message: Message, isHoldingShift: boolean) {
-                "List of users to exempt from this plugin (separated by commas)",
+        const isExempt = settings.store.exemptList.includes(message.author.id);
-            type: OptionType.STRING,
+        return settings.store.inverseShiftReply ? isHoldingShift !== isExempt : !isHoldingShift && isExempt;
-            default: "1234567890123445,1234567890123445",
-        },
-    },
-    shouldMention(reply: Reply) {
-        return Settings.plugins.NoReplyMention.exemptList.includes(
-            reply.message.author.id
-        );
     },
+
     patches: [
         {
-            find: "CREATE_PENDING_REPLY:function",
+            find: ",\"Message\")}function",
             replacement: {
-                match: /CREATE_PENDING_REPLY:function\((.{1,2})\){/,
+                match: /:(\i),shouldMention:!(\i)\.shiftKey/,
-                replace:
+                replace: ":$1,shouldMention:$self.shouldMention($1,$2.shiftKey)"
-                    "CREATE_PENDING_REPLY:function($1){$1.shouldMention=$self.shouldMention($1);",
+            }
-            },
+        }
-        },
     ],
 });

src/plugins/noTrack.ts

@@ -21,8 +21,8 @@ import definePlugin from "@utils/types";
 
 export default definePlugin({
     name: "NoTrack",
-    description: "Disable Discord's tracking and crash reporting",
+    description: "Disable Discord's tracking ('science'), metrics and Sentry crash reporting",
-    authors: [Devs.Cyn],
+    authors: [Devs.Cyn, Devs.Ven, Devs.Nuckyz],
     required: true,
     patches: [
         {
@@ -35,8 +35,8 @@ export default definePlugin({
         {
             find: "window.DiscordSentry=",
             replacement: {
-                match: /window\.DiscordSentry=function.+\}\(\)/,
+                match: /^.+$/,
-                replace: "",
+                replace: "()=>{}",
             }
         },
         {

src/plugins/petpet.ts

@@ -83,7 +83,7 @@ async function resolveImage(options: Argument[], ctx: CommandContext, noServerPf
 
 export default definePlugin({
     name: "petpet",
-    description: "headpet a cutie",
+    description: "Adds a /petpet slash command to create headpet gifs from any image",
     authors: [Devs.Ven],
     dependencies: ["CommandsAPI"],
     commands: [

src/plugins/pinDms/contextMenus.tsx

@@ -0,0 +1,75 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { addContextMenuPatch, findGroupChildrenByChildId, NavContextMenuPatchCallback, removeContextMenuPatch } from "@api/ContextMenu";
+import { Menu } from "@webpack/common";
+
+import { isPinned, movePin, PinOrder, settings, snapshotArray, togglePin } from "./settings";
+
+function PinMenuItem(channelId: string) {
+    const pinned = isPinned(channelId);
+    const canMove = pinned && settings.store.pinOrder === PinOrder.Custom;
+
+    return (
+        <>
+            <Menu.MenuItem
+                id="pin-dm"
+                label={pinned ? "Unpin DM" : "Pin DM"}
+                action={() => togglePin(channelId)}
+            />
+            {canMove && snapshotArray[0] !== channelId && (
+                <Menu.MenuItem
+                    id="move-pin-up"
+                    label="Move Pin Up"
+                    action={() => movePin(channelId, -1)}
+                />
+            )}
+            {canMove && snapshotArray[snapshotArray.length - 1] !== channelId && (
+                <Menu.MenuItem
+                    id="move-pin-down"
+                    label="Move Pin Down"
+                    action={() => movePin(channelId, +1)}
+                />
+            )}
+        </>
+    );
+}
+
+const GroupDMContext: NavContextMenuPatchCallback = (children, props) => () => {
+    const container = findGroupChildrenByChildId("leave-channel", children);
+    if (container)
+        container.unshift(PinMenuItem(props.channel.id));
+};
+
+const UserContext: NavContextMenuPatchCallback = (children, props) => () => {
+    const container = findGroupChildrenByChildId("close-dm", children);
+    if (container) {
+        const idx = container.findIndex(c => c?.props?.id === "close-dm");
+        container.splice(idx, 0, PinMenuItem(props.channel.id));
+    }
+};
+
+export function addContextMenus() {
+    addContextMenuPatch("gdm-context", GroupDMContext);
+    addContextMenuPatch("user-context", UserContext);
+}
+
+export function removeContextMenus() {
+    removeContextMenuPatch("gdm-context", GroupDMContext);
+    removeContextMenuPatch("user-context", UserContext);
+}

src/plugins/pinDms/index.tsx

@@ -0,0 +1,127 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { Devs } from "@utils/constants";
+import definePlugin from "@utils/types";
+import { Channel } from "discord-types/general";
+
+import { addContextMenus, removeContextMenus } from "./contextMenus";
+import { getPinAt, isPinned, settings, snapshotArray, usePinnedDms } from "./settings";
+
+export default definePlugin({
+    name: "PinDMs",
+    description: "Allows you to pin private channels to the top of your DM list. To pin/unpin or reorder pins, right click DMs",
+    authors: [Devs.Ven, Devs.Strencher],
+
+    settings,
+
+    start: addContextMenus,
+    stop: removeContextMenus,
+
+    usePinCount(channelIds: string[]) {
+        const pinnedDms = usePinnedDms();
+        // See comment on 2nd patch for reasoning
+        return channelIds.length ? [pinnedDms.size] : [];
+    },
+
+    getChannel(channels: Record<string, Channel>, idx: number) {
+        return channels[getPinAt(idx)];
+    },
+
+    isPinned,
+    getSnapshot: () => snapshotArray,
+
+    getScrollOffset(channelId: string, rowHeight: number, padding: number, preRenderedChildren: number, originalOffset: number) {
+        if (!isPinned(channelId))
+            return (
+                (rowHeight + padding) * 2 // header
+                + rowHeight * snapshotArray.length // pins
+                + originalOffset // original pin offset minus pins
+            );
+
+        return rowHeight * (snapshotArray.indexOf(channelId) + preRenderedChildren) + padding;
+    },
+
+    patches: [
+        // Patch DM list
+        {
+            find: ".privateChannelsHeaderContainer,",
+            replacement: [
+                {
+                    // filter Discord's privateChannelIds list to remove pins, and pass
+                    // pinCount as prop. This needs to be here so that the entire DM list receives
+                    // updates on pin/unpin
+                    match: /privateChannelIds:(\i),/,
+                    replace: "privateChannelIds:$1.filter(c=>!$self.isPinned(c)),pinCount:$self.usePinCount($1),"
+                },
+                {
+                    // sections is an array of numbers, where each element is a section and
+                    // the number is the amount of rows. Add our pinCount in second place
+                    // - Section 1: buttons for pages like Friends & Library
+                    // - Section 2: our pinned dms
+                    // - Section 3: the normal dm list
+                    match: /(?<=renderRow:(\i)\.renderRow,)sections:\[\i,/,
+                    // For some reason, adding our sections when no private channels are ready yet
+                    // makes DMs infinitely load. Thus usePinCount returns either a single element
+                    // array with the count, or an empty array. Due to spreading, only in the former
+                    // case will an element be added to the outer array
+                    // Thanks for the fix, Strencher!
+                    replace: "$&...$1.props.pinCount,"
+                },
+                {
+                    // Patch renderSection (renders the header) to set the text to "Pinned DMs" instead of "Direct Messages"
+                    // lookbehind is used to lookup parameter name. We could use arguments[0], but
+                    // if children ever is wrapped in an iife, it will break
+                    match: /children:(\i\.\i\.Messages.DIRECT_MESSAGES)(?<=renderSection=function\((\i)\).+?)/,
+                    replace: "children:$2.section===1?'Pinned DMs':$1"
+                },
+                {
+                    // Patch channel lookup inside renderDM
+                    // channel=channels[channelIds[row]];
+                    match: /(?<=preRenderedChildren,(\i)=)((\i)\[\i\[\i\]\]);/,
+                    // section 1 is us, manually get our own channel
+                    // section === 1 ? getChannel(channels, row) : channels[channelIds[row]];
+                    replace: "arguments[0]===1?$self.getChannel($3,arguments[1]):$2;"
+                },
+                {
+                    // Fix getRowHeight's check for whether this is the DMs section
+                    // section === DMS
+                    match: /===\i.DMS&&0/,
+                    // section -1 === DMS
+                    replace: "-1$&"
+                },
+                {
+                    // Override scrollToChannel to properly account for pinned channels
+                    match: /(?<=else\{\i\+=)(\i)\*\(.+?(?=;)/,
+                    replace: "$self.getScrollOffset(arguments[0],$1,this.props.padding,this.state.preRenderedChildren,$&)"
+                }
+            ]
+        },
+
+        // Fix Alt Up/Down navigation
+        {
+            find: '"mod+alt+right"',
+            replacement: {
+                // channelIds = __OVERLAY__ ? stuff : toArray(getStaticPaths()).concat(toArray(channelIds))
+                match: /(?<=(\i)=__OVERLAY__\?\i:.{0,10})\.concat\((.{0,10})\)/,
+                // ....concat(pins).concat(toArray(channelIds).filter(c => !isPinned(c)))
+                replace: ".concat($self.getSnapshot()).concat($2.filter(c=>!$self.isPinned(c)))"
+            }
+        }
+    ]
+});

src/plugins/pinDms/settings.ts

@@ -0,0 +1,94 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { definePluginSettings, Settings, useSettings } from "@api/settings";
+import { OptionType } from "@utils/types";
+import { findStoreLazy } from "@webpack";
+
+export const enum PinOrder {
+    LastMessage,
+    Custom
+}
+
+export const settings = definePluginSettings({
+    pinOrder: {
+        type: OptionType.SELECT,
+        description: "Which order should pinned DMs be displayed in?",
+        options: [
+            { label: "Most recent message", value: PinOrder.LastMessage, default: true },
+            { label: "Custom (right click channels to reorder)", value: PinOrder.Custom }
+        ]
+    }
+});
+
+const PrivateChannelSortStore = findStoreLazy("PrivateChannelSortStore");
+
+export let snapshotArray: string[];
+let snapshot: Set<string> | undefined;
+
+const getArray = () => (Settings.plugins.PinDMs.pinnedDMs || void 0)?.split(",") as string[] | undefined;
+const save = (pins: string[]) => {
+    snapshot = void 0;
+    Settings.plugins.PinDMs.pinnedDMs = pins.join(",");
+};
+const takeSnapshot = () => {
+    snapshotArray = getArray() ?? [];
+    return snapshot = new Set<string>(snapshotArray);
+};
+const requireSnapshot = () => snapshot ?? takeSnapshot();
+
+export function usePinnedDms() {
+    useSettings(["plugins.PinDMs.pinnedDMs"]);
+
+    return requireSnapshot();
+}
+
+export function isPinned(id: string) {
+    return requireSnapshot().has(id);
+}
+
+export function togglePin(id: string) {
+    const snapshot = requireSnapshot();
+    if (!snapshot.delete(id)) {
+        snapshot.add(id);
+    }
+
+    save([...snapshot]);
+}
+
+function sortedSnapshot() {
+    requireSnapshot();
+    if (settings.store.pinOrder === PinOrder.LastMessage)
+        return PrivateChannelSortStore.getPrivateChannelIds().filter(isPinned);
+
+    return snapshotArray;
+}
+
+export function getPinAt(idx: number) {
+    return sortedSnapshot()[idx];
+}
+
+export function movePin(id: string, direction: -1 | 1) {
+    const pins = getArray()!;
+    const a = pins.indexOf(id);
+    const b = a + direction;
+
+    [pins[a], pins[b]] = [pins[b], pins[a]];
+
+    save(pins);
+}

src/plugins/pronoundb/index.ts

@@ -63,8 +63,8 @@ export default definePlugin({
         {
             find: ".Messages.USER_POPOUT_PRONOUNS",
             replacement: {
-                match: /\i\.\i\.useExperiment\({}\)\.showPronouns/,
+                match: /\.showPronouns/,
-                replace: "true"
+                replace: ".showPronouns||true"
             }
         }
     ],

src/plugins/pronoundb/pronoundbUtils.ts

@@ -35,29 +35,34 @@ const bulkFetch = debounce(async () => {
     const pronouns = await bulkFetchPronouns(ids);
     for (const id of ids) {
         // Call all callbacks for the id
-        requestQueue[id].forEach(c => c(pronouns[id]));
+        requestQueue[id]?.forEach(c => c(pronouns[id]));
         delete requestQueue[id];
     }
 });
 
 export function awaitAndFormatPronouns(id: string): string | null {
     const [result, , isPending] = useAwaiter(() => fetchPronouns(id), {
-        fallbackValue: null,
+        fallbackValue: getCachedPronouns(id),
         onError: e => console.error("Fetching pronouns failed: ", e)
     });
 
-    // If the promise completed, the result was not "unspecified", and there is a mapping for the code, then return the mappings
+    // If the result is present and not "unspecified", and there is a mapping for the code, then return the mappings
-    if (!isPending && result && result !== "unspecified" && PronounMapping[result])
+    if (result && result !== "unspecified" && PronounMapping[result])
         return formatPronouns(result);
 
     return null;
 }
 
+// Gets the cached pronouns, if you're too impatient for a promise!
+export function getCachedPronouns(id: string): PronounCode | null {
+    return cache[id] ?? null;
+}
+
 // Fetches the pronouns for one id, returning a promise that resolves if it was cached, or once the request is completed
 export function fetchPronouns(id: string): Promise<PronounCode> {
     return new Promise(res => {
         // If cached, return the cached pronouns
-        if (id in cache) res(cache[id]);
+        if (id in cache) res(getCachedPronouns(id)!);
         // If there is already a request added, then just add this callback to it
         else if (id in requestQueue) requestQueue[id].push(res);
         // If not already added, then add it and call the debounced function to make sure the request gets executed

src/plugins/quickMention.tsx

@@ -19,10 +19,7 @@
 import { addButton, removeButton } from "@api/MessagePopover";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
-import { findLazy } from "@webpack";
+import { ChannelStore, ComponentDispatch } from "@webpack/common";
-import { ChannelStore } from "@webpack/common";
-
-const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
 
 export default definePlugin({
     name: "QuickMention",

src/plugins/quickReply.ts

@@ -16,9 +16,9 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { migratePluginSettings } from "@api/settings";
+import { definePluginSettings, migratePluginSettings, Settings } from "@api/settings";
 import { Devs } from "@utils/constants";
-import definePlugin from "@utils/types";
+import definePlugin, { OptionType } from "@utils/types";
 import { findByPropsLazy } from "@webpack";
 import { ChannelStore, FluxDispatcher as Dispatcher, MessageStore, SelectedChannelStore, UserStore } from "@webpack/common";
 import { Message } from "discord-types/general";
@@ -31,10 +31,33 @@ let editIdx = -1;
 
 migratePluginSettings("QuickReply", "InteractionKeybinds");
 
+const enum MentionOptions {
+    DISABLED,
+    ENABLED,
+    NO_REPLY_MENTION_PLUGIN
+}
+
+const settings = definePluginSettings({
+    shouldMention: {
+        type: OptionType.SELECT,
+        description: "Ping reply by default",
+        options: [
+            {
+                label: "Follow NoReplyMention",
+                value: MentionOptions.NO_REPLY_MENTION_PLUGIN,
+                default: true
+            },
+            { label: "Enabled", value: MentionOptions.ENABLED },
+            { label: "Disabled", value: MentionOptions.DISABLED },
+        ]
+    }
+});
+
 export default definePlugin({
     name: "QuickReply",
-    authors: [Devs.obscurity, Devs.Ven],
+    authors: [Devs.obscurity, Devs.Ven, Devs.pylix],
     description: "Reply to (ctrl + up/down) and edit (ctrl + shift + up/down) messages via keybinds",
+    settings,
 
     start() {
         Dispatcher.subscribe("DELETE_PENDING_REPLY", onDeletePendingReply);
@@ -111,7 +134,7 @@ function jumpIfOffScreen(channelId: string, messageId: string) {
 }
 
 function getNextMessage(isUp: boolean, isReply: boolean) {
-    let messages: Message[] = MessageStore.getMessages(SelectedChannelStore.getChannelId())._array;
+    let messages: Array<Message & { deleted?: boolean; }> = MessageStore.getMessages(SelectedChannelStore.getChannelId())._array;
     if (!isReply) { // we are editing so only include own
         const meId = UserStore.getCurrentUser().id;
         messages = messages.filter(m => m.author.id === meId);
@@ -121,15 +144,30 @@ function getNextMessage(isUp: boolean, isReply: boolean) {
         ? Math.min(messages.length - 1, i + 1)
         : Math.max(-1, i - 1);
 
+    const findNextNonDeleted = (i: number) => {
+        do {
+            i = mutate(i);
+        } while (i !== -1 && messages[messages.length - i - 1]?.deleted === true);
+        return i;
+    };
+
     let i: number;
     if (isReply)
-        replyIdx = i = mutate(replyIdx);
+        replyIdx = i = findNextNonDeleted(replyIdx);
     else
-        editIdx = i = mutate(editIdx);
+        editIdx = i = findNextNonDeleted(editIdx);
 
     return i === - 1 ? undefined : messages[messages.length - i - 1];
 }
 
+function shouldMention() {
+    switch (settings.store.shouldMention) {
+        case MentionOptions.NO_REPLY_MENTION_PLUGIN: return !Settings.plugins.NoReplyMention.enabled;
+        case MentionOptions.DISABLED: return false;
+        default: return true;
+    }
+}
+
 // handle next/prev reply
 function nextReply(isUp: boolean) {
     const message = getNextMessage(isUp, true);
@@ -142,11 +180,12 @@ function nextReply(isUp: boolean) {
 
     const channel = ChannelStore.getChannel(message.channel_id);
     const meId = UserStore.getCurrentUser().id;
+
     Dispatcher.dispatch({
         type: "CREATE_PENDING_REPLY",
         channel,
         message,
-        shouldMention: true,
+        shouldMention: shouldMention(),
         showMentionToggle: channel.guild_id !== null && message.author.id !== meId,
         _isQuickReply: true
     });

src/plugins/readAllNotificationsButton.tsx

@@ -62,10 +62,10 @@ export default definePlugin({
     renderReadAllButton: () => <ReadAllButton />,
 
     start() {
-        addServerListElement(ServerListRenderPosition.In, this.renderReadAllButton);
+        addServerListElement(ServerListRenderPosition.Above, this.renderReadAllButton);
     },
 
     stop() {
-        removeServerListElement(ServerListRenderPosition.In, this.renderReadAllButton);
+        removeServerListElement(ServerListRenderPosition.Above, this.renderReadAllButton);
     }
 });