fix: apply update only on quit

.eslintrc.json

@@ -0,0 +1,98 @@
+{
+    "root": true,
+    "parser": "@typescript-eslint/parser",
+    "ignorePatterns": ["dist", "browser", "packages/vencord-types"],
+    "plugins": [
+        "@typescript-eslint",
+        "simple-header",
+        "simple-import-sort",
+        "unused-imports",
+        "path-alias"
+    ],
+    "settings": {
+        "import/resolver": {
+            "alias": {
+                "map": [
+                    ["@webpack", "./src/webpack"],
+                    ["@webpack/common", "./src/webpack/common"],
+                    ["@utils", "./src/utils"],
+                    ["@api", "./src/api"],
+                    ["@components", "./src/components"]
+                ]
+            }
+        }
+    },
+    "rules": {
+        // Since it's only been a month and Vencord has already been stolen
+        // by random skids who rebranded it to "AlphaCord" and erased all license
+        // information
+        "simple-header/header": [
+            "error",
+            {
+                "files": ["scripts/header-new.txt", "scripts/header-old.txt"],
+                "templates": { "author": [".*", "Vendicated and contributors"] }
+            }
+        ],
+        "quotes": ["error", "double", { "avoidEscape": true }],
+        "jsx-quotes": ["error", "prefer-double"],
+        "no-mixed-spaces-and-tabs": "error",
+        "indent": ["error", 4, { "SwitchCase": 1 }],
+        "arrow-parens": ["error", "as-needed"],
+        "eol-last": ["error", "always"],
+        "@typescript-eslint/func-call-spacing": ["error", "never"],
+        "no-multi-spaces": "error",
+        "no-trailing-spaces": "error",
+        "no-whitespace-before-property": "error",
+        "semi": ["error", "always"],
+        "semi-style": ["error", "last"],
+        "space-in-parens": ["error", "never"],
+        "block-spacing": ["error", "always"],
+        "object-curly-spacing": ["error", "always"],
+        "eqeqeq": ["error", "always", { "null": "ignore" }],
+        "spaced-comment": ["error", "always", { "markers": ["!"] }],
+        "yoda": "error",
+        "prefer-destructuring": ["error", {
+                "VariableDeclarator": { "array": false, "object": true },
+                "AssignmentExpression": { "array": false, "object": false }
+        }],
+        "operator-assignment": ["error", "always"],
+        "no-useless-computed-key": "error",
+        "no-unneeded-ternary": ["error", { "defaultAssignment": false }],
+        "no-invalid-regexp": "error",
+        "no-constant-condition": ["error", { "checkLoops": false }],
+        "no-duplicate-imports": "error",
+        "no-extra-semi": "error",
+        "dot-notation": "error",
+        "no-useless-escape": [
+            "error",
+            {
+                "extra": "i"
+            }
+        ],
+        "no-fallthrough": "error",
+        "for-direction": "error",
+        "no-async-promise-executor": "error",
+        "no-cond-assign": "error",
+        "no-dupe-else-if": "error",
+        "no-duplicate-case": "error",
+        "no-irregular-whitespace": "error",
+        "no-loss-of-precision": "error",
+        "no-misleading-character-class": "error",
+        "no-prototype-builtins": "error",
+        "no-regex-spaces": "error",
+        "no-shadow-restricted-names": "error",
+        "no-unexpected-multiline": "error",
+        "no-unsafe-optional-chaining": "error",
+        "no-useless-backreference": "error",
+        "use-isnan": "error",
+        "prefer-const": "error",
+        "prefer-spread": "error",
+
+        "simple-import-sort/imports": "error",
+        "simple-import-sort/exports": "error",
+
+        "unused-imports/no-unused-imports": "error",
+
+        "path-alias/no-relative": "error"
+    }
+}

.github/workflows/build.yml

@@ -40,9 +40,28 @@ jobs:
             - name: Generate plugin list
               run: pnpm generatePluginJson dist/plugins.json dist/plugin-readmes.json
 
-            - name: Clean up obsolete files
+            - name: Collect files to be released
               run: |
-                  rm -rf dist/*-unpacked dist/monaco Vencord.user.css vencordDesktopRenderer.css vencordDesktopRenderer.css.map
+                  cd dist
+                  mkdir release
+
+                  cp browser/browser.* release
+                  cp Vencord.user.{js,js.LEGAL.txt} release
+
+                  # copy the plugin data jsons, the extension zips and the desktop/vesktop asars
+                  cp *.{json,zip,asar} release
+
+                  # legacy un-asared files
+                  # FIXME: remove at some point
+                  cp desktop/* release
+                  for file in vesktop/*; do
+                    filename=$(basename "$file")
+                    cp "$file" "release/vencordDesktop${filename^}"
+                  done
+
+                  find release -size 0 -delete
+                  rm release/package.json
+                  rm release/*.map
 
             - name: Get some values needed for the release
               id: release_values
@@ -50,16 +69,14 @@ jobs:
                   echo "release_tag=$(git rev-parse --short HEAD)" >> $GITHUB_ENV
 
             - name: Upload DevBuild as release
-              if: github.repository == 'Vendicated/Vencord'
               run: |
-                  gh release upload devbuild --clobber dist/*
+                  gh release upload devbuild --clobber dist/release/*
                   gh release edit devbuild --title "DevBuild $RELEASE_TAG"
               env:
                   GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
                   RELEASE_TAG: ${{ env.release_tag }}
 
             - name: Upload DevBuild to builds repo
-              if: github.repository == 'Vendicated/Vencord'
               run: |
                   git config --global user.name "$USERNAME"
                   git config --global user.email actions@github.com
@@ -69,7 +86,7 @@ jobs:
 
                   GLOBIGNORE=.git:.gitignore:README.md:LICENSE
                   rm -rf *
-                  cp -r ../dist/* .
+                  cp -r ../dist/release/* .
 
                   git add -A
                   git commit -m "Builds for https://github.com/$GITHUB_REPOSITORY/commit/$GITHUB_SHA"

.github/workflows/publish.yml

@@ -22,7 +22,7 @@ jobs:
 
             - uses: pnpm/action-setup@v3 # Install pnpm using packageManager key in package.json
 
-            - name: Use Node.js 19
+            - name: Use Node.js 20
               uses: actions/setup-node@v4
               with:
                   node-version: 20
@@ -36,7 +36,7 @@ jobs:
 
             - name: Publish extension
               run: |
-                  cd dist/chromium-unpacked
+                  cd dist/browser/chromium-unpacked
                   pnpx chrome-webstore-upload-cli@2.1.0 upload --auto-publish
               env:
                   EXTENSION_ID: ${{ secrets.CHROME_EXTENSION_ID }}

.gitignore

@@ -18,5 +18,7 @@ lerna-debug.log*
 .pnpm-debug.log*
 *.tsbuildinfo
 
+src/userplugins
+
 ExtensionCache/
 settings/

.gitmodules

@@ -1,3 +0,0 @@
-[submodule "src/userplugins/vc-message-logger-enhanced"]
-	path = src/userplugins/vc-message-logger-enhanced
-	url = https://github.com/Syncxv/vc-message-logger-enhanced.git

.stylelintrc.json

@@ -1,6 +1,7 @@
 {
     "extends": "stylelint-config-standard",
     "rules": {
+        "indentation": 4,
         "selector-class-pattern": [
             "^[a-z][a-zA-Z0-9]*(-[a-z0-9][a-zA-Z0-9]*)*$",
             {

.vscode/settings.json

@@ -14,6 +14,8 @@
     "typescript.preferences.quoteStyle": "double",
     "javascript.preferences.quoteStyle": "double",
 
+    "eslint.experimental.useFlatConfig": false,
+
     "gitlens.remotes": [
         {
             "domain": "codeberg.org",

eslint.config.mjs

@@ -1,126 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2023 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-// @ts-check
-
-import stylistic from "@stylistic/eslint-plugin";
-import pathAlias from "eslint-plugin-path-alias";
-import header from "eslint-plugin-simple-header";
-import simpleImportSort from "eslint-plugin-simple-import-sort";
-import unusedImports from "eslint-plugin-unused-imports";
-import tseslint from "typescript-eslint";
-
-export default tseslint.config(
-    { ignores: ["dist", "browser", "packages/vencord-types"] },
-    {
-        files: ["src/**/*.{tsx,ts,mts,mjs,js,jsx}", "eslint.config.mjs"],
-        plugins: {
-            "simple-header": header,
-            "@stylistic": stylistic,
-            "@typescript-eslint": tseslint.plugin,
-            "simple-import-sort": simpleImportSort,
-            "unused-imports": unusedImports,
-            "path-alias": pathAlias,
-        },
-        settings: {
-            "import/resolver": {
-                map: [
-                    ["@webpack", "./src/webpack"],
-                    ["@webpack/common", "./src/webpack/common"],
-                    ["@utils", "./src/utils"],
-                    ["@api", "./src/api"],
-                    ["@components", "./src/components"]
-                ]
-            }
-        },
-        languageOptions: {
-            parser: tseslint.parser,
-            parserOptions: {
-                project: ["./tsconfig.json"],
-                tsconfigRootDir: import.meta.dirname
-            }
-        },
-        rules: {
-            /*
-             * Since it's only been a month and Vencord has already been stolen
-             * by random skids who rebranded it to "AlphaCord" and erased all license
-             * information
-             */
-            "simple-header/header": [
-                "error",
-                {
-                    "files": ["scripts/header-new.txt", "scripts/header-old.txt"],
-                    "templates": { "author": [".*", "Vendicated and contributors"] }
-                }
-            ],
-
-            // Style Rules
-            "@stylistic/jsx-quotes": ["error", "prefer-double"],
-            "@stylistic/quotes": ["error", "double", { "avoidEscape": true }],
-            "@stylistic/no-mixed-spaces-and-tabs": "error",
-            "@stylistic/arrow-parens": ["error", "as-needed"],
-            "@stylistic/eol-last": ["error", "always"],
-            "@stylistic/no-multi-spaces": "error",
-            "@stylistic/no-trailing-spaces": "error",
-            "@stylistic/no-whitespace-before-property": "error",
-            "@stylistic/semi": ["error", "always"],
-            "@stylistic/semi-style": ["error", "last"],
-            "@stylistic/space-in-parens": ["error", "never"],
-            "@stylistic/block-spacing": ["error", "always"],
-            "@stylistic/object-curly-spacing": ["error", "always"],
-            "@stylistic/spaced-comment": ["error", "always", { "markers": ["!"] }],
-            "@stylistic/no-extra-semi": "error",
-
-            // TS Rules
-            "@stylistic/func-call-spacing": ["error", "never"],
-
-            // ESLint Rules
-            "yoda": "error",
-            "eqeqeq": ["error", "always", { "null": "ignore" }],
-            "prefer-destructuring": ["error", {
-                "VariableDeclarator": { "array": false, "object": true },
-                "AssignmentExpression": { "array": false, "object": false }
-            }],
-            "operator-assignment": ["error", "always"],
-            "no-useless-computed-key": "error",
-            "no-unneeded-ternary": ["error", { "defaultAssignment": false }],
-            "no-invalid-regexp": "error",
-            "no-constant-condition": ["error", { "checkLoops": false }],
-            "no-duplicate-imports": "error",
-            "dot-notation": "error",
-            "no-useless-escape": [
-                "error",
-                {
-                    "extra": "i"
-                }
-            ],
-            "no-fallthrough": "error",
-            "for-direction": "error",
-            "no-async-promise-executor": "error",
-            "no-cond-assign": "error",
-            "no-dupe-else-if": "error",
-            "no-duplicate-case": "error",
-            "no-irregular-whitespace": "error",
-            "no-loss-of-precision": "error",
-            "no-misleading-character-class": "error",
-            "no-prototype-builtins": "error",
-            "no-regex-spaces": "error",
-            "no-shadow-restricted-names": "error",
-            "no-unexpected-multiline": "error",
-            "no-unsafe-optional-chaining": "error",
-            "no-useless-backreference": "error",
-            "use-isnan": "error",
-            "prefer-const": "error",
-            "prefer-spread": "error",
-
-            // Plugin Rules
-            "simple-import-sort/imports": "error",
-            "simple-import-sort/exports": "error",
-            "unused-imports/no-unused-imports": "error",
-            "path-alias/no-relative": "error"
-        }
-    }
-);

package.json

@@ -1,7 +1,7 @@
 {
     "name": "vencord",
     "private": "true",
-    "version": "1.10.1",
+    "version": "1.9.5",
     "description": "The cutest Discord client mod",
     "homepage": "https://github.com/Vendicated/Vencord#readme",
     "bugs": {
@@ -14,9 +14,9 @@
     "license": "GPL-3.0-or-later",
     "author": "Vendicated",
     "scripts": {
-        "build": "node --require=./scripts/suppressExperimentalWarnings.js scripts/build/build.mjs",
+        "build": "tsx scripts/build/build.mts",
         "buildStandalone": "pnpm build --standalone",
-        "buildWeb": "node --require=./scripts/suppressExperimentalWarnings.js scripts/build/buildWeb.mjs",
+        "buildWeb": "tsx scripts/build/buildWeb.mts",
         "buildWebStandalone": "pnpm buildWeb --standalone",
         "buildReporter": "pnpm buildWebStandalone --reporter --skip-extension",
         "buildReporterDesktop": "pnpm build --reporter",
@@ -27,7 +27,7 @@
         "generateTypes": "tspc --emitDeclarationOnly --declaration --outDir packages/vencord-types",
         "inject": "node scripts/runInstaller.mjs",
         "uninject": "node scripts/runInstaller.mjs",
-        "lint": "eslint",
+        "lint": "eslint . --ext .js,.jsx,.ts,.tsx --ignore-pattern src/userplugins",
         "lint-styles": "stylelint \"src/**/*.css\" --ignore-pattern src/userplugins",
         "lint:fix": "pnpm lint --fix",
         "test": "pnpm buildStandalone && pnpm lint && pnpm lint-styles && pnpm testTsc && pnpm generatePluginJson",
@@ -35,54 +35,54 @@
         "testTsc": "tsc --noEmit"
     },
     "dependencies": {
-        "@sapphi-red/web-noise-suppressor": "0.3.5",
+        "@sapphi-red/web-noise-suppressor": "0.3.3",
         "@vap/core": "0.0.12",
         "@vap/shiki": "0.10.5",
-        "fflate": "^0.8.2",
+        "eslint-plugin-simple-header": "^1.0.2",
+        "fflate": "^0.7.4",
         "gifenc": "github:mattdesl/gifenc#64842fca317b112a8590f8fef2bf3825da8f6fe3",
         "monaco-editor": "^0.50.0",
-        "nanoid": "^5.0.7",
+        "nanoid": "^4.0.2",
         "virtual-merge": "^1.0.1"
     },
     "devDependencies": {
-        "@stylistic/eslint-plugin": "^2.6.1",
-        "@types/chrome": "^0.0.269",
-        "@types/diff": "^5.2.1",
-        "@types/lodash": "^4.17.7",
-        "@types/node": "^22.0.3",
-        "@types/react": "^18.3.3",
-        "@types/react-dom": "^18.3.0",
-        "@types/yazl": "^2.4.5",
-        "diff": "^5.2.0",
+        "@electron/asar": "^3.2.10",
+        "@types/chrome": "^0.0.246",
+        "@types/diff": "^5.0.3",
+        "@types/lodash": "^4.14.194",
+        "@types/node": "^18.16.3",
+        "@types/react": "^18.2.0",
+        "@types/react-dom": "^18.2.1",
+        "@types/yazl": "^2.4.2",
+        "@typescript-eslint/eslint-plugin": "^5.59.1",
+        "@typescript-eslint/parser": "^5.59.1",
+        "diff": "^5.1.0",
         "discord-types": "^1.3.26",
-        "esbuild": "^0.15.18",
-        "eslint": "^9.8.0",
+        "esbuild": "^0.23.0",
+        "eslint": "^8.46.0",
         "eslint-import-resolver-alias": "^1.1.2",
-        "eslint-plugin-path-alias": "2.1.0",
-        "eslint-plugin-simple-header": "^1.1.1",
-        "eslint-plugin-simple-import-sort": "^12.1.1",
-        "eslint-plugin-unused-imports": "^4.0.1",
-        "highlight.js": "10.7.3",
+        "eslint-plugin-path-alias": "^1.0.0",
+        "eslint-plugin-simple-import-sort": "^10.0.0",
+        "eslint-plugin-unused-imports": "^2.0.0",
+        "highlight.js": "10.6.0",
         "html-minifier-terser": "^7.2.0",
-        "moment": "^2.30.1",
-        "puppeteer-core": "^22.15.0",
+        "moment": "^2.29.4",
+        "puppeteer-core": "^19.11.1",
         "standalone-electron-types": "^1.0.0",
-        "stylelint": "^16.8.1",
-        "stylelint-config-standard": "^36.0.1",
-        "ts-patch": "^3.2.1",
-        "ts-pattern": "^5.3.1",
-        "tsx": "^4.16.5",
-        "type-fest": "^4.23.0",
-        "typescript": "^5.5.4",
-        "typescript-eslint": "^8.0.0",
+        "stylelint": "^15.6.0",
+        "stylelint-config-standard": "^33.0.0",
+        "ts-patch": "^3.1.2",
+        "tsx": "^4.16.2",
+        "type-fest": "^3.9.0",
+        "typescript": "^5.4.5",
         "typescript-transform-paths": "^3.4.7",
         "zip-local": "^0.3.5"
     },
     "packageManager": "pnpm@9.1.0",
     "pnpm": {
         "patchedDependencies": {
-            "eslint@9.8.0": "patches/eslint@9.8.0.patch",
-            "eslint-plugin-path-alias@2.1.0": "patches/eslint-plugin-path-alias@2.1.0.patch"
+            "eslint-plugin-path-alias@1.0.0": "patches/eslint-plugin-path-alias@1.0.0.patch",
+            "eslint@8.46.0": "patches/eslint@8.46.0.patch"
         },
         "peerDependencyRules": {
             "ignoreMissing": [
@@ -105,7 +105,7 @@
         "sourceDir": "./dist/firefox-unpacked"
     },
     "engines": {
-        "node": ">=18",
+        "node": ">=20",
         "pnpm": ">=9"
     }
 }

patches/eslint-plugin-path-alias@1.0.0.patch

@@ -0,0 +1,13 @@
+diff --git a/lib/rules/no-relative.js b/lib/rules/no-relative.js
+index 71594c83f1f4f733ffcc6047d7f7084348335dbe..d8623d87c89499c442171db3272cba07c9efabbe 100644
+--- a/lib/rules/no-relative.js
++++ b/lib/rules/no-relative.js
+@@ -41,7 +41,7 @@ module.exports = {
+ 			ImportDeclaration(node) {
+ 				const importPath = node.source.value;
+ 
+-				if (!/^(\.?\.\/)/.test(importPath)) {
++				if (!/^(\.\.\/)/.test(importPath)) {
+ 					return;
+ 				}
+ 

patches/eslint-plugin-path-alias@2.1.0.patch

@@ -1,14 +0,0 @@
-diff --git a/dist/index.js b/dist/index.js
-index 67de6fb139070fd0e49beca65e3b63c531202e16..aa2883c8126e4952a42872ee920f59547a066430 100644
---- a/dist/index.js
-+++ b/dist/index.js
-@@ -1 +1 @@
--var C=Object.create;var f=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var $=(e,t)=>{for(var r in t)f(e,r,{get:t[r],enumerable:!0})},y=(e,t,r,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of U(t))!F.call(e,s)&&s!==r&&f(e,s,{get:()=>t[s],enumerable:!(i=I(t,s))||i.enumerable});return e};var b=(e,t,r)=>(r=e!=null?C(S(e)):{},y(t||!e||!e.__esModule?f(r,"default",{value:e,enumerable:!0}):r,e)),D=e=>y(f({},"__esModule",{value:!0}),e);var N={};$(N,{default:()=>J});module.exports=D(N);var h="eslint-plugin-path-alias",v="2.0.0";var l=require("path"),M=b(require("nanomatch"));function j(e){return`https://github/com/msfragala/eslint-plugin-path-alias/blob/master/docs/rules/${e}.md`}var R=require("get-tsconfig"),a=require("path"),w=b(require("find-pkg")),O=require("fs");function P(e){if(e.options[0]?.paths)return z(e);let t=e.getFilename?.()??e.filename,r=(0,R.getTsconfig)(t);if(r?.config?.compilerOptions?.paths)return q(r);let i=w.default.sync((0,a.dirname)(t));if(!i)return;let s=JSON.parse((0,O.readFileSync)(i).toString());if(s?.imports)return L(s,i)}function L(e,t){let r=new Map,i=e.imports??{},s=(0,a.dirname)(t);return Object.entries(i).forEach(([o,n])=>{if(!n||typeof n!="string")return;let p=(0,a.resolve)(s,n);r.set(o,[p])}),r}function q(e){let t=new Map,r=e?.config?.compilerOptions?.paths??{},i=(0,a.dirname)(e.path);return e.config.compilerOptions?.baseUrl&&(i=(0,a.resolve)((0,a.dirname)(e.path),e.config.compilerOptions.baseUrl)),Object.entries(r).forEach(([s,o])=>{s=s.replace(/\/\*$/,""),o=o.map(n=>(0,a.resolve)(i,n.replace(/\/\*$/,""))),t.set(s,o)}),t}function z(e){let t=new Map,r=e.options[0]?.paths??{};return Object.entries(r).forEach(([i,s])=>{if(!s||typeof s!="string")return;if(s.startsWith("/")){t.set(i,[s]);return}let o=e.getCwd?.()??e.cwd,n=(0,a.resolve)(o,s);t.set(i,[n])}),t}var T={meta:{type:"suggestion",docs:{description:"Ensure imports use path aliases whenever possible vs. relative paths",url:j("no-relative")},fixable:"code",schema:[{type:"object",properties:{exceptions:{type:"array",items:{type:"string"}},paths:{type:"object"}},additionalProperties:!1}],messages:{shouldUseAlias:"Import should use path alias instead of relative path"}},create(e){let t=e.options[0]?.exceptions,r=e.getFilename?.()??e.filename,i=P(e);return i?.size?{ImportExpression(s){if(s.source.type!=="Literal"||typeof s.source.value!="string")return;let o=s.source.raw,n=s.source.value;if(!/^(\.?\.\/)/.test(n))return;let p=(0,l.resolve)((0,l.dirname)(r),n);if(A(p,t))return;let c=k(p,i);c&&e.report({node:s,messageId:"shouldUseAlias",data:{alias:c},fix(m){let g=E(p,c,i.get(c)),d=o.replace(n,g);return m.replaceText(s.source,d)}})},ImportDeclaration(s){if(typeof s.source.value!="string")return;let o=s.source.value;if(!/^(\.?\.\/)/.test(o))return;let n=(0,l.resolve)((0,l.dirname)(r),o),p=A(n,t),u=k(n,i);p||u&&e.report({node:s,messageId:"shouldUseAlias",data:{alias:u},fix(c){let m=s.source.raw,g=E(n,u,i.get(u)),d=m.replace(o,g);return c.replaceText(s.source,d)}})}}:{}}};function k(e,t){return Array.from(t.keys()).find(r=>t.get(r).some(s=>e.indexOf(s)===0))}function A(e,t){if(!t)return!1;let r=(0,l.basename)(e);return(0,M.default)(r,t).includes(r)}function E(e,t,r){for(let i of r)if(e.indexOf(i)===0)return e.replace(i,t)}var J={name:h,version:v,meta:{name:h,version:v},rules:{"no-relative":T}};
-+var C=Object.create;var f=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var $=(e,t)=>{for(var r in t)f(e,r,{get:t[r],enumerable:!0})},y=(e,t,r,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of U(t))!F.call(e,s)&&s!==r&&f(e,s,{get:()=>t[s],enumerable:!(i=I(t,s))||i.enumerable});return e};var b=(e,t,r)=>(r=e!=null?C(S(e)):{},y(t||!e||!e.__esModule?f(r,"default",{value:e,enumerable:!0}):r,e)),D=e=>y(f({},"__esModule",{value:!0}),e);var N={};$(N,{default:()=>J});module.exports=D(N);var h="eslint-plugin-path-alias",v="2.0.0";var l=require("path"),M=b(require("nanomatch"));function j(e){return`https://github/com/msfragala/eslint-plugin-path-alias/blob/master/docs/rules/${e}.md`}var R=require("get-tsconfig"),a=require("path"),w=b(require("find-pkg")),O=require("fs");function P(e){if(e.options[0]?.paths)return z(e);let t=e.getFilename?.()??e.filename,r=(0,R.getTsconfig)(t);if(r?.config?.compilerOptions?.paths)return q(r);let i=w.default.sync((0,a.dirname)(t));if(!i)return;let s=JSON.parse((0,O.readFileSync)(i).toString());if(s?.imports)return L(s,i)}function L(e,t){let r=new Map,i=e.imports??{},s=(0,a.dirname)(t);return Object.entries(i).forEach(([o,n])=>{if(!n||typeof n!="string")return;let p=(0,a.resolve)(s,n);r.set(o,[p])}),r}function q(e){let t=new Map,r=e?.config?.compilerOptions?.paths??{},i=(0,a.dirname)(e.path);return e.config.compilerOptions?.baseUrl&&(i=(0,a.resolve)((0,a.dirname)(e.path),e.config.compilerOptions.baseUrl)),Object.entries(r).forEach(([s,o])=>{s=s.replace(/\/\*$/,""),o=o.map(n=>(0,a.resolve)(i,n.replace(/\/\*$/,""))),t.set(s,o)}),t}function z(e){let t=new Map,r=e.options[0]?.paths??{};return Object.entries(r).forEach(([i,s])=>{if(!s||typeof s!="string")return;if(s.startsWith("/")){t.set(i,[s]);return}let o=e.getCwd?.()??e.cwd,n=(0,a.resolve)(o,s);t.set(i,[n])}),t}var T={meta:{type:"suggestion",docs:{description:"Ensure imports use path aliases whenever possible vs. relative paths",url:j("no-relative")},fixable:"code",schema:[{type:"object",properties:{exceptions:{type:"array",items:{type:"string"}},paths:{type:"object"}},additionalProperties:!1}],messages:{shouldUseAlias:"Import should use path alias instead of relative path"}},create(e){let t=e.options[0]?.exceptions,r=e.getFilename?.()??e.filename,i=P(e);return i?.size?{ImportExpression(s){if(s.source.type!=="Literal"||typeof s.source.value!="string")return;let o=s.source.raw,n=s.source.value;if(!/^(\.\.\/)/.test(n))return;let p=(0,l.resolve)((0,l.dirname)(r),n);if(A(p,t))return;let c=k(p,i);c&&e.report({node:s,messageId:"shouldUseAlias",data:{alias:c},fix(m){let g=E(p,c,i.get(c)),d=o.replace(n,g);return m.replaceText(s.source,d)}})},ImportDeclaration(s){if(typeof s.source.value!="string")return;let o=s.source.value;if(!/^(\.\.\/)/.test(o))return;let n=(0,l.resolve)((0,l.dirname)(r),o),p=A(n,t),u=k(n,i);p||u&&e.report({node:s,messageId:"shouldUseAlias",data:{alias:u},fix(c){let m=s.source.raw,g=E(n,u,i.get(u)),d=m.replace(o,g);return c.replaceText(s.source,d)}})}}:{}}};function k(e,t){return Array.from(t.keys()).find(r=>t.get(r).some(s=>e.indexOf(s)===0))}function A(e,t){if(!t)return!1;let r=(0,l.basename)(e);return(0,M.default)(r,t).includes(r)}function E(e,t,r){for(let i of r)if(e.indexOf(i)===0)return e.replace(i,t)}var J={name:h,version:v,meta:{name:h,version:v},rules:{"no-relative":T}};
-diff --git a/dist/index.mjs b/dist/index.mjs
-index 96de18e06d4cc413e11af038cd760e4804c32e59..27e8c4e3e2c942400cc3982e52159904ca6eedfa 100644
---- a/dist/index.mjs
-+++ b/dist/index.mjs
-@@ -1 +1 @@
--var d="eslint-plugin-path-alias",h="2.0.0";import{dirname as x,resolve as j,basename as I}from"path";import U from"nanomatch";function y(e){return`https://github/com/msfragala/eslint-plugin-path-alias/blob/master/docs/rules/${e}.md`}import{getTsconfig as k}from"get-tsconfig";import{resolve as c,dirname as u}from"path";import A from"find-pkg";import{readFileSync as E}from"fs";function b(e){if(e.options[0]?.paths)return C(e);let s=e.getFilename?.()??e.filename,i=k(s);if(i?.config?.compilerOptions?.paths)return T(i);let r=A.sync(u(s));if(!r)return;let t=JSON.parse(E(r).toString());if(t?.imports)return M(t,r)}function M(e,s){let i=new Map,r=e.imports??{},t=u(s);return Object.entries(r).forEach(([o,n])=>{if(!n||typeof n!="string")return;let a=c(t,n);i.set(o,[a])}),i}function T(e){let s=new Map,i=e?.config?.compilerOptions?.paths??{},r=u(e.path);return e.config.compilerOptions?.baseUrl&&(r=c(u(e.path),e.config.compilerOptions.baseUrl)),Object.entries(i).forEach(([t,o])=>{t=t.replace(/\/\*$/,""),o=o.map(n=>c(r,n.replace(/\/\*$/,""))),s.set(t,o)}),s}function C(e){let s=new Map,i=e.options[0]?.paths??{};return Object.entries(i).forEach(([r,t])=>{if(!t||typeof t!="string")return;if(t.startsWith("/")){s.set(r,[t]);return}let o=e.getCwd?.()??e.cwd,n=c(o,t);s.set(r,[n])}),s}var P={meta:{type:"suggestion",docs:{description:"Ensure imports use path aliases whenever possible vs. relative paths",url:y("no-relative")},fixable:"code",schema:[{type:"object",properties:{exceptions:{type:"array",items:{type:"string"}},paths:{type:"object"}},additionalProperties:!1}],messages:{shouldUseAlias:"Import should use path alias instead of relative path"}},create(e){let s=e.options[0]?.exceptions,i=e.getFilename?.()??e.filename,r=b(e);return r?.size?{ImportExpression(t){if(t.source.type!=="Literal"||typeof t.source.value!="string")return;let o=t.source.raw,n=t.source.value;if(!/^(\.?\.\/)/.test(n))return;let a=j(x(i),n);if(w(a,s))return;let l=R(a,r);l&&e.report({node:t,messageId:"shouldUseAlias",data:{alias:l},fix(f){let m=O(a,l,r.get(l)),g=o.replace(n,m);return f.replaceText(t.source,g)}})},ImportDeclaration(t){if(typeof t.source.value!="string")return;let o=t.source.value;if(!/^(\.?\.\/)/.test(o))return;let n=j(x(i),o),a=w(n,s),p=R(n,r);a||p&&e.report({node:t,messageId:"shouldUseAlias",data:{alias:p},fix(l){let f=t.source.raw,m=O(n,p,r.get(p)),g=f.replace(o,m);return l.replaceText(t.source,g)}})}}:{}}};function R(e,s){return Array.from(s.keys()).find(i=>s.get(i).some(t=>e.indexOf(t)===0))}function w(e,s){if(!s)return!1;let i=I(e);return U(i,s).includes(i)}function O(e,s,i){for(let r of i)if(e.indexOf(r)===0)return e.replace(r,s)}var Q={name:d,version:h,meta:{name:d,version:h},rules:{"no-relative":P}};export{Q as default};
-+var d="eslint-plugin-path-alias",h="2.0.0";import{dirname as x,resolve as j,basename as I}from"path";import U from"nanomatch";function y(e){return`https://github/com/msfragala/eslint-plugin-path-alias/blob/master/docs/rules/${e}.md`}import{getTsconfig as k}from"get-tsconfig";import{resolve as c,dirname as u}from"path";import A from"find-pkg";import{readFileSync as E}from"fs";function b(e){if(e.options[0]?.paths)return C(e);let s=e.getFilename?.()??e.filename,i=k(s);if(i?.config?.compilerOptions?.paths)return T(i);let r=A.sync(u(s));if(!r)return;let t=JSON.parse(E(r).toString());if(t?.imports)return M(t,r)}function M(e,s){let i=new Map,r=e.imports??{},t=u(s);return Object.entries(r).forEach(([o,n])=>{if(!n||typeof n!="string")return;let a=c(t,n);i.set(o,[a])}),i}function T(e){let s=new Map,i=e?.config?.compilerOptions?.paths??{},r=u(e.path);return e.config.compilerOptions?.baseUrl&&(r=c(u(e.path),e.config.compilerOptions.baseUrl)),Object.entries(i).forEach(([t,o])=>{t=t.replace(/\/\*$/,""),o=o.map(n=>c(r,n.replace(/\/\*$/,""))),s.set(t,o)}),s}function C(e){let s=new Map,i=e.options[0]?.paths??{};return Object.entries(i).forEach(([r,t])=>{if(!t||typeof t!="string")return;if(t.startsWith("/")){s.set(r,[t]);return}let o=e.getCwd?.()??e.cwd,n=c(o,t);s.set(r,[n])}),s}var P={meta:{type:"suggestion",docs:{description:"Ensure imports use path aliases whenever possible vs. relative paths",url:y("no-relative")},fixable:"code",schema:[{type:"object",properties:{exceptions:{type:"array",items:{type:"string"}},paths:{type:"object"}},additionalProperties:!1}],messages:{shouldUseAlias:"Import should use path alias instead of relative path"}},create(e){let s=e.options[0]?.exceptions,i=e.getFilename?.()??e.filename,r=b(e);return r?.size?{ImportExpression(t){if(t.source.type!=="Literal"||typeof t.source.value!="string")return;let o=t.source.raw,n=t.source.value;if(!/^(\.\.\/)/.test(n))return;let a=j(x(i),n);if(w(a,s))return;let l=R(a,r);l&&e.report({node:t,messageId:"shouldUseAlias",data:{alias:l},fix(f){let m=O(a,l,r.get(l)),g=o.replace(n,m);return f.replaceText(t.source,g)}})},ImportDeclaration(t){if(typeof t.source.value!="string")return;let o=t.source.value;if(!/^(\.\.\/)/.test(o))return;let n=j(x(i),o),a=w(n,s),p=R(n,r);a||p&&e.report({node:t,messageId:"shouldUseAlias",data:{alias:p},fix(l){let f=t.source.raw,m=O(n,p,r.get(p)),g=f.replace(o,m);return l.replaceText(t.source,g)}})}}:{}}};function R(e,s){return Array.from(s.keys()).find(i=>s.get(i).some(t=>e.indexOf(t)===0))}function w(e,s){if(!s)return!1;let i=I(e);return U(i,s).includes(i)}function O(e,s,i){for(let r of i)if(e.indexOf(r)===0)return e.replace(r,s)}var Q={name:d,version:h,meta:{name:d,version:h},rules:{"no-relative":P}};export{Q as default};

scripts/build/build.mts

@@ -17,31 +17,30 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import esbuild from "esbuild";
-import { readdir } from "fs/promises";
+import { createPackage } from "@electron/asar";
+import { BuildOptions, Plugin } from "esbuild";
+import { existsSync, readdirSync } from "fs";
+import { readdir, rm, writeFile } from "fs/promises";
 import { join } from "path";
 
-import { BUILD_TIMESTAMP, commonOpts, exists, globPlugins, IS_DEV, IS_REPORTER, IS_STANDALONE, IS_UPDATER_DISABLED, resolvePluginName, VERSION, commonRendererPlugins, watch } from "./common.mjs";
+import { addBuild, BUILD_TIMESTAMP, buildOrWatchAll, commonOpts, exists, globPlugins, IS_DEV, IS_REPORTER, IS_STANDALONE, IS_UPDATER_DISABLED, resolvePluginName, VERSION, watch } from "./common.mjs";
 
 const defines = {
-    IS_STANDALONE,
-    IS_DEV,
-    IS_REPORTER,
-    IS_UPDATER_DISABLED,
-    IS_WEB: false,
-    IS_EXTENSION: false,
+    IS_STANDALONE: String(IS_STANDALONE),
+    IS_DEV: String(IS_DEV),
+    IS_REPORTER: String(IS_REPORTER),
+    IS_UPDATER_DISABLED: String(IS_UPDATER_DISABLED),
+    IS_WEB: "false",
+    IS_EXTENSION: "false",
     VERSION: JSON.stringify(VERSION),
-    BUILD_TIMESTAMP
+    BUILD_TIMESTAMP: String(BUILD_TIMESTAMP)
 };
 
-if (defines.IS_STANDALONE === false)
+if (defines.IS_STANDALONE === "false")
     // If this is a local build (not standalone), optimize
     // for the specific platform we're on
     defines["process.platform"] = JSON.stringify(process.platform);
 
-/**
- * @type {esbuild.BuildOptions}
- */
 const nodeCommonOpts = {
     ...commonOpts,
     format: "cjs",
@@ -49,15 +48,12 @@ const nodeCommonOpts = {
     target: ["esnext"],
     external: ["electron", "original-fs", "~pluginNatives", ...commonOpts.external],
     define: defines
-};
+} satisfies BuildOptions;
 
-const sourceMapFooter = s => watch ? "" : `//# sourceMappingURL=vencord://${s}.js.map`;
+const sourceMapFooter = (s: string) => watch ? "" : `//# sourceMappingURL=vencord://${s}.js.map`;
 const sourcemap = watch ? "inline" : "external";
 
-/**
- * @type {import("esbuild").Plugin}
- */
-const globNativesPlugin = {
+const globNativesPlugin: Plugin = {
     name: "glob-natives-plugin",
     setup: build => {
         const filter = /^~pluginNatives$/;
@@ -104,26 +100,26 @@ const globNativesPlugin = {
 
 await Promise.all([
     // Discord Desktop main & renderer & preload
-    esbuild.build({
+    addBuild({
         ...nodeCommonOpts,
         entryPoints: ["src/main/index.ts"],
-        outfile: "dist/patcher.js",
+        outfile: "dist/desktop/patcher.js",
         footer: { js: "//# sourceURL=VencordPatcher\n" + sourceMapFooter("patcher") },
         sourcemap,
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: true,
-            IS_VESKTOP: false
+            IS_DISCORD_DESKTOP: "true",
+            IS_VESKTOP: "false"
         },
         plugins: [
             ...nodeCommonOpts.plugins,
             globNativesPlugin
         ]
     }),
-    esbuild.build({
+    addBuild({
         ...commonOpts,
         entryPoints: ["src/Vencord.ts"],
-        outfile: "dist/renderer.js",
+        outfile: "dist/desktop/renderer.js",
         format: "iife",
         target: ["esnext"],
         footer: { js: "//# sourceURL=VencordRenderer\n" + sourceMapFooter("renderer") },
@@ -131,79 +127,111 @@ await Promise.all([
         sourcemap,
         plugins: [
             globPlugins("discordDesktop"),
-            ...commonRendererPlugins
+            ...commonOpts.plugins
         ],
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: true,
-            IS_VESKTOP: false
+            IS_DISCORD_DESKTOP: "true",
+            IS_VESKTOP: "false"
         }
     }),
-    esbuild.build({
+    addBuild({
         ...nodeCommonOpts,
         entryPoints: ["src/preload.ts"],
-        outfile: "dist/preload.js",
+        outfile: "dist/desktop/preload.js",
         footer: { js: "//# sourceURL=VencordPreload\n" + sourceMapFooter("preload") },
         sourcemap,
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: true,
-            IS_VESKTOP: false
+            IS_DISCORD_DESKTOP: "true",
+            IS_VESKTOP: "false"
         }
     }),
 
     // Vencord Desktop main & renderer & preload
-    esbuild.build({
+    addBuild({
         ...nodeCommonOpts,
         entryPoints: ["src/main/index.ts"],
-        outfile: "dist/vencordDesktopMain.js",
-        footer: { js: "//# sourceURL=VencordDesktopMain\n" + sourceMapFooter("vencordDesktopMain") },
+        outfile: "dist/vesktop/main.js",
+        footer: { js: "//# sourceURL=VencordMain\n" + sourceMapFooter("main") },
         sourcemap,
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: false,
-            IS_VESKTOP: true
+            IS_DISCORD_DESKTOP: "false",
+            IS_VESKTOP: "true"
         },
         plugins: [
             ...nodeCommonOpts.plugins,
             globNativesPlugin
         ]
     }),
-    esbuild.build({
+    addBuild({
         ...commonOpts,
         entryPoints: ["src/Vencord.ts"],
-        outfile: "dist/vencordDesktopRenderer.js",
+        outfile: "dist/vesktop/renderer.js",
         format: "iife",
         target: ["esnext"],
-        footer: { js: "//# sourceURL=VencordDesktopRenderer\n" + sourceMapFooter("vencordDesktopRenderer") },
+        footer: { js: "//# sourceURL=VencordRenderer\n" + sourceMapFooter("renderer") },
         globalName: "Vencord",
         sourcemap,
         plugins: [
             globPlugins("vencordDesktop"),
-            ...commonRendererPlugins
+            ...commonOpts.plugins
         ],
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: false,
-            IS_VESKTOP: true
+            IS_DISCORD_DESKTOP: "false",
+            IS_VESKTOP: "true"
         }
     }),
-    esbuild.build({
+    addBuild({
         ...nodeCommonOpts,
         entryPoints: ["src/preload.ts"],
-        outfile: "dist/vencordDesktopPreload.js",
-        footer: { js: "//# sourceURL=VencordPreload\n" + sourceMapFooter("vencordDesktopPreload") },
+        outfile: "dist/vesktop/preload.js",
+        footer: { js: "//# sourceURL=VencordPreload\n" + sourceMapFooter("preload") },
         sourcemap,
         define: {
             ...defines,
-            IS_DISCORD_DESKTOP: false,
-            IS_VESKTOP: true
+            IS_DISCORD_DESKTOP: "false",
+            IS_VESKTOP: "true"
         }
     }),
-]).catch(err => {
-    console.error("Build failed");
-    console.error(err.message);
-    // make ci fail
-    if (!commonOpts.watch)
-        process.exitCode = 1;
-});
+]);
+
+await buildOrWatchAll();
+
+await Promise.all([
+    writeFile("dist/desktop/package.json", JSON.stringify({
+        name: "vencord",
+        main: "patcher.js"
+    })),
+    writeFile("dist/vesktop/package.json", JSON.stringify({
+        name: "vencord",
+        main: "main.js"
+    }))
+]);
+
+await Promise.all([
+    createPackage("dist/desktop", "dist/desktop.asar"),
+    createPackage("dist/vesktop", "dist/vesktop.asar")
+]);
+
+
+if (existsSync("dist/renderer.js")) {
+    console.warn("Legacy dist folder. Cleaning up and adding shims.");
+
+    await Promise.all(
+        readdirSync("dist")
+            .filter(f =>
+                f.endsWith(".map") ||
+                f.endsWith(".LEGAL.txt") ||
+                ["patcher", "preload", "renderer"].some(name => f.startsWith(name))
+            )
+            .map(file => rm(join("dist", file)))
+    );
+
+    await Promise.all([
+        writeFile("dist/patcher.js", 'require("./desktop")'),
+        writeFile("dist/vencordDesktopMain.js", 'require("./vesktop")')
+    ]);
+}

scripts/build/buildWeb.mts

@@ -23,12 +23,12 @@ import { appendFile, mkdir, readdir, readFile, rm, writeFile } from "fs/promises
 import { join } from "path";
 import Zip from "zip-local";
 
-import { BUILD_TIMESTAMP, commonOpts, globPlugins, IS_DEV, IS_REPORTER, VERSION, commonRendererPlugins } from "./common.mjs";
+import { addBuild, BUILD_TIMESTAMP, buildOrWatchAll, commonOpts, globPlugins, IS_DEV, IS_REPORTER, VERSION } from "./common.mjs";
 
 /**
  * @type {esbuild.BuildOptions}
  */
-const commonOptions = {
+const commonOptions: esbuild.BuildOptions = {
     ...commonOpts,
     entryPoints: ["browser/Vencord.ts"],
     globalName: "Vencord",
@@ -36,20 +36,20 @@ const commonOptions = {
     external: ["~plugins", "~git-hash", "/assets/*"],
     plugins: [
         globPlugins("web"),
-        ...commonRendererPlugins
+        ...commonOpts.plugins,
     ],
     target: ["esnext"],
     define: {
-        IS_WEB: true,
-        IS_EXTENSION: false,
-        IS_STANDALONE: true,
-        IS_DEV,
-        IS_REPORTER,
-        IS_DISCORD_DESKTOP: false,
-        IS_VESKTOP: false,
-        IS_UPDATER_DISABLED: true,
+        IS_WEB: "true",
+        IS_EXTENSION: "false",
+        IS_STANDALONE: "true",
+        IS_DEV: String(IS_DEV),
+        IS_REPORTER: String(IS_REPORTER),
+        IS_DISCORD_DESKTOP: "false",
+        IS_VESKTOP: "false",
+        IS_UPDATER_DISABLED: "true",
         VERSION: JSON.stringify(VERSION),
-        BUILD_TIMESTAMP
+        BUILD_TIMESTAMP: String(BUILD_TIMESTAMP)
     }
 };
 
@@ -67,39 +67,39 @@ const RnNoiseFiles = [
 
 await Promise.all(
     [
-        esbuild.build({
+        addBuild({
             entryPoints: MonacoWorkerEntryPoints.map(entry => `node_modules/monaco-editor/esm/${entry}`),
             bundle: true,
             minify: true,
             format: "iife",
             outbase: "node_modules/monaco-editor/esm/",
-            outdir: "dist/monaco"
+            outdir: "dist/browser/monaco"
         }),
-        esbuild.build({
+        addBuild({
             entryPoints: ["browser/monaco.ts"],
             bundle: true,
             minify: true,
             format: "iife",
-            outfile: "dist/monaco/index.js",
+            outfile: "dist/browser/monaco/index.js",
             loader: {
                 ".ttf": "file"
             }
         }),
-        esbuild.build({
+        addBuild({
             ...commonOptions,
-            outfile: "dist/browser.js",
+            outfile: "dist/browser/browser.js",
             footer: { js: "//# sourceURL=VencordWeb" }
         }),
-        esbuild.build({
+        addBuild({
             ...commonOptions,
-            outfile: "dist/extension.js",
+            outfile: "dist/browser/extension.js",
             define: {
                 ...commonOptions?.define,
-                IS_EXTENSION: true,
+                IS_EXTENSION: "true",
             },
             footer: { js: "//# sourceURL=VencordWeb" }
         }),
-        esbuild.build({
+        addBuild({
             ...commonOptions,
             inject: ["browser/GMPolyfill.js", ...(commonOptions?.inject || [])],
             define: {
@@ -116,18 +116,12 @@ await Promise.all(
             }
         })
     ]
-).catch(err => {
-    console.error("Build failed");
-    console.error(err.message);
-    if (!commonOpts.watch)
-        process.exit(1);
-});;
+);
 
-/**
- * @type {(dir: string) => Promise<string[]>}
- */
-async function globDir(dir) {
-    const files = [];
+await buildOrWatchAll();
+
+async function globDir(dir: string): Promise<string[]> {
+    const files = [] as string[];
 
     for (const child of await readdir(dir, { withFileTypes: true })) {
         const p = join(dir, child.name);
@@ -140,27 +134,23 @@ async function globDir(dir) {
     return files;
 }
 
-/**
- * @type {(dir: string, basePath?: string) => Promise<Record<string, string>>}
- */
-async function loadDir(dir, basePath = "") {
+async function loadDir(dir: string, basePath = "") {
     const files = await globDir(dir);
-    return Object.fromEntries(await Promise.all(files.map(async f => [f.slice(basePath.length), await readFile(f)])));
+    return Object.fromEntries(await Promise.all(files.map(async f =>
+        [f.slice(basePath.length), await readFile(f)] as const
+    )));
 }
 
-/**
-  * @type {(target: string, files: string[]) => Promise<void>}
- */
-async function buildExtension(target, files) {
-    const entries = {
-        "dist/Vencord.js": await readFile("dist/extension.js"),
-        "dist/Vencord.css": await readFile("dist/extension.css"),
-        ...await loadDir("dist/monaco"),
+async function buildExtension(target: string, files: string[]): Promise<void> {
+    const entries: Record<string, Buffer> = {
+        "dist/Vencord.js": await readFile("dist/browser/extension.js"),
+        "dist/Vencord.css": await readFile("dist/browser/extension.css"),
+        ...await loadDir("dist/browser/monaco"),
         ...Object.fromEntries(await Promise.all(RnNoiseFiles.map(async file =>
-            [`third-party/rnnoise/${file.replace(/^dist\//, "")}`, await readFile(`node_modules/@sapphi-red/web-noise-suppressor/${file}`)]
+            [`third-party/rnnoise/${file.replace(/^dist\//, "")}`, await readFile(`node_modules/@sapphi-red/web-noise-suppressor/${file}`)] as const
         ))),
         ...Object.fromEntries(await Promise.all(files.map(async f => {
-            let content = await readFile(join("browser", f));
+            let content: Uint8Array | Buffer = await readFile(join("browser", f));
             if (f.startsWith("manifest")) {
                 const json = JSON.parse(content.toString("utf-8"));
                 json.version = VERSION;
@@ -170,19 +160,19 @@ async function buildExtension(target, files) {
             return [
                 f.startsWith("manifest") ? "manifest.json" : f,
                 content
-            ];
+            ] as const;
         })))
     };
 
     await rm(target, { recursive: true, force: true });
     await Promise.all(Object.entries(entries).map(async ([file, content]) => {
-        const dest = join("dist", target, file);
+        const dest = join("dist/browser", target, file);
         const parentDirectory = join(dest, "..");
         await mkdir(parentDirectory, { recursive: true });
         await writeFile(dest, content);
     }));
 
-    console.info("Unpacked Extension written to dist/" + target);
+    console.info("Unpacked Extension written to dist/browser/" + target);
 }
 
 const appendCssRuntime = readFile("dist/Vencord.user.css", "utf-8").then(content => {
@@ -205,12 +195,14 @@ if (!process.argv.includes("--skip-extension")) {
         buildExtension("firefox-unpacked", ["background.js", "content.js", "manifestv2.json", "icon.png"]),
     ]);
 
-    Zip.sync.zip("dist/chromium-unpacked").compress().save("dist/extension-chrome.zip");
+    Zip.zip("dist/browser/chromium-unpacked", (_err, zip) => {
+        zip.compress().save("dist/extension-chrome.zip");
         console.info("Packed Chromium Extension written to dist/extension-chrome.zip");
-
-    Zip.sync.zip("dist/firefox-unpacked").compress().save("dist/extension-firefox.zip");
+    });
+    Zip.zip("dist/browser/firefox-unpacked", (_err, zip) => {
+        zip.compress().save("dist/extension-firefox.zip");
         console.info("Packed Firefox Extension written to dist/extension-firefox.zip");
-
+    });
 } else {
     await appendCssRuntime;
 }

scripts/build/common.mts

@@ -20,7 +20,7 @@ import "../suppressExperimentalWarnings.js";
 import "../checkNodeVersion.js";
 
 import { exec, execSync } from "child_process";
-import esbuild from "esbuild";
+import esbuild, { build, BuildOptions, context, Plugin } from "esbuild";
 import { constants as FsConstants, readFileSync } from "fs";
 import { access, readdir, readFile } from "fs/promises";
 import { minify as minifyHtml } from "html-minifier-terser";
@@ -28,10 +28,8 @@ import { join, relative } from "path";
 import { promisify } from "util";
 
 import { getPluginTarget } from "../utils.mjs";
-import { builtinModules } from "module";
 
-/** @type {import("../../package.json")} */
-const PackageJSON = JSON.parse(readFileSync("package.json"));
+const PackageJSON: typeof import("../../package.json") = JSON.parse(readFileSync("package.json", "utf-8"));
 
 export const VERSION = PackageJSON.version;
 // https://reproducible-builds.org/docs/source-date-epoch/
@@ -55,11 +53,8 @@ export const banner = {
 };
 
 const PluginDefinitionNameMatcher = /definePlugin\(\{\s*(["'])?name\1:\s*(["'`])(.+?)\2/;
-/**
- * @param {string} base
- * @param {import("fs").Dirent} dirent
- */
-export async function resolvePluginName(base, dirent) {
+
+export async function resolvePluginName(base: string, dirent: import("fs").Dirent) {
     const fullPath = join(base, dirent.name);
     const content = dirent.isFile()
         ? await readFile(fullPath, "utf-8")
@@ -80,28 +75,13 @@ export async function resolvePluginName(base, dirent) {
         })();
 }
 
-export async function exists(path) {
+export async function exists(path: string) {
     return await access(path, FsConstants.F_OK)
         .then(() => true)
         .catch(() => false);
 }
 
-// https://github.com/evanw/esbuild/issues/619#issuecomment-751995294
-/**
- * @type {import("esbuild").Plugin}
- */
-export const makeAllPackagesExternalPlugin = {
-    name: "make-all-packages-external",
-    setup(build) {
-        const filter = /^[^./]|^\.[^./]|^\.\.[^/]/; // Must not start with "/" or "./" or "../"
-        build.onResolve({ filter }, args => ({ path: args.path, external: true }));
-    }
-};
-
-/**
- * @type {(kind: "web" | "discordDesktop" | "vencordDesktop") => import("esbuild").Plugin}
- */
-export const globPlugins = kind => ({
+export const globPlugins: (kind: "web" | "discordDesktop" | "vencordDesktop") => Plugin = kind => ({
     name: "glob-plugins",
     setup: build => {
         const filter = /^~plugins$/;
@@ -165,10 +145,7 @@ export const globPlugins = kind => ({
     }
 });
 
-/**
- * @type {import("esbuild").Plugin}
- */
-export const gitHashPlugin = {
+export const gitHashPlugin: Plugin = {
     name: "git-hash-plugin",
     setup: build => {
         const filter = /^~git-hash$/;
@@ -181,10 +158,7 @@ export const gitHashPlugin = {
     }
 };
 
-/**
- * @type {import("esbuild").Plugin}
- */
-export const gitRemotePlugin = {
+export const gitRemotePlugin: Plugin = {
     name: "git-remote-plugin",
     setup: build => {
         const filter = /^~git-remote$/;
@@ -206,10 +180,7 @@ export const gitRemotePlugin = {
     }
 };
 
-/**
- * @type {import("esbuild").Plugin}
- */
-export const fileUrlPlugin = {
+export const fileUrlPlugin: Plugin = {
     name: "file-uri-plugin",
     setup: build => {
         const filter = /^file:\/\/.+$/;
@@ -229,7 +200,7 @@ export const fileUrlPlugin = {
 
             const encoding = base64 ? "base64" : "utf-8";
 
-            let content;
+            let content: string;
             if (!minify) {
                 content = await readFile(path, encoding);
                 if (!noTrim) content = content.trimEnd();
@@ -269,10 +240,7 @@ export const fileUrlPlugin = {
 };
 
 const styleModule = readFileSync("./scripts/build/module/style.js", "utf-8");
-/**
- * @type {import("esbuild").Plugin}
- */
-export const stylePlugin = {
+export const stylePlugin: Plugin = {
     name: "style-plugin",
     setup: ({ onResolve, onLoad }) => {
         onResolve({ filter: /\.css\?managed$/, namespace: "file" }, ({ path, resolveDir }) => ({
@@ -293,47 +261,59 @@ export const stylePlugin = {
     }
 };
 
-/**
- * @type {(filter: RegExp, message: string) => import("esbuild").Plugin}
- */
-export const banImportPlugin = (filter, message) => ({
-    name: "ban-imports",
-    setup: build => {
-        build.onResolve({ filter }, () => {
-            return { errors: [{ text: message }] };
-        });
-    }
-});
+let buildsFinished = Promise.resolve();
+const buildsFinishedPlugin: Plugin = {
+    name: "builds-finished-plugin",
+    setup({ onEnd }) {
+        if (!watch) return;
+
+        let resolve: () => void;
+        const done = new Promise<void>(r => resolve = r);
+        buildsFinished = buildsFinished.then(() => done);
+
+        onEnd(() => resolve());
+    },
+};
 
-/**
- * @type {import("esbuild").BuildOptions}
- */
 export const commonOpts = {
     logLevel: "info",
     bundle: true,
-    watch,
     minify: !watch,
-    sourcemap: watch ? "inline" : "",
+    sourcemap: watch ? "inline" : "external",
     legalComments: "linked",
     banner,
-    plugins: [fileUrlPlugin, gitHashPlugin, gitRemotePlugin, stylePlugin],
+    plugins: [fileUrlPlugin, gitHashPlugin, gitRemotePlugin, stylePlugin, buildsFinishedPlugin],
     external: ["~plugins", "~git-hash", "~git-remote", "/assets/*"],
     inject: ["./scripts/build/inject/react.mjs"],
     jsxFactory: "VencordCreateElement",
     jsxFragment: "VencordFragment",
-    // Work around https://github.com/evanw/esbuild/issues/2460
-    tsconfig: "./scripts/build/tsconfig.esbuild.json"
-};
+    jsx: "transform"
+} satisfies BuildOptions;
 
-const escapedBuiltinModules = builtinModules
-    .map(m => m.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&"))
-    .join("|");
-const builtinModuleRegex = new RegExp(`^(node:)?(${escapedBuiltinModules})$`);
 
-export const commonRendererPlugins = [
-    banImportPlugin(builtinModuleRegex, "Cannot import node inbuilt modules in browser code. You need to use a native.ts file"),
-    banImportPlugin(/^react$/, "Cannot import from react. React and hooks should be imported from @webpack/common"),
-    banImportPlugin(/^electron(\/.*)?$/, "Cannot import electron in browser code. You need to use a native.ts file"),
-    banImportPlugin(/^ts-pattern$/, "Cannot import from ts-pattern. match and P should be imported from @webpack/common"),
-    ...commonOpts.plugins
-];
+const builds = [] as BuildOptions[];
+export function addBuild(options: BuildOptions) {
+    builds.push(options);
+}
+
+export async function buildOrWatchAll() {
+    if (watch) {
+        const contexts = await Promise.all(builds.map(context));
+        await Promise.all(contexts.map(ctx => ctx.watch()));
+
+        await buildsFinished;
+    } else {
+        try {
+            await Promise.all(builds.map(build));
+        } catch (err) {
+            const reason = err instanceof Error
+                ? err.message
+                : err;
+
+            console.error("Build failed");
+            console.error(reason);
+            // make ci fail
+            process.exitCode = 1;
+        }
+    }
+}

scripts/build/tsconfig.esbuild.json

@@ -1,7 +0,0 @@
-// Work around https://github.com/evanw/esbuild/issues/2460
-{
-    "extends": "../../tsconfig.json",
-    "compilerOptions": {
-        "jsx": "react"
-    }
-}

scripts/generateReport.ts

@@ -36,7 +36,7 @@ for (const variable of ["DISCORD_TOKEN", "CHROMIUM_BIN"]) {
 const CANARY = process.env.USE_CANARY === "true";
 
 const browser = await pup.launch({
-    headless: true,
+    headless: "new",
     executablePath: process.env.CHROMIUM_BIN
 });
 

scripts/runInstaller.mjs

@@ -124,6 +124,7 @@ try {
         env: {
             ...process.env,
             VENCORD_USER_DATA_DIR: BASE_DIR,
+            VENCORD_DIRECTORY: join(BASE_DIR, "dist/desktop"),
             VENCORD_DEV_INSTALL: "1"
         }
     });

scripts/utils.mts

@@ -16,15 +16,11 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-/**
- * @param {string} filePath
- * @returns {string | null}
- */
-export function getPluginTarget(filePath) {
+export function getPluginTarget(filePath: string) {
     const pathParts = filePath.split(/[/\\]/);
-    if (/^index\.tsx?$/.test(pathParts.at(-1))) pathParts.pop();
+    if (/^index\.tsx?$/.test(pathParts.at(-1)!)) pathParts.pop();
 
-    const identifier = pathParts.at(-1).replace(/\.tsx?$/, "");
+    const identifier = pathParts.at(-1)!.replace(/\.tsx?$/, "");
     const identiferBits = identifier.split(".");
     return identiferBits.length === 1 ? null : identiferBits.at(-1);
 }

src/api/Commands/index.ts

@@ -16,7 +16,6 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Logger } from "@utils/Logger";
 import { makeCodeblock } from "@utils/text";
 
 import { sendBotMessage } from "./commandHelpers";
@@ -47,10 +46,10 @@ export let RequiredMessageOption: Option = ReqPlaceholder;
 export const _init = function (cmds: Command[]) {
     try {
         BUILT_IN = cmds;
-        OptionalMessageOption = cmds.find(c => (c.untranslatedName || c.displayName) === "shrug")!.options![0];
-        RequiredMessageOption = cmds.find(c => (c.untranslatedName || c.displayName) === "me")!.options![0];
+        OptionalMessageOption = cmds.find(c => c.name === "shrug")!.options![0];
+        RequiredMessageOption = cmds.find(c => c.name === "me")!.options![0];
     } catch (e) {
-        new Logger("CommandsAPI").error("Failed to load CommandsApi", e, " - cmds is", cmds);
+        console.error("Failed to load CommandsApi");
     }
     return cmds;
 } as never;
@@ -139,8 +138,6 @@ export function registerCommand<C extends Command>(command: C, plugin: string) {
         throw new Error(`Command '${command.name}' already exists.`);
 
     command.isVencordCommand = true;
-    command.untranslatedName ??= command.name;
-    command.untranslatedDescription ??= command.description;
     command.id ??= `-${BUILT_IN.length + 1}`;
     command.applicationId ??= "-1"; // BUILT_IN;
     command.type ??= ApplicationCommandType.CHAT_INPUT;

src/api/Commands/types.ts

@@ -93,10 +93,8 @@ export interface Command {
     isVencordCommand?: boolean;
 
     name: string;
-    untranslatedName?: string;
     displayName?: string;
     description: string;
-    untranslatedDescription?: string;
     displayDescription?: string;
 
     options?: Option[];

src/api/MessagePopover.ts

@@ -16,17 +16,16 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import ErrorBoundary from "@components/ErrorBoundary";
 import { Logger } from "@utils/Logger";
 import { Channel, Message } from "discord-types/general";
-import type { ComponentType, MouseEventHandler } from "react";
+import type { MouseEventHandler } from "react";
 
 const logger = new Logger("MessagePopover");
 
 export interface ButtonItem {
     key?: string,
     label: string,
-    icon: ComponentType<any>,
+    icon: React.ComponentType<any>,
     message: Message,
     channel: Channel,
     onClick?: MouseEventHandler<HTMLButtonElement>,
@@ -49,26 +48,22 @@ export function removeButton(identifier: string) {
 }
 
 export function _buildPopoverElements(
-    Component: React.ComponentType<ButtonItem>,
-    message: Message
+    msg: Message,
+    makeButton: (item: ButtonItem) => React.ComponentType
 ) {
-    const items: React.ReactNode[] = [];
+    const items = [] as React.ComponentType[];
 
     for (const [identifier, getItem] of buttons.entries()) {
         try {
-            const item = getItem(message);
+            const item = getItem(msg);
             if (item) {
                 item.key ??= identifier;
-                items.push(
-                    <ErrorBoundary noop>
-                        <Component {...item} />
-                    </ErrorBoundary>
-                );
+                items.push(makeButton(item));
             }
         } catch (err) {
             logger.error(`[${identifier}]`, err);
         }
     }
 
-    return <>{items}</>;
+    return items;
 }

src/api/Settings.ts

@@ -230,10 +230,6 @@ export function definePluginSettings<
             if (!definedSettings.pluginName) throw new Error("Cannot access settings before plugin is initialized");
             return Settings.plugins[definedSettings.pluginName] as any;
         },
-        get plain() {
-            if (!definedSettings.pluginName) throw new Error("Cannot access settings before plugin is initialized");
-            return PlainSettings.plugins[definedSettings.pluginName] as any;
-        },
         use: settings => useSettings(
             settings?.map(name => `plugins.${definedSettings.pluginName}.${name}`) as UseSettings<Settings>[]
         ).plugins[definedSettings.pluginName] as any,

src/components/ExpandableHeader.css

@@ -1,6 +1,7 @@
 .vc-expandableheader-center-flex {
     display: flex;
-    place-items: center;
+    justify-items: center;
+    align-items: center;
 }
 
 .vc-expandableheader-btn {

src/components/Icons.tsx

@@ -65,7 +65,8 @@ export function LinkIcon({ height = 24, width = 24, className }: IconProps) {
 }
 
 /**
- * Discord's copy icon, as seen in the user panel popout on the right of the username and in large code blocks
+ * Discord's copy icon, as seen in the user popout right of the username when clicking
+ * your own username in the bottom left user panel
  */
 export function CopyIcon(props: IconProps) {
     return (
@@ -75,9 +76,8 @@ export function CopyIcon(props: IconProps) {
             viewBox="0 0 24 24"
         >
             <g fill="currentColor">
-                <path d="M3 16a1 1 0 0 1-1-1v-5a8 8 0 0 1 8-8h5a1 1 0 0 1 1 1v.5a.5.5 0 0 1-.5.5H10a6 6 0 0 0-6 6v5.5a.5.5 0 0 1-.5.5H3Z" />
-                <path d="M6 18a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4v-4h-3a5 5 0 0 1-5-5V6h-4a4 4 0 0 0-4 4v8Z" />
-                <path d="M21.73 12a3 3 0 0 0-.6-.88l-4.25-4.24a3 3 0 0 0-.88-.61V9a3 3 0 0 0 3 3h2.73Z" />
+                <path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1z" />
+                <path d="M15 5H8c-1.1 0-1.99.9-1.99 2L6 21c0 1.1.89 2 1.99 2H19c1.1 0 2-.9 2-2V11l-6-6zM8 21V7h6v5h5v9H8z" />
             </g>
         </Icon>
     );

src/components/VencordSettings/PatchHelperTab.tsx

@@ -382,7 +382,6 @@ function PatchHelper() {
                     <Forms.FormTitle className={Margins.top20}>Code</Forms.FormTitle>
                     <CodeBlock lang="js" content={code} />
                     <Button onClick={() => Clipboard.copy(code)}>Copy to Clipboard</Button>
-                    <Button className={Margins.top8} onClick={() => Clipboard.copy("```ts\n" + code + "\n```")}>Copy as Codeblock</Button>
                 </>
             )}
         </SettingsTab>

src/components/VencordSettings/ThemesTab.tsx

@@ -25,9 +25,10 @@ import { openPluginModal } from "@components/PluginSettings/PluginModal";
 import type { UserThemeHeader } from "@main/themes";
 import { openInviteModal } from "@utils/discord";
 import { Margins } from "@utils/margins";
+import { classes } from "@utils/misc";
 import { showItemInFolder } from "@utils/native";
 import { useAwaiter } from "@utils/react";
-import { findLazy } from "@webpack";
+import { findByPropsLazy, findLazy } from "@webpack";
 import { Card, Forms, React, showToast, TabBar, TextArea, useEffect, useRef, useState } from "@webpack/common";
 import type { ComponentType, Ref, SyntheticEvent } from "react";
 
@@ -44,7 +45,9 @@ type FileInput = ComponentType<{
     filters?: { name?: string; extensions: string[]; }[];
 }>;
 
+const InviteActions = findByPropsLazy("resolveInvite");
 const FileInput: FileInput = findLazy(m => m.prototype?.activateUploadDialogue && m.prototype.setRef);
+const TextAreaProps = findLazy(m => typeof m.textarea === "string");
 
 const cl = classNameFactory("vc-settings-theme-");
 
@@ -77,16 +80,8 @@ function Validators({ themeLinks }: { themeLinks: string[]; }) {
             <Forms.FormTitle className={Margins.top20} tag="h5">Validator</Forms.FormTitle>
             <Forms.FormText>This section will tell you whether your themes can successfully be loaded</Forms.FormText>
             <div>
-                {themeLinks.map(rawLink => {
-                    const { label, link } = (() => {
-                        const match = /^@(light|dark) (.*)/.exec(rawLink);
-                        if (!match) return { label: rawLink, link: rawLink };
-
-                        const [, mode, link] = match;
-                        return { label: `[${mode} mode only] ${link}`, link };
-                    })();
-
-                    return <Card style={{
+                {themeLinks.map(link => (
+                    <Card style={{
                         padding: ".5em",
                         marginBottom: ".5em",
                         marginTop: ".5em"
@@ -94,11 +89,11 @@ function Validators({ themeLinks }: { themeLinks: string[]; }) {
                         <Forms.FormTitle tag="h5" style={{
                             overflowWrap: "break-word"
                         }}>
-                            {label}
+                            {link}
                         </Forms.FormTitle>
                         <Validator link={link} />
-                    </Card>;
-                })}
+                    </Card>
+                ))}
             </div>
         </>
     );
@@ -304,7 +299,6 @@ function ThemesTab() {
                 <Card className="vc-settings-card vc-text-selectable">
                     <Forms.FormTitle tag="h5">Paste links to css files here</Forms.FormTitle>
                     <Forms.FormText>One link per line</Forms.FormText>
-                    <Forms.FormText>You can prefix lines with @light or @dark to toggle them based on your Discord theme</Forms.FormText>
                     <Forms.FormText>Make sure to use direct links to files (raw or github.io)!</Forms.FormText>
                 </Card>
 
@@ -312,7 +306,7 @@ function ThemesTab() {
                     <TextArea
                         value={themeText}
                         onChange={setThemeText}
-                        className={"vc-settings-theme-links"}
+                        className={classes(TextAreaProps.textarea, "vc-settings-theme-links")}
                         placeholder="Theme Links"
                         spellCheck={false}
                         onBlur={onBlur}

src/components/VencordSettings/settingsStyles.css

@@ -33,20 +33,6 @@
     padding: 0.5em;
     border: 1px solid var(--background-modifier-accent);
     max-height: unset;
-    background-color: transparent;
-    box-sizing: border-box;
-    font-size: 12px;
-    line-height: 14px;
-    resize: none;
-    width: 100%;
-}
-
-.vc-settings-theme-links::placeholder {
-    color: var(--header-secondary);
-}
-
-.vc-settings-theme-links:focus {
-    background-color: var(--background-tertiary);
 }
 
 .vc-cloud-settings-sync-grid {

src/debug/loadLazyChunks.ts

@@ -15,9 +15,9 @@ export async function loadLazyChunks() {
     try {
         LazyChunkLoaderLogger.log("Loading all chunks...");
 
-        const validChunks = new Set<number>();
-        const invalidChunks = new Set<number>();
-        const deferredRequires = new Set<number>();
+        const validChunks = new Set<string>();
+        const invalidChunks = new Set<string>();
+        const deferredRequires = new Set<string>();
 
         let chunksSearchingResolve: (value: void | PromiseLike<void>) => void;
         const chunksSearchingDone = new Promise<void>(r => chunksSearchingResolve = r);
@@ -29,14 +29,14 @@ export async function loadLazyChunks() {
 
         async function searchAndLoadLazyChunks(factoryCode: string) {
             const lazyChunks = factoryCode.matchAll(LazyChunkRegex);
-            const validChunkGroups = new Set<[chunkIds: number[], entryPoint: number]>();
+            const validChunkGroups = new Set<[chunkIds: string[], entryPoint: string]>();
 
             // Workaround for a chunk that depends on the ChannelMessage component but may be be force loaded before
             // the chunk containing the component
             const shouldForceDefer = factoryCode.includes(".Messages.GUILD_FEED_UNFEATURE_BUTTON_TEXT");
 
             await Promise.all(Array.from(lazyChunks).map(async ([, rawChunkIds, entryPoint]) => {
-                const chunkIds = rawChunkIds ? Array.from(rawChunkIds.matchAll(Webpack.ChunkIdsRegex)).map(m => Number(m[1])) : [];
+                const chunkIds = rawChunkIds ? Array.from(rawChunkIds.matchAll(Webpack.ChunkIdsRegex)).map(m => m[1]) : [];
 
                 if (chunkIds.length === 0) {
                     return;
@@ -61,7 +61,7 @@ export async function loadLazyChunks() {
                 }
 
                 if (!invalidChunkGroup) {
-                    validChunkGroups.add([chunkIds, Number(entryPoint)]);
+                    validChunkGroups.add([chunkIds, entryPoint]);
                 }
             }));
 
@@ -131,14 +131,14 @@ export async function loadLazyChunks() {
         }
 
         // All chunks Discord has mapped to asset files, even if they are not used anymore
-        const allChunks = [] as number[];
+        const allChunks = [] as string[];
 
         // Matches "id" or id:
-        for (const currentMatch of wreq!.u.toString().matchAll(/(?:"([\deE]+?)"(?![,}]))|(?:([\deE]+?):)/g)) {
+        for (const currentMatch of wreq!.u.toString().matchAll(/(?:"(\d+?)")|(?:(\d+?):)/g)) {
             const id = currentMatch[1] ?? currentMatch[2];
             if (id == null) continue;
 
-            allChunks.push(Number(id));
+            allChunks.push(id);
         }
 
         if (allChunks.length === 0) throw new Error("Failed to get all chunks");

src/main/index.ts

@@ -43,11 +43,9 @@ if (IS_VESKTOP || !IS_VANILLA) {
             }
             switch (url) {
                 case "renderer.js.map":
-                case "vencordDesktopRenderer.js.map":
                 case "preload.js.map":
-                case "vencordDesktopPreload.js.map":
                 case "patcher.js.map":
-                case "vencordDesktopMain.js.map":
+                case "main.js.map":
                     cb(join(__dirname, url));
                     break;
                 default:

src/main/ipcMain.ts

@@ -131,7 +131,7 @@ ipcMain.handle(IpcEvents.OPEN_MONACO_EDITOR, async () => {
         autoHideMenuBar: true,
         darkTheme: true,
         webPreferences: {
-            preload: join(__dirname, IS_DISCORD_DESKTOP ? "preload.js" : "vencordDesktopPreload.js"),
+            preload: join(__dirname, "preload.js"),
             contextIsolation: true,
             nodeIntegration: false,
             sandbox: false

src/main/patcher.ts

@@ -26,14 +26,14 @@ import { IS_VANILLA } from "./utils/constants";
 
 console.log("[Vencord] Starting up...");
 
+// FIXME: remove at some point
+export const isLegacyNonAsarVencord = IS_STANDALONE && !__dirname.endsWith(".asar");
+
 // Our injector file at app/index.js
 const injectorPath = require.main!.filename;
 
-// special discord_arch_electron injection method
-const asarName = require.main!.path.endsWith("app.asar") ? "_app.asar" : "app.asar";
-
 // The original app.asar
-const asarPath = join(dirname(injectorPath), "..", asarName);
+const asarPath = join(dirname(injectorPath), "..", "_app.asar");
 
 const discordPkg = require(join(asarPath, "package.json"));
 require.main!.filename = join(asarPath, discordPkg.main);
@@ -41,7 +41,7 @@ require.main!.filename = join(asarPath, discordPkg.main);
 // @ts-ignore Untyped method? Dies from cringe
 app.setAppPath(asarPath);
 
-if (!IS_VANILLA) {
+if (!IS_VANILLA && !isLegacyNonAsarVencord) {
     const settings = RendererSettings.store;
     // Repatch after host updates on Windows
     if (process.platform === "win32") {
@@ -71,7 +71,7 @@ if (!IS_VANILLA) {
         constructor(options: BrowserWindowConstructorOptions) {
             if (options?.webPreferences?.preload && options.title) {
                 const original = options.webPreferences.preload;
-                options.webPreferences.preload = join(__dirname, IS_DISCORD_DESKTOP ? "preload.js" : "vencordDesktopPreload.js");
+                options.webPreferences.preload = join(__dirname, "preload.js");
                 options.webPreferences.sandbox = false;
                 // work around discord unloading when in background
                 options.webPreferences.backgroundThrottling = false;
@@ -157,5 +157,7 @@ if (!IS_VANILLA) {
     console.log("[Vencord] Running in vanilla mode. Not loading Vencord");
 }
 
+if (!isLegacyNonAsarVencord) {
     console.log("[Vencord] Loading original Discord app.asar");
     require(require.main!.filename);
+}

src/main/updater/common.ts

@@ -16,12 +16,9 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-export const VENCORD_FILES = [
-    IS_DISCORD_DESKTOP ? "patcher.js" : "vencordDesktopMain.js",
-    IS_DISCORD_DESKTOP ? "preload.js" : "vencordDesktopPreload.js",
-    IS_DISCORD_DESKTOP ? "renderer.js" : "vencordDesktopRenderer.js",
-    IS_DISCORD_DESKTOP ? "renderer.css" : "vencordDesktopRenderer.css",
-];
+export const ASAR_FILE = IS_VESKTOP
+    ? "vesktop.asar"
+    : "desktop.asar";
 
 export function serializeErrors(func: (...args: any[]) => any) {
     return async function () {

src/main/updater/http.ts

@@ -16,20 +16,27 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { get } from "@main/utils/simpleGet";
+import { isLegacyNonAsarVencord } from "@main/patcher";
 import { IpcEvents } from "@shared/IpcEvents";
 import { VENCORD_USER_AGENT } from "@shared/vencordUserAgent";
-import { ipcMain } from "electron";
-import { writeFile } from "fs/promises";
+import { app, dialog, ipcMain } from "electron";
+import {
+    existsSync as originalExistsSync,
+    renameSync as originalRenameSync,
+    writeFileSync as originalWriteFileSync,
+} from "original-fs";
 import { join } from "path";
 
 import gitHash from "~git-hash";
 import gitRemote from "~git-remote";
 
-import { serializeErrors, VENCORD_FILES } from "./common";
+import { get } from "../utils/simpleGet";
+import { ASAR_FILE, serializeErrors } from "./common";
 
 const API_BASE = `https://api.github.com/repos/${gitRemote}`;
-let PendingUpdates = [] as [string, string][];
+let PendingUpdate: string | null = null;
+
+let hasUpdateToApplyOnQuit = false;
 
 async function githubGet(endpoint: string) {
     return get(API_BASE + endpoint, {
@@ -65,22 +72,22 @@ async function fetchUpdates() {
     if (hash === gitHash)
         return false;
 
-    data.assets.forEach(({ name, browser_download_url }) => {
-        if (VENCORD_FILES.some(s => name.startsWith(s))) {
-            PendingUpdates.push([name, browser_download_url]);
-        }
-    });
+
+    const asset = data.assets.find(a => a.name === ASAR_FILE);
+    PendingUpdate = asset.browser_download_url;
+
     return true;
 }
 
 async function applyUpdates() {
-    await Promise.all(PendingUpdates.map(
-        async ([name, data]) => writeFile(
-            join(__dirname, name),
-            await get(data)
-        )
-    ));
-    PendingUpdates = [];
+    if (!PendingUpdate) return true;
+
+    const data = await get(PendingUpdate);
+    originalWriteFileSync(__dirname + ".new", data);
+    hasUpdateToApplyOnQuit = true;
+
+    PendingUpdate = null;
+
     return true;
 }
 
@@ -88,3 +95,51 @@ ipcMain.handle(IpcEvents.GET_REPO, serializeErrors(() => `https://github.com/${g
 ipcMain.handle(IpcEvents.GET_UPDATES, serializeErrors(calculateGitChanges));
 ipcMain.handle(IpcEvents.UPDATE, serializeErrors(fetchUpdates));
 ipcMain.handle(IpcEvents.BUILD, serializeErrors(applyUpdates));
+
+async function migrateLegacyToAsar() {
+    try {
+        const isFlatpak = process.platform === "linux" && !!process.env.FLATPAK_ID;
+        if (isFlatpak) throw "Flatpak Discord can't automatically be migrated.";
+
+        const data = await get(`https://github.com/${gitRemote}/releases/latest/download/desktop.asar`);
+
+        originalWriteFileSync(join(__dirname, "../vencord.asar"), data);
+        originalWriteFileSync(__filename, '// Legacy shim for new asar\n\nrequire("../vencord.asar");');
+
+        app.relaunch();
+        app.exit();
+    } catch (e) {
+        console.error("Failed to migrate to asar", e);
+
+        app.whenReady().then(() => {
+            dialog.showErrorBox(
+                "Legacy Install",
+                "The way Vencord loaded was changed and the updater failed to migrate. Please reinstall using the Vencord Installer!"
+            );
+            app.exit(1);
+        });
+    }
+}
+
+function applyPreviousUpdate() {
+    originalRenameSync(__dirname + ".new", __dirname);
+
+    app.relaunch();
+    app.exit();
+}
+
+
+app.on("will-quit", () => {
+    if (hasUpdateToApplyOnQuit)
+        originalRenameSync(__dirname + ".new", __dirname);
+});
+
+if (isLegacyNonAsarVencord) {
+    console.warn("This is a legacy non asar install! Migrating to asar and restarting...");
+    migrateLegacyToAsar();
+}
+
+if (originalExistsSync(__dirname + ".new")) {
+    console.warn("Found previous not applied update, applying now and restarting...");
+    applyPreviousUpdate();
+}

src/main/utils/constants.ts

@@ -35,8 +35,7 @@ export const ALLOWED_PROTOCOLS = [
     "steam:",
     "spotify:",
     "com.epicgames.launcher:",
-    "tidal:",
-    "itunes:",
+    "tidal:"
 ];
 
 export const IS_VANILLA = /* @__PURE__ */ process.argv.includes("--vanilla");

src/modules.d.ts

@@ -16,6 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+// eslint-disable-next-line spaced-comment
 /// <reference types="standalone-electron-types"/>
 
 declare module "~plugins" {

src/plugins/_api/badges/fixBadgeOverflow.css

@@ -0,0 +1,3 @@
+[class*="profileBadges"] {
+    flex: none;
+}

src/plugins/_api/badges/index.tsx

@@ -16,6 +16,8 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import "./fixBadgeOverflow.css";
+
 import { _getBadges, BadgePosition, BadgeUserArgs, ProfileBadge } from "@api/Badges";
 import DonateButton from "@components/DonateButton";
 import ErrorBoundary from "@components/ErrorBoundary";
@@ -60,6 +62,34 @@ export default definePlugin({
     authors: [Devs.Megu, Devs.Ven, Devs.TheSun],
     required: true,
     patches: [
+        /* Patch the badge list component on user profiles */
+        {
+            find: 'id:"premium",',
+            replacement: [
+                {
+                    match: /&&(\i)\.push\(\{id:"premium".+?\}\);/,
+                    replace: "$&$1.unshift(...$self.getBadges(arguments[0]));",
+                },
+                {
+                    // alt: "", aria-hidden: false, src: originalSrc
+                    match: /alt:" ","aria-hidden":!0,src:(?=(\i)\.src)/,
+                    // ...badge.props, ..., src: badge.image ?? ...
+                    replace: "...$1.props,$& $1.image??"
+                },
+                // replace their component with ours if applicable
+                {
+                    match: /(?<=text:(\i)\.description,spacing:12,.{0,50})children:/,
+                    replace: "children:$1.component ? () => $self.renderBadgeComponent($1) :"
+                },
+                // conditionally override their onClick with badge.onClick if it exists
+                {
+                    match: /href:(\i)\.link/,
+                    replace: "...($1.onClick && { onClick: vcE => $1.onClick(vcE, $1) }),$&"
+                }
+            ]
+        },
+
+        /* new profiles */
         {
             find: ".FULL_SIZE]:26",
             replacement: {
@@ -77,7 +107,7 @@ export default definePlugin({
                     replace: "...$1.props,$& $1.image??"
                 },
                 {
-                    match: /(?<=text:(\i)\.description,.{0,200})children:/,
+                    match: /(?<=text:(\i)\.description,.{0,50})children:/,
                     replace: "children:$1.component ? $self.renderBadgeComponent({ ...$1 }) :"
                 },
                 // conditionally override their onClick with badge.onClick if it exists

src/plugins/_api/messagePopover.ts

@@ -26,8 +26,13 @@ export default definePlugin({
     patches: [{
         find: "Messages.MESSAGE_UTILITIES_A11Y_LABEL",
         replacement: {
-            match: /\.jsx\)\((\i\.\i),\{label:\i\.\i\.Messages\.MESSAGE_ACTION_REPLY.{0,200}?"reply-self".{0,50}?\}\):null(?=,.+?message:(\i))/,
-            replace: "$&,Vencord.Api.MessagePopover._buildPopoverElements($1,$2)"
+            // foo && !bar ? createElement(reactionStuffs)... createElement(blah,...makeElement(reply-other))
+            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");
+                return `...Vencord.Api.MessagePopover._buildPopoverElements(${msg},${makeElement}),${m}`;
+            }
         }
     }],
 });

src/plugins/_api/serverList.ts

@@ -34,7 +34,7 @@ export default definePlugin({
         {
             find: "Messages.SERVERS,children",
             replacement: {
-                match: /(?<=Messages\.SERVERS,children:)\i\.map\(\i\)/,
+                match: /(?<=Messages\.SERVERS,children:).+?default:return null\}\}\)/,
                 replace: "Vencord.Api.ServerList.renderAll(Vencord.Api.ServerList.ServerListRenderPosition.In).concat($&)"
             }
         }

src/plugins/_core/noTrack.ts

@@ -48,7 +48,7 @@ export default definePlugin({
             },
         },
         {
-            find: ".METRICS",
+            find: ".METRICS,",
             replacement: [
                 {
                     match: /this\._intervalId=/,

src/plugins/_core/settings.tsx

@@ -64,7 +64,7 @@ export default definePlugin({
                     replace: (_, sectionTypes, commaOrSemi, elements, element) => `${commaOrSemi} $self.addSettings(${elements}, ${element}, ${sectionTypes}) ${commaOrSemi}`
                 },
                 {
-                    match: /({(?=.+?function (\i).{0,120}(\i)=\i\.useMemo.{0,60}return \i\.useMemo\(\(\)=>\i\(\3).+?function\(\){return )\2(?=})/,
+                    match: /({(?=.+?function (\i).{0,120}(\i)=\i\.useMemo.{0,30}return \i\.useMemo\(\(\)=>\i\(\3).+?function\(\){return )\2(?=})/,
                     replace: (_, rest, settingsHook) => `${rest}$self.wrapSettingsHook(${settingsHook})`
                 }
             ]

src/plugins/accountPanelServerProfile/README.md

@@ -1,7 +0,0 @@
-# AccountPanelServerProfile
-
-Right click your account panel in the bottom left to view your profile in the current server
-
-![](https://github.com/user-attachments/assets/3228497d-488f-479c-93d2-a32ccdb08f0f)
-
-![](https://github.com/user-attachments/assets/6fc45363-d95f-4810-812f-2f9fb28b41b5)

src/plugins/accountPanelServerProfile/index.tsx

@@ -1,134 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import { definePluginSettings } from "@api/Settings";
-import ErrorBoundary from "@components/ErrorBoundary";
-import { Devs } from "@utils/constants";
-import { getCurrentChannel } from "@utils/discord";
-import definePlugin, { OptionType } from "@utils/types";
-import { findByPropsLazy, findComponentByCodeLazy } from "@webpack";
-import { ContextMenuApi, Menu, useEffect, useRef } from "@webpack/common";
-import { User } from "discord-types/general";
-
-interface UserProfileProps {
-    popoutProps: Record<string, any>;
-    currentUser: User;
-    originalPopout: () => React.ReactNode;
-}
-
-const UserProfile = findComponentByCodeLazy("UserProfilePopoutWrapper: user cannot be undefined");
-const styles = findByPropsLazy("accountProfilePopoutWrapper");
-
-let openAlternatePopout = false;
-let accountPanelRef: React.MutableRefObject<Record<PropertyKey, any> | null> = { current: null };
-
-const AccountPanelContextMenu = ErrorBoundary.wrap(() => {
-    const { prioritizeServerProfile } = settings.use(["prioritizeServerProfile"]);
-
-    return (
-        <Menu.Menu
-            navId="vc-ap-server-profile"
-            onClose={ContextMenuApi.closeContextMenu}
-        >
-            <Menu.MenuItem
-                id="vc-ap-view-alternate-popout"
-                label={prioritizeServerProfile ? "View Account Profile" : "View Server Profile"}
-                disabled={getCurrentChannel()?.getGuildId() == null}
-                action={e => {
-                    openAlternatePopout = true;
-                    accountPanelRef.current?.props.onMouseDown();
-                    accountPanelRef.current?.props.onClick(e);
-                }}
-            />
-            <Menu.MenuCheckboxItem
-                id="vc-ap-prioritize-server-profile"
-                label="Prioritize Server Profile"
-                checked={prioritizeServerProfile}
-                action={() => settings.store.prioritizeServerProfile = !prioritizeServerProfile}
-            />
-        </Menu.Menu>
-    );
-}, { noop: true });
-
-const settings = definePluginSettings({
-    prioritizeServerProfile: {
-        type: OptionType.BOOLEAN,
-        description: "Prioritize Server Profile when left clicking your account panel",
-        default: false
-    }
-});
-
-export default definePlugin({
-    name: "AccountPanelServerProfile",
-    description: "Right click your account panel in the bottom left to view your profile in the current server",
-    authors: [Devs.Nuckyz, Devs.relitrix],
-    settings,
-
-    patches: [
-        {
-            find: ".Messages.ACCOUNT_SPEAKING_WHILE_MUTED",
-            group: true,
-            replacement: [
-                {
-                    match: /(?<=\.SIZE_32\)}\);)/,
-                    replace: "$self.useAccountPanelRef();"
-                },
-                {
-                    match: /(\.AVATAR,children:.+?renderPopout:(\i)=>){(.+?)}(?=,position)(?<=currentUser:(\i).+?)/,
-                    replace: (_, rest, popoutProps, originalPopout, currentUser) => `${rest}$self.UserProfile({popoutProps:${popoutProps},currentUser:${currentUser},originalPopout:()=>{${originalPopout}}})`
-                },
-                {
-                    match: /\.AVATAR,children:.+?(?=renderPopout:)/,
-                    replace: "$&onRequestClose:$self.onPopoutClose,"
-                },
-                {
-                    match: /(?<=.avatarWrapper,)/,
-                    replace: "ref:$self.accountPanelRef,onContextMenu:$self.openAccountPanelContextMenu,"
-                }
-            ]
-        }
-    ],
-
-    get accountPanelRef() {
-        return accountPanelRef;
-    },
-
-    useAccountPanelRef() {
-        useEffect(() => () => {
-            accountPanelRef.current = null;
-        }, []);
-
-        return (accountPanelRef = useRef(null));
-    },
-
-    openAccountPanelContextMenu(event: React.UIEvent) {
-        ContextMenuApi.openContextMenu(event, AccountPanelContextMenu);
-    },
-
-    onPopoutClose() {
-        openAlternatePopout = false;
-    },
-
-    UserProfile: ErrorBoundary.wrap(({ popoutProps, currentUser, originalPopout }: UserProfileProps) => {
-        if (
-            (settings.store.prioritizeServerProfile && openAlternatePopout) ||
-            (!settings.store.prioritizeServerProfile && !openAlternatePopout)
-        ) {
-            return originalPopout();
-        }
-
-        const currentChannel = getCurrentChannel();
-        if (currentChannel?.getGuildId() == null) {
-            return originalPopout();
-        }
-
-        return (
-            <div className={styles.accountProfilePopoutWrapper}>
-                <UserProfile {...popoutProps} userId={currentUser.id} guildId={currentChannel.getGuildId()} channelId={currentChannel.id} />
-            </div>
-        );
-    }, { noop: true })
-});

src/plugins/alwaysExpandRoles/README.md

@@ -1,3 +0,0 @@
-# Always Expand Roles
-
-Always expands the role list in profile popouts

src/plugins/automodContext/README.md

@@ -0,0 +1,5 @@
+# AutomodContext
+
+Allows you to jump to the messages surrounding an automod hit
+
+![Visualization](https://github.com/Vendicated/Vencord/assets/61953774/d13740c8-2062-4553-b975-82fd3d6cc08b)

src/plugins/automodContext/index.tsx

@@ -0,0 +1,73 @@
+/*
+ * Vencord, a Discord client mod
+ * Copyright (c) 2024 Vendicated and contributors
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ */
+
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Devs } from "@utils/constants";
+import definePlugin from "@utils/types";
+import { findByPropsLazy } from "@webpack";
+import { Button, ChannelStore, Text } from "@webpack/common";
+
+const { selectChannel } = findByPropsLazy("selectChannel", "selectVoiceChannel");
+
+function jumpToMessage(channelId: string, messageId: string) {
+    const guildId = ChannelStore.getChannel(channelId)?.guild_id;
+
+    selectChannel({
+        guildId,
+        channelId,
+        messageId,
+        jumpType: "INSTANT"
+    });
+}
+
+function findChannelId(message: any): string | null {
+    const { embeds: [embed] } = message;
+    const channelField = embed.fields.find(({ rawName }) => rawName === "channel_id");
+
+    if (!channelField) {
+        return null;
+    }
+
+    return channelField.rawValue;
+}
+
+export default definePlugin({
+    name: "AutomodContext",
+    description: "Allows you to jump to the messages surrounding an automod hit.",
+    authors: [Devs.JohnyTheCarrot],
+
+    patches: [
+        {
+            find: ".Messages.GUILD_AUTOMOD_REPORT_ISSUES",
+            replacement: {
+                match: /\.Messages\.ACTIONS.+?}\)(?=,(\(0.{0,40}\.dot.*?}\)),)/,
+                replace: (m, dot) => `${m},${dot},$self.renderJumpButton({message:arguments[0].message})`
+            }
+        }
+    ],
+
+    renderJumpButton: ErrorBoundary.wrap(({ message }: { message: any; }) => {
+        const channelId = findChannelId(message);
+
+        if (!channelId) {
+            return null;
+        }
+
+        return (
+            <Button
+                style={{ padding: "2px 8px" }}
+                look={Button.Looks.LINK}
+                size={Button.Sizes.SMALL}
+                color={Button.Colors.LINK}
+                onClick={() => jumpToMessage(channelId, message.id)}
+            >
+                <Text color="text-link" variant="text-xs/normal">
+                    Jump to Surrounding
+                </Text>
+            </Button>
+        );
+    }, { noop: true })
+});

src/plugins/betterFolders/index.tsx

@@ -132,8 +132,8 @@ export default definePlugin({
                 },
                 // Export the isBetterFolders variable to the folders component
                 {
-                    match: /switch\(\i\.type\){case \i\.\i\.FOLDER:.+?folderNode:\i,/,
-                    replace: '$&isBetterFolders:typeof isBetterFolders!=="undefined"?isBetterFolders:false,'
+                    match: /(?<=\.Messages\.SERVERS.+?switch\((\i)\.type\){case \i\.\i\.FOLDER:.+?folderNode:\i,)/,
+                    replace: 'isBetterFolders:typeof isBetterFolders!=="undefined"?isBetterFolders:false,'
                 }
             ]
         },
@@ -249,10 +249,6 @@ export default definePlugin({
                     dispatchingFoldersClose = false;
                 });
             }
-        },
-
-        LOGOUT() {
-            closeFolders();
         }
     },
 

src/plugins/betterNotes/index.tsx

@@ -17,9 +17,13 @@
 */
 
 import { definePluginSettings, Settings } from "@api/Settings";
+import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import { canonicalizeMatch } from "@utils/patches";
 import definePlugin, { OptionType } from "@utils/types";
+import { findByPropsLazy } from "@webpack";
+
+const UserPopoutSectionCssClasses = findByPropsLazy("section", "lastSection");
 
 const settings = definePluginSettings({
     hide: {
@@ -68,9 +72,23 @@ export default definePlugin({
                 match: /\.NOTE_PLACEHOLDER,/,
                 replace: "$&spellCheck:!$self.noSpellCheck,"
             }
+        },
+        {
+            find: ".popularApplicationCommandIds,",
+            replacement: {
+                match: /lastSection:(!?\i)}\),/,
+                replace: "$&$self.patchPadding({lastSection:$1}),"
+            }
         }
     ],
 
+    patchPadding: ErrorBoundary.wrap(({ lastSection }) => {
+        if (!lastSection) return null;
+        return (
+            <div className={UserPopoutSectionCssClasses.lastSection} ></div>
+        );
+    }),
+
     get noSpellCheck() {
         return settings.store.noSpellCheck;
     }

src/plugins/betterUploadButton/index.ts

@@ -25,9 +25,11 @@ export default definePlugin({
     description: "Upload with a single click, open menu with right click",
     patches: [
         {
-            find: '"ChannelAttachButton"',
+            find: "Messages.CHAT_ATTACH_UPLOAD_OR_INVITE",
             replacement: {
-                match: /\.attachButtonInner,"aria-label":.{0,50},onDoubleClick:(.+?:void 0),\.\.\.(\i),/,
+                // Discord merges multiple props here with Object.assign()
+                // This patch passes a third object to it with which we override onClick and onContextMenu
+                match: /CHAT_ATTACH_UPLOAD_OR_INVITE,onDoubleClick:(.+?:void 0),\.\.\.(\i),/,
                 replace: "$&onClick:$1,onContextMenu:$2.onClick,",
             },
         },

src/plugins/clientTheme/index.tsx

@@ -12,7 +12,7 @@ import { Margins } from "@utils/margins";
 import { classes } from "@utils/misc";
 import definePlugin, { OptionType, StartAt } from "@utils/types";
 import { findByCodeLazy, findComponentByCodeLazy, findStoreLazy } from "@webpack";
-import { Button, Forms, ThemeStore, useStateFromStores } from "@webpack/common";
+import { Button, Forms, useStateFromStores } from "@webpack/common";
 
 const ColorPicker = findComponentByCodeLazy(".Messages.USER_SETTINGS_PROFILE_COLOR_SELECT_COLOR", ".BACKGROUND_PRIMARY)");
 
@@ -30,12 +30,13 @@ function onPickColor(color: number) {
     updateColorVars(hexColor);
 }
 
-const saveClientTheme = findByCodeLazy('type:"UNSYNCED_USER_SETTINGS_UPDATE', '"system"===');
+const saveClientTheme = findByCodeLazy('type:"UNSYNCED_USER_SETTINGS_UPDATE",settings:{useSystemTheme:"system"===');
 
 function setTheme(theme: string) {
     saveClientTheme({ theme });
 }
 
+const ThemeStore = findStoreLazy("ThemeStore");
 const NitroThemeStore = findStoreLazy("ClientThemesBackgroundStore");
 
 function ThemeSettings() {

src/plugins/consoleJanitor/index.ts

@@ -60,6 +60,13 @@ export default definePlugin({
                 replace: ""
             }
         },
+        {
+            find: "notosans-400-normalitalic",
+            replacement: {
+                match: /,"notosans-.+?"/g,
+                replace: ""
+            }
+        },
         {
             find: 'console.warn("[DEPRECATED] Please use `subscribeWithSelector` middleware");',
             all: true,

src/plugins/copyFileContents/README.md

@@ -1,5 +0,0 @@
-# CopyFileContents
-
-Adds a button to text file attachments to copy their contents.
-
-![](https://github.com/user-attachments/assets/b1a0f6f4-106f-4953-94d9-4c5ef5810bca)

src/plugins/copyFileContents/index.tsx

@@ -1,60 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import "./style.css";
-
-import ErrorBoundary from "@components/ErrorBoundary";
-import { CopyIcon, NoEntrySignIcon } from "@components/Icons";
-import { Devs } from "@utils/constants";
-import { copyWithToast } from "@utils/misc";
-import definePlugin from "@utils/types";
-import { Tooltip, useState } from "@webpack/common";
-
-const CheckMarkIcon = () => {
-    return <svg width="24" height="24" viewBox="0 0 24 24">
-        <path fill="currentColor" d="M21.7 5.3a1 1 0 0 1 0 1.4l-12 12a1 1 0 0 1-1.4 0l-6-6a1 1 0 1 1 1.4-1.4L9 16.58l11.3-11.3a1 1 0 0 1 1.4 0Z"></path>
-    </svg>;
-};
-
-export default definePlugin({
-    name: "CopyFileContents",
-    description: "Adds a button to text file attachments to copy their contents",
-    authors: [Devs.Obsidian, Devs.Nuckyz],
-    patches: [
-        {
-            find: ".Messages.PREVIEW_BYTES_LEFT.format(",
-            replacement: {
-                match: /\.footerGap.+?url:\i,fileName:\i,fileSize:\i}\),(?<=fileContents:(\i),bytesLeft:(\i).+?)/g,
-                replace: "$&$self.addCopyButton({fileContents:$1,bytesLeft:$2}),"
-            }
-        }
-    ],
-
-    addCopyButton: ErrorBoundary.wrap(({ fileContents, bytesLeft }: { fileContents: string, bytesLeft: number; }) => {
-        const [recentlyCopied, setRecentlyCopied] = useState(false);
-
-        return (
-            <Tooltip text={recentlyCopied ? "Copied!" : bytesLeft > 0 ? "File too large to copy" : "Copy File Contents"}>
-                {tooltipProps => (
-                    <div
-                        {...tooltipProps}
-                        className="vc-cfc-button"
-                        role="button"
-                        onClick={() => {
-                            if (!recentlyCopied && bytesLeft <= 0) {
-                                copyWithToast(fileContents);
-                                setRecentlyCopied(true);
-                                setTimeout(() => setRecentlyCopied(false), 2000);
-                            }
-                        }}
-                    >
-                        {recentlyCopied ? <CheckMarkIcon /> : bytesLeft > 0 ? <NoEntrySignIcon color="var(--channel-icon)" /> : <CopyIcon />}
-                    </div>
-                )}
-            </Tooltip>
-        );
-    }, { noop: true }),
-});

src/plugins/copyFileContents/style.css

@@ -1,8 +0,0 @@
-.vc-cfc-button {
-    color: var(--interactive-normal);
-    cursor: pointer;
-}
-
-.vc-cfc-button:hover {
-    color: var(--interactive-hover);
-}

src/plugins/customRPC/index.tsx

@@ -26,11 +26,12 @@ import { Margins } from "@utils/margins";
 import { classes } from "@utils/misc";
 import { useAwaiter } from "@utils/react";
 import definePlugin, { OptionType } from "@utils/types";
-import { findByCodeLazy, findComponentByCodeLazy } from "@webpack";
+import { findByCodeLazy, findByPropsLazy, findComponentByCodeLazy } from "@webpack";
 import { ApplicationAssetUtils, Button, FluxDispatcher, Forms, GuildStore, React, SelectedChannelStore, SelectedGuildStore, UserStore } from "@webpack/common";
 
 const useProfileThemeStyle = findByCodeLazy("profileThemeStyle:", "--profile-gradient-primary-color");
 const ActivityComponent = findComponentByCodeLazy("onOpenGameProfile");
+const ActivityClassName = findByPropsLazy("activity", "buttonColor");
 
 const ShowCurrentGame = getUserSettingLazy<boolean>("status", "showCurrentGame")!;
 
@@ -435,8 +436,8 @@ export default definePlugin({
 
                 <Forms.FormDivider className={Margins.top8} />
 
-                <div style={{ width: "284px", ...profileThemeStyle, padding: 8, marginTop: 8, borderRadius: 8, background: "var(--bg-mod-faint)" }}>
-                    {activity[0] && <ActivityComponent activity={activity[0]} channelId={SelectedChannelStore.getChannelId()}
+                <div style={{ width: "284px", ...profileThemeStyle }}>
+                    {activity[0] && <ActivityComponent activity={activity[0]} className={ActivityClassName.activity} channelId={SelectedChannelStore.getChannelId()}
                         guild={GuildStore.getGuild(SelectedGuildStore.getLastSelectedGuildId())}
                         application={{ id: settings.store.appID }}
                         user={UserStore.getCurrentUser()} />}

src/plugins/dearrow/index.tsx

@@ -46,7 +46,7 @@ const embedUrlRe = /https:\/\/www\.youtube\.com\/embed\/([a-zA-Z0-9_-]{11})/;
 async function embedDidMount(this: Component<Props>) {
     try {
         const { embed } = this.props;
-        const { replaceElements, dearrowByDefault } = settings.store;
+        const { replaceElements } = settings.store;
 
         if (!embed || embed.dearrow || embed.provider?.name !== "YouTube" || !embed.video?.url) return;
 
@@ -63,22 +63,18 @@ async function embedDidMount(this: Component<Props>) {
 
         if (!hasTitle && !hasThumb) return;
 
-
         embed.dearrow = {
-            enabled: dearrowByDefault
+            enabled: true
         };
 
         if (hasTitle && replaceElements !== ReplaceElements.ReplaceThumbnailsOnly) {
-            const replacementTitle = titles[0].title.replace(/(^|\s)>(\S)/g, "$1$2");
-
-            embed.dearrow.oldTitle = dearrowByDefault ? embed.rawTitle : replacementTitle;
-            if (dearrowByDefault) embed.rawTitle = replacementTitle;
+            embed.dearrow.oldTitle = embed.rawTitle;
+            embed.rawTitle = titles[0].title.replace(/(^|\s)>(\S)/g, "$1$2");
         }
-        if (hasThumb && replaceElements !== ReplaceElements.ReplaceTitlesOnly) {
-            const replacementProxyURL = `https://dearrow-thumb.ajay.app/api/v1/getThumbnail?videoID=${videoId}&time=${thumbnails[0].timestamp}`;
 
-            embed.dearrow.oldThumb = dearrowByDefault ? embed.thumbnail.proxyURL : replacementProxyURL;
-            if (dearrowByDefault) embed.thumbnail.proxyURL = replacementProxyURL;
+        if (hasThumb && replaceElements !== ReplaceElements.ReplaceTitlesOnly) {
+            embed.dearrow.oldThumb = embed.thumbnail.proxyURL;
+            embed.thumbnail.proxyURL = `https://dearrow-thumb.ajay.app/api/v1/getThumbnail?videoID=${videoId}&time=${thumbnails[0].timestamp}`;
         }
 
         this.forceUpdate();
@@ -100,7 +96,6 @@ function DearrowButton({ component }: { component: Component<Props>; }) {
                     className={"vc-dearrow-toggle-" + (embed.dearrow.enabled ? "on" : "off")}
                     onClick={() => {
                         const { enabled, oldThumb, oldTitle } = embed.dearrow;
-                        settings.store.dearrowByDefault = !enabled;
                         embed.dearrow.enabled = !enabled;
                         if (oldTitle) {
                             embed.dearrow.oldTitle = embed.rawTitle;
@@ -158,12 +153,6 @@ const settings = definePluginSettings({
             { label: "Titles", value: ReplaceElements.ReplaceTitlesOnly },
             { label: "Thumbnails", value: ReplaceElements.ReplaceThumbnailsOnly },
         ],
-    },
-    dearrowByDefault: {
-        description: "Dearrow videos automatically",
-        type: OptionType.BOOLEAN,
-        default: true,
-        restartNeeded: false
     }
 });
 

src/plugins/decor/index.tsx

@@ -91,7 +91,7 @@ export default definePlugin({
             replacement: [
                 // Use Decor avatar decoration hook
                 {
-                    match: /(?<=\i\)\({avatarDecoration:)(\i)(?=,)(?<=currentUser:(\i).+?)/,
+                    match: /(?<=\i\)\({avatarDecoration:)(\i).avatarDecoration(?=,)/,
                     replace: "$self.useUserDecorAvatarDecoration($1)??$&"
                 }
             ]

src/plugins/decor/ui/modals/ChangeDecorationModal.tsx

@@ -8,7 +8,7 @@ import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
 import { openInviteModal } from "@utils/discord";
 import { Margins } from "@utils/margins";
-import { classes, copyWithToast } from "@utils/misc";
+import { classes } from "@utils/misc";
 import { closeAllModals, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
 import { findComponentByCodeLazy } from "@webpack";
 import { Alerts, Button, FluxDispatcher, Forms, GuildStore, NavigationRouter, Parser, Text, Tooltip, useEffect, UserStore, UserUtils, useState } from "@webpack/common";
@@ -45,11 +45,7 @@ interface Section {
     authorIds?: string[];
 }
 
-interface SectionHeaderProps {
-    section: Section;
-}
-
-function SectionHeader({ section }: SectionHeaderProps) {
+function SectionHeader({ section }: { section: Section; }) {
     const hasSubtitle = typeof section.subtitle !== "undefined";
     const hasAuthorIds = typeof section.authorIds !== "undefined";
 
@@ -66,7 +62,6 @@ function SectionHeader({ section }: SectionHeaderProps) {
         })();
     }, [section.authorIds]);
 
-
     return <div>
         <Flex>
             <Forms.FormTitle style={{ flexGrow: 1 }}>{section.title}</Forms.FormTitle>
@@ -79,7 +74,8 @@ function SectionHeader({ section }: SectionHeaderProps) {
                 size={16}
                 showUserPopout
                 className={Margins.bottom8}
-            />}
+            />
+            }
         </Flex>
         {hasSubtitle &&
             <Forms.FormText type="description" className={Margins.bottom8}>
@@ -208,16 +204,7 @@ function ChangeDecorationModal(props: ModalProps) {
                             {activeSelectedDecoration?.alt}
                         </Text>
                     }
-                    {activeDecorationHasAuthor && (
-                        <Text key={`createdBy-${activeSelectedDecoration.authorId}`}>
-                            Created by {Parser.parse(`<@${activeSelectedDecoration.authorId}>`)}
-                        </Text>
-                    )}
-                    {isActiveDecorationPreset && (
-                        <Button onClick={() => copyWithToast(activeDecorationPreset.id)}>
-                            Copy Preset ID
-                        </Button>
-                    )}
+                    {activeDecorationHasAuthor && <Text key={`createdBy-${activeSelectedDecoration.authorId}`}>Created by {Parser.parse(`<@${activeSelectedDecoration.authorId}>`)}</Text>}
                 </div>
             </ErrorBoundary>
         </ModalContent>

src/plugins/fakeProfileThemes/index.tsx

@@ -57,7 +57,7 @@ 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}]{1,6})\u{e002c}\u{e0023}([\u{e0061}-\u{e0066}\u{e0041}-\u{e0046}\u{e0030}-\u{e0039}]{1,6})\u{e005d}/u,
+        /\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]]
@@ -121,7 +121,7 @@ export default definePlugin({
         {
             find: "UserProfileStore",
             replacement: {
-                match: /(?<=getUserProfile\(\i\){return )(.+?)(?=})/,
+                match: /(?<=getUserProfile\(\i\){return )(\i\[\i\])/,
                 replace: "$self.colorDecodeHook($1)"
             }
         },

src/plugins/forceOwnerCrown/index.ts

@@ -27,7 +27,7 @@ export default definePlugin({
     authors: [Devs.D3SOX, Devs.Nickyux],
     patches: [
         {
-            find: ".Messages.GUILD_OWNER,",
+            find: ".PREMIUM_GUILD_SUBSCRIPTION_TOOLTIP",
             replacement: {
                 match: /,isOwner:(\i),/,
                 replace: ",_isOwner:$1=$self.isGuildOwner(e),"

src/plugins/friendsSince/index.tsx

@@ -7,47 +7,121 @@
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import { getCurrentChannel } from "@utils/discord";
+import { Logger } from "@utils/Logger";
 import definePlugin from "@utils/types";
-import { findByCodeLazy, findByPropsLazy, findComponentByCodeLazy } from "@webpack";
-import { RelationshipStore, Text } from "@webpack/common";
+import { findByCodeLazy, findByPropsLazy, findLazy } from "@webpack";
+import { Heading, RelationshipStore, Text } from "@webpack/common";
 
 const containerWrapper = findByPropsLazy("memberSinceWrapper");
 const container = findByPropsLazy("memberSince");
 const getCreatedAtDate = findByCodeLazy('month:"short",day:"numeric"');
 const locale = findByPropsLazy("getLocale");
-const Section = findComponentByCodeLazy('"auto":"smooth"', ".section");
+const lastSection = findByPropsLazy("lastSection");
+const section = findLazy((m: any) => m.section !== void 0 && m.heading !== void 0 && Object.values(m).length === 2);
 
 export default definePlugin({
     name: "FriendsSince",
     description: "Shows when you became friends with someone in the user popout",
     authors: [Devs.Elvyra, Devs.Antti],
     patches: [
-        // DM User Sidebar
+        // User popup - old layout
+        {
+            find: ".USER_PROFILE}};return",
+            replacement: {
+                match: /,{userId:(\i.id).{0,30}}\)/,
+                replace: "$&,$self.friendsSinceOld({ userId: $1 })"
+            }
+        },
+        // DM User Sidebar - old layout
+        {
+            find: ".PROFILE_PANEL,",
+            replacement: {
+                match: /,{userId:([^,]+?)}\)/,
+                replace: "$&,$self.friendsSinceOld({ userId: $1 })"
+            }
+        },
+        // User Profile Modal - old layout
+        {
+            find: ".userInfoSectionHeader,",
+            replacement: {
+                match: /(\.Messages\.USER_PROFILE_MEMBER_SINCE.+?userId:(.+?),textClassName:)(\i\.userInfoText)}\)/,
+                replace: (_, rest, userId, textClassName) => `${rest}!$self.getFriendSince(${userId}) ? ${textClassName} : void 0 }), $self.friendsSinceOld({ userId: ${userId}, textClassName: ${textClassName} })`
+            }
+        },
+        // DM User Sidebar - new layout
         {
             find: ".PANEL}),nicknameIcons",
             replacement: {
                 match: /USER_PROFILE_MEMBER_SINCE,.{0,100}userId:(\i\.id)}\)}\)/,
-                replace: "$&,$self.FriendsSinceComponent({userId:$1,isSidebar:true})"
+                replace: "$&,$self.friendsSinceNew({userId:$1,isSidebar:true})"
             }
         },
-        // User Profile Modal
+        // User Profile Modal - new layout
         {
             find: "action:\"PRESS_APP_CONNECTION\"",
             replacement: {
                 match: /USER_PROFILE_MEMBER_SINCE,.{0,100}userId:(\i\.id),.{0,100}}\)}\),/,
-                replace: "$&,$self.FriendsSinceComponent({userId:$1,isSidebar:false}),"
+                replace: "$&,$self.friendsSinceNew({userId:$1,isSidebar:false}),"
             }
         }
     ],
 
-    FriendsSinceComponent: ErrorBoundary.wrap(({ userId, isSidebar }: { userId: string; isSidebar: boolean; }) => {
+    getFriendSince(userId: string) {
+        try {
+            if (!RelationshipStore.isFriend(userId)) return null;
+
+            return RelationshipStore.getSince(userId);
+        } catch (err) {
+            new Logger("FriendsSince").error(err);
+            return null;
+        }
+    },
+
+    friendsSinceOld: ErrorBoundary.wrap(({ userId, textClassName }: { userId: string; textClassName?: string; }) => {
         if (!RelationshipStore.isFriend(userId)) return null;
 
         const friendsSince = RelationshipStore.getSince(userId);
         if (!friendsSince) return null;
 
         return (
-            <Section heading="Friends Since">
+            <div className={lastSection.section}>
+                <Heading variant="eyebrow">
+                    Friends Since
+                </Heading>
+
+                <div className={containerWrapper.memberSinceWrapper}>
+                    {!!getCurrentChannel()?.guild_id && (
+                        <svg
+                            aria-hidden="true"
+                            width="16"
+                            height="16"
+                            viewBox="0 0 24 24"
+                            fill="var(--interactive-normal)"
+                        >
+                            <path d="M13 10a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z" />
+                            <path d="M3 5v-.75C3 3.56 3.56 3 4.25 3s1.24.56 1.33 1.25C6.12 8.65 9.46 12 13 12h1a8 8 0 0 1 8 8 2 2 0 0 1-2 2 .21.21 0 0 1-.2-.15 7.65 7.65 0 0 0-1.32-2.3c-.15-.2-.42-.06-.39.17l.25 2c.02.15-.1.28-.25.28H9a2 2 0 0 1-2-2v-2.22c0-1.57-.67-3.05-1.53-4.37A15.85 15.85 0 0 1 3 5Z" />
+                        </svg>
+                    )}
+                    <Text variant="text-sm/normal" className={textClassName}>
+                        {getCreatedAtDate(friendsSince, locale.getLocale())}
+                    </Text>
+                </div>
+            </div>
+        );
+    }, { noop: true }),
+
+    friendsSinceNew: ErrorBoundary.wrap(({ userId, isSidebar }: { userId: string; isSidebar: boolean; }) => {
+        if (!RelationshipStore.isFriend(userId)) return null;
+
+        const friendsSince = RelationshipStore.getSince(userId);
+        if (!friendsSince) return null;
+
+        return (
+            <section className={section.section}>
+                <Heading variant="text-xs/semibold" style={isSidebar ? {} : { color: "var(--header-secondary)" }}>
+                    Friends Since
+                </Heading>
+
                 {
                     isSidebar ? (
                         <Text variant="text-sm/normal">
@@ -75,7 +149,8 @@ export default definePlugin({
                         </div>
                     )
                 }
-            </Section>
+
+            </section>
         );
     }, { noop: true }),
 });

src/plugins/ignoreActivities/README.md

@@ -1,13 +0,0 @@
-# IgnoreActivities
-
-Ignore activities from showing up on your status ONLY. You can configure which ones are specifically ignored from the Registered Games and Activities tabs, or use the general settings.
-
-![](https://github.com/user-attachments/assets/f0c19060-0ecf-4f1c-8165-a5aa40143c82)
-
-![](https://github.com/user-attachments/assets/73c3fa7a-5b90-41ee-a4d6-91fa76458b74)
-
-![](https://github.com/user-attachments/assets/1ab3fe73-3911-48d1-8a08-e976af614b41)
-
-The activity stays showing as a detected game even if ignored, differently from the stock Toggle Detection button from Discord:
-
-![](https://github.com/user-attachments/assets/08ea60c3-3a31-42de-ae4c-7535fbf1b45a)

src/plugins/ignoreActivities/index.tsx

@@ -26,11 +26,6 @@ interface IgnoredActivity {
     type: ActivitiesTypes;
 }
 
-const enum FilterMode {
-    Whitelist,
-    Blacklist
-}
-
 const RunningGameStore = findStoreLazy("RunningGameStore");
 
 const ShowCurrentGame = getUserSettingLazy("status", "showCurrentGame")!;
@@ -75,17 +70,14 @@ function handleActivityToggle(e: React.MouseEvent<HTMLButtonElement, MouseEvent>
     if (ignoredActivityIndex === -1) settings.store.ignoredActivities = getIgnoredActivities().concat(activity);
     else settings.store.ignoredActivities = getIgnoredActivities().filter((_, index) => index !== ignoredActivityIndex);
 
-    recalculateActivities();
-}
-
-function recalculateActivities() {
+    // Trigger activities recalculation
     ShowCurrentGame.updateSetting(old => old);
 }
 
 function ImportCustomRPCComponent() {
     return (
         <Flex flexDirection="column">
-            <Forms.FormText type={Forms.FormText.Types.DESCRIPTION}>Import the application id of the CustomRPC plugin to the filter list</Forms.FormText>
+            <Forms.FormText type={Forms.FormText.Types.DESCRIPTION}>Import the application id of the CustomRPC plugin to the allowed list</Forms.FormText>
             <div>
                 <Button
                     onClick={() => {
@@ -94,7 +86,7 @@ function ImportCustomRPCComponent() {
                             return showToast("CustomRPC application ID is not set.", Toasts.Type.FAILURE);
                         }
 
-                        const isAlreadyAdded = idsListPushID?.(id);
+                        const isAlreadyAdded = allowedIdsPushID?.(id);
                         if (isAlreadyAdded) {
                             showToast("CustomRPC application ID is already added.", Toasts.Type.FAILURE);
                         }
@@ -107,39 +99,39 @@ function ImportCustomRPCComponent() {
     );
 }
 
-let idsListPushID: ((id: string) => boolean) | null = null;
+let allowedIdsPushID: ((id: string) => boolean) | null = null;
 
-function IdsListComponent(props: { setValue: (value: string) => void; }) {
-    const [idsList, setIdsList] = useState<string>(settings.store.idsList ?? "");
+function AllowedIdsComponent(props: { setValue: (value: string) => void; }) {
+    const [allowedIds, setAllowedIds] = useState<string>(settings.store.allowedIds ?? "");
 
-    idsListPushID = (id: string) => {
-        const currentIds = new Set(idsList.split(",").map(id => id.trim()).filter(Boolean));
+    allowedIdsPushID = (id: string) => {
+        const currentIds = new Set(allowedIds.split(",").map(id => id.trim()).filter(Boolean));
 
         const isAlreadyAdded = currentIds.has(id) || (currentIds.add(id), false);
 
         const ids = Array.from(currentIds).join(", ");
-        setIdsList(ids);
+        setAllowedIds(ids);
         props.setValue(ids);
 
         return isAlreadyAdded;
     };
 
     useEffect(() => () => {
-        idsListPushID = null;
+        allowedIdsPushID = null;
     }, []);
 
     function handleChange(newValue: string) {
-        setIdsList(newValue);
+        setAllowedIds(newValue);
         props.setValue(newValue);
     }
 
     return (
         <Forms.FormSection>
-            <Forms.FormTitle tag="h3">Filter List</Forms.FormTitle>
-            <Forms.FormText className={Margins.bottom8} type={Forms.FormText.Types.DESCRIPTION}>Comma separated list of activity IDs to filter (Useful for filtering specific RPC activities and CustomRPC</Forms.FormText>
+            <Forms.FormTitle tag="h3">Allowed List</Forms.FormTitle>
+            <Forms.FormText className={Margins.bottom8} type={Forms.FormText.Types.DESCRIPTION}>Comma separated list of activity IDs to allow (Useful for allowing RPC activities and CustomRPC)</Forms.FormText>
             <TextInput
                 type="text"
-                value={idsList}
+                value={allowedIds}
                 onChange={handleChange}
                 placeholder="235834946571337729, 343383572805058560"
             />
@@ -153,62 +145,40 @@ const settings = definePluginSettings({
         description: "",
         component: () => <ImportCustomRPCComponent />
     },
-    listMode: {
-        type: OptionType.SELECT,
-        description: "Change the mode of the filter list",
-        options: [
-            {
-                label: "Whitelist",
-                value: FilterMode.Whitelist,
-                default: true
-            },
-            {
-                label: "Blacklist",
-                value: FilterMode.Blacklist,
-            }
-        ],
-        onChange: recalculateActivities
-    },
-    idsList: {
+    allowedIds: {
         type: OptionType.COMPONENT,
         description: "",
         default: "",
         onChange(newValue: string) {
             const ids = new Set(newValue.split(",").map(id => id.trim()).filter(Boolean));
-            settings.store.idsList = Array.from(ids).join(", ");
-            recalculateActivities();
+            settings.store.allowedIds = Array.from(ids).join(", ");
         },
-        component: props => <IdsListComponent setValue={props.setValue} />
+        component: props => <AllowedIdsComponent setValue={props.setValue} />
     },
     ignorePlaying: {
         type: OptionType.BOOLEAN,
         description: "Ignore all playing activities (These are usually game and RPC activities)",
-        default: false,
-        onChange: recalculateActivities
+        default: false
     },
     ignoreStreaming: {
         type: OptionType.BOOLEAN,
         description: "Ignore all streaming activities",
-        default: false,
-        onChange: recalculateActivities
+        default: false
     },
     ignoreListening: {
         type: OptionType.BOOLEAN,
         description: "Ignore all listening activities (These are usually spotify activities)",
-        default: false,
-        onChange: recalculateActivities
+        default: false
     },
     ignoreWatching: {
         type: OptionType.BOOLEAN,
         description: "Ignore all watching activities",
-        default: false,
-        onChange: recalculateActivities
+        default: false
     },
     ignoreCompeting: {
         type: OptionType.BOOLEAN,
         description: "Ignore all competing activities (These are normally special game activities)",
-        default: false,
-        onChange: recalculateActivities
+        default: false
     }
 }).withPrivateSettings<{
     ignoredActivities: IgnoredActivity[];
@@ -219,8 +189,8 @@ function getIgnoredActivities() {
 }
 
 function isActivityTypeIgnored(type: number, id?: string) {
-    if (id && settings.store.idsList.includes(id)) {
-        return settings.store.listMode === FilterMode.Blacklist;
+    if (id && settings.store.allowedIds.includes(id)) {
+        return false;
     }
 
     switch (type) {
@@ -236,8 +206,8 @@ function isActivityTypeIgnored(type: number, id?: string) {
 
 export default definePlugin({
     name: "IgnoreActivities",
-    authors: [Devs.Nuckyz, Devs.Kylie],
-    description: "Ignore activities from showing up on your status ONLY. You can configure which ones are specifically ignored from the Registered Games and Activities tabs, or use the general settings below",
+    authors: [Devs.Nuckyz],
+    description: "Ignore activities from showing up on your status ONLY. You can configure which ones are specifically ignored from the Registered Games and Activities tabs, or use the general settings below.",
     dependencies: ["UserSettingsAPI"],
 
     settings,
@@ -266,7 +236,6 @@ export default definePlugin({
                 replace: (m, props, nowPlaying) => `${m}$self.renderToggleGameActivityButton(${props},${nowPlaying}),`
             }
         },
-        // Discord has 2 different components for activities. Currently, the last is the one being used
         {
             find: ".activityTitleText,variant",
             replacement: {
@@ -275,21 +244,15 @@ export default definePlugin({
             },
         },
         {
-            find: ".promotedLabelWrapperNonBanner,children",
+            find: ".activityCardDetails,children",
             replacement: {
-                match: /\.appDetailsHeaderContainer.+?children:\i.*?}\),(?<=application:(\i).+?)/,
+                match: /\.activityCardDetails.+?children:(\i\.application)\.name.*?}\),/,
                 replace: (m, props) => `${m}$self.renderToggleActivityButton(${props}),`
             }
         }
     ],
 
     async start() {
-        // Migrate allowedIds
-        if (Settings.plugins.IgnoreActivities.allowedIds) {
-            settings.store.idsList = Settings.plugins.IgnoreActivities.allowedIds;
-            delete Settings.plugins.IgnoreActivities.allowedIds; // Remove allowedIds
-        }
-
         const oldIgnoredActivitiesData = await DataStore.get<Map<IgnoredActivity["id"], IgnoredActivity>>("IgnoreActivities_ignoredActivities");
 
         if (oldIgnoredActivitiesData != null) {
@@ -316,7 +279,7 @@ export default definePlugin({
         if (isActivityTypeIgnored(props.type, props.application_id)) return false;
 
         if (props.application_id != null) {
-            return !getIgnoredActivities().some(activity => activity.id === props.application_id) || (settings.store.listMode === FilterMode.Whitelist && settings.store.idsList.includes(props.application_id));
+            return !getIgnoredActivities().some(activity => activity.id === props.application_id) || settings.store.allowedIds.includes(props.application_id);
         } else {
             const exePath = RunningGameStore.getRunningGames().find(game => game.name === props.name)?.exePath;
             if (exePath) {

src/plugins/imageZoom/index.tsx

@@ -171,7 +171,7 @@ export default definePlugin({
             find: ".handleImageLoad)",
             replacement: [
                 {
-                    match: /placeholderVersion:\i,(?=.{0,50}children:)/,
+                    match: /placeholderVersion:\i,/,
                     replace: "...$self.makeProps(this),$&"
                 },
 

src/plugins/implicitRelationships/index.ts

@@ -117,7 +117,7 @@ export default definePlugin({
 
     wrapSort(comparator: Function, row: any) {
         return row.type === 5
-            ? -UserAffinitiesStore.getUserAffinity(row.user.id)?.affinity ?? 0
+            ? -(UserAffinitiesStore.getUserAffinity(row.user.id)?.affinity ?? 0)
             : comparator(row);
     },
 

src/plugins/index.ts

@@ -66,14 +66,14 @@ export function addPatch(newPatch: Omit<Patch, "plugin">, pluginName: string) {
         patch.replacement = [patch.replacement];
     }
 
+    patch.replacement = patch.replacement.filter(({ predicate }) => !predicate || predicate());
+
     if (IS_REPORTER) {
         patch.replacement.forEach(r => {
             delete r.predicate;
         });
     }
 
-    patch.replacement = patch.replacement.filter(({ predicate }) => !predicate || predicate());
-
     patches.push(patch);
 }
 

src/plugins/maskedLinkPaste/README.md

@@ -0,0 +1,5 @@
+# MaskedLinkPaste
+
+Pasting a link while you have text selected will paste your link as a masked link at that location
+
+![](https://github.com/Vendicated/Vencord/assets/78964224/1d3be2c6-7957-44c9-92ec-551069d46c02)

src/plugins/maskedLinkPaste/index.ts

@@ -0,0 +1,38 @@
+/*
+ * Vencord, a Discord client mod
+ * Copyright (c) 2023 Vendicated and contributors
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ */
+
+import { Devs } from "@utils/constants.js";
+import definePlugin from "@utils/types";
+import { findByPropsLazy } from "@webpack";
+
+const linkRegex = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+
+const SlateTransforms = findByPropsLazy("insertText", "selectCommandOption");
+
+export default definePlugin({
+    name: "MaskedLinkPaste",
+    authors: [Devs.TheSun],
+    description: "Pasting a link while having text selected will paste a hyperlink",
+    patches: [
+        {
+            find: ".selection,preventEmojiSurrogates:",
+            replacement: {
+                match: /(?<=\i.delete.{0,50})(\i)\.insertText\((\i)\)/,
+                replace: "$self.handlePaste($1, $2, () => $&)"
+            }
+        }
+    ],
+
+    handlePaste(editor, content: string, originalBehavior: () => void) {
+        if (content && linkRegex.test(content) && editor.operations?.[0]?.type === "remove_text") {
+            SlateTransforms.insertText(
+                editor,
+                `[${editor.operations[0].text}](${content})`
+            );
+        }
+        else originalBehavior();
+    }
+});

src/plugins/memberCount/MemberCount.tsx

@@ -5,16 +5,15 @@
  */
 
 import { getCurrentChannel } from "@utils/discord";
-import { isObjectEmpty } from "@utils/misc";
 import { SelectedChannelStore, Tooltip, useEffect, useStateFromStores } from "@webpack/common";
 
-import { ChannelMemberStore, cl, GuildMemberCountStore, numberFormat, ThreadMemberListStore } from ".";
+import { ChannelMemberStore, cl, GuildMemberCountStore, numberFormat } from ".";
 import { OnlineMemberCountStore } from "./OnlineMemberCountStore";
 
 export function MemberCount({ isTooltip, tooltipGuildId }: { isTooltip?: true; tooltipGuildId?: string; }) {
     const currentChannel = useStateFromStores([SelectedChannelStore], () => getCurrentChannel());
 
-    const guildId = isTooltip ? tooltipGuildId! : currentChannel?.guild_id;
+    const guildId = isTooltip ? tooltipGuildId! : currentChannel.guild_id;
 
     const totalCount = useStateFromStores(
         [GuildMemberCountStore],
@@ -31,19 +30,10 @@ export function MemberCount({ isTooltip, tooltipGuildId }: { isTooltip?: true; t
         () => ChannelMemberStore.getProps(guildId, currentChannel?.id)
     );
 
-    const threadGroups = useStateFromStores(
-        [ThreadMemberListStore],
-        () => ThreadMemberListStore.getMemberListSections(currentChannel?.id)
-    );
-
     if (!isTooltip && (groups.length >= 1 || groups[0].id !== "unknown")) {
         onlineCount = groups.reduce((total, curr) => total + (curr.id === "offline" ? 0 : curr.count), 0);
     }
 
-    if (!isTooltip && threadGroups && !isObjectEmpty(threadGroups)) {
-        onlineCount = Object.values(threadGroups).reduce((total, curr) => total + (curr.sectionId === "offline" ? 0 : curr.userIds.length), 0);
-    }
-
     useEffect(() => {
         OnlineMemberCountStore.ensureCount(guildId);
     }, [guildId]);

src/plugins/memberCount/OnlineMemberCountStore.ts

@@ -15,8 +15,8 @@ export const OnlineMemberCountStore = proxyLazy(() => {
     const onlineMemberMap = new Map<string, number>();
 
     class OnlineMemberCountStore extends Flux.Store {
-        getCount(guildId?: string) {
-            return onlineMemberMap.get(guildId!);
+        getCount(guildId: string) {
+            return onlineMemberMap.get(guildId);
         }
 
         async _ensureCount(guildId: string) {
@@ -25,8 +25,8 @@ export const OnlineMemberCountStore = proxyLazy(() => {
             await PrivateChannelsStore.preload(guildId, GuildChannelStore.getDefaultChannel(guildId).id);
         }
 
-        ensureCount(guildId?: string) {
-            if (!guildId || onlineMemberMap.has(guildId)) return;
+        ensureCount(guildId: string) {
+            if (onlineMemberMap.has(guildId)) return;
 
             preloadQueue.push(() =>
                 this._ensureCount(guildId)

src/plugins/memberCount/index.tsx

@@ -28,14 +28,10 @@ import { FluxStore } from "@webpack/types";
 
 import { MemberCount } from "./MemberCount";
 
-export const GuildMemberCountStore = findStoreLazy("GuildMemberCountStore") as FluxStore & { getMemberCount(guildId?: string): number | null; };
+export const GuildMemberCountStore = findStoreLazy("GuildMemberCountStore") as FluxStore & { getMemberCount(guildId: string): number | null; };
 export const ChannelMemberStore = findStoreLazy("ChannelMemberStore") as FluxStore & {
-    getProps(guildId?: string, channelId?: string): { groups: { count: number; id: string; }[]; };
+    getProps(guildId: string, channelId: string): { groups: { count: number; id: string; }[]; };
 };
-export const ThreadMemberListStore = findStoreLazy("ThreadMemberListStore") as FluxStore & {
-    getMemberListSections(channelId?: string): { [sectionId: string]: { sectionId: string; userIds: string[]; }; };
-};
-
 
 const settings = definePluginSettings({
     toolTip: {

src/plugins/mentionAvatars/README.md

@@ -1,6 +1,5 @@
 # MentionAvatars
 
-Shows user avatars and role icons inside mentions
+Shows user avatars inside mentions
 
 ![](https://github.com/user-attachments/assets/fc76ea47-5e19-4063-a592-c57785a75cc7)
-![](https://github.com/user-attachments/assets/76c4c3d9-7cde-42db-ba84-903cbb40c163)

src/plugins/mentionAvatars/index.tsx

@@ -6,46 +6,16 @@
 
 import "./styles.css";
 
-import { definePluginSettings } from "@api/Settings";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
-import definePlugin, { OptionType } from "@utils/types";
-import { GuildStore, SelectedGuildStore, useState } from "@webpack/common";
+import definePlugin from "@utils/types";
+import { SelectedGuildStore, useState } from "@webpack/common";
 import { User } from "discord-types/general";
 
-const settings = definePluginSettings({
-    showAtSymbol: {
-        type: OptionType.BOOLEAN,
-        description: "Whether the the @ symbol should be displayed on user mentions",
-        default: true
-    }
-});
-
-function DefaultRoleIcon() {
-    return (
-        <svg
-            className="vc-mentionAvatars-icon vc-mentionAvatars-role-icon"
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
-            fill="currentColor"
-        >
-            <path
-                d="M14 8.00598C14 10.211 12.206 12.006 10 12.006C7.795 12.006 6 10.211 6 8.00598C6 5.80098 7.794 4.00598 10 4.00598C12.206 4.00598 14 5.80098 14 8.00598ZM2 19.006C2 15.473 5.29 13.006 10 13.006C14.711 13.006 18 15.473 18 19.006V20.006H2V19.006Z"
-            />
-            <path
-                d="M20.0001 20.006H22.0001V19.006C22.0001 16.4433 20.2697 14.4415 17.5213 13.5352C19.0621 14.9127 20.0001 16.8059 20.0001 19.006V20.006Z"
-            />
-            <path
-                d="M14.8834 11.9077C16.6657 11.5044 18.0001 9.9077 18.0001 8.00598C18.0001 5.96916 16.4693 4.28218 14.4971 4.0367C15.4322 5.09511 16.0001 6.48524 16.0001 8.00598C16.0001 9.44888 15.4889 10.7742 14.6378 11.8102C14.7203 11.8418 14.8022 11.8743 14.8834 11.9077Z"
-            />
-        </svg>
-    );
-}
-
 export default definePlugin({
     name: "MentionAvatars",
-    description: "Shows user avatars and role icons inside mentions",
-    authors: [Devs.Ven, Devs.SerStars],
+    description: "Shows user avatars inside mentions",
+    authors: [Devs.Ven],
 
     patches: [{
         find: ".USER_MENTION)",
@@ -53,57 +23,22 @@ export default definePlugin({
             match: /children:"@"\.concat\((null!=\i\?\i:\i)\)(?<=\.useName\((\i)\).+?)/,
             replace: "children:$self.renderUsername({username:$1,user:$2})"
         }
-    },
-    {
-        find: ".ROLE_MENTION)",
-        replacement: {
-            match: /children:\[\i&&.{0,50}\.RoleDot.{0,300},\i(?=\])/,
-            replace: "$&,$self.renderRoleIcon(arguments[0])"
-        }
     }],
 
-    settings,
-
     renderUsername: ErrorBoundary.wrap((props: { user: User, username: string; }) => {
         const { user, username } = props;
         const [isHovering, setIsHovering] = useState(false);
 
-        if (!user) return <>{getUsernameString(username)}</>;
+        if (!user) return <>@{username}</>;
 
         return (
             <span
                 onMouseEnter={() => setIsHovering(true)}
                 onMouseLeave={() => setIsHovering(false)}
             >
-                <img
-                    src={user.getAvatarURL(SelectedGuildStore.getGuildId(), 16, isHovering)}
-                    className="vc-mentionAvatars-icon"
-                    style={{ borderRadius: "50%" }}
-                />
-                {getUsernameString(username)}
+                <img src={user.getAvatarURL(SelectedGuildStore.getGuildId(), 16, isHovering)} className="vc-mentionAvatars-avatar" />
+                @{username}
             </span>
         );
-    }, { noop: true }),
-
-    renderRoleIcon: ErrorBoundary.wrap(({ roleId, guildId }: { roleId: string, guildId: string; }) => {
-        // Discord uses Role Mentions for uncached users because .... idk
-        if (!roleId) return null;
-
-        const role = GuildStore.getRole(guildId, roleId);
-
-        if (!role?.icon) return <DefaultRoleIcon />;
-
-        return (
-            <img
-                className="vc-mentionAvatars-icon vc-mentionAvatars-role-icon"
-                src={`${location.protocol}//${window.GLOBAL_ENV.CDN_HOST}/role-icons/${roleId}/${role.icon}.webp?size=24&quality=lossless`}
-            />
-        );
-    }),
+    }, { noop: true })
 });
-
-function getUsernameString(username: string) {
-    return settings.store.showAtSymbol
-        ? `@${username}`
-        : username;
-}

src/plugins/mentionAvatars/styles.css

@@ -1,16 +1,8 @@
-.vc-mentionAvatars-icon {
+.vc-mentionAvatars-avatar {
     vertical-align: middle;
     width: 1em !important; /* insane discord sets width: 100% in channel topic */
     height: 1em;
     margin: 0 4px 0.2rem 2px;
+    border-radius: 50%;
     box-sizing: border-box;
 }
-
-.vc-mentionAvatars-role-icon {
-    margin: 0 2px 0.2rem 4px;
-}
-
-/** don't display inside the ServerInfo modal owner mention */
-.vc-gp-owner .vc-mentionAvatars-icon {
-    display: none;
-}

src/plugins/messageLogger/index.tsx

@@ -151,7 +151,6 @@ export default definePlugin({
     contextMenus: {
         "message": patchMessageContextMenu,
         "channel-context": patchChannelContextMenu,
-        "thread-context": patchChannelContextMenu,
         "user-context": patchChannelContextMenu,
         "gdm-context": patchChannelContextMenu
     },

src/plugins/moreUserTags/index.tsx

@@ -22,7 +22,7 @@ import { Devs } from "@utils/constants";
 import { Margins } from "@utils/margins";
 import definePlugin, { OptionType } from "@utils/types";
 import { findByCodeLazy, findLazy } from "@webpack";
-import { Card, ChannelStore, Forms, GuildStore, PermissionsBits, Switch, TextInput, Tooltip } from "@webpack/common";
+import { Card, ChannelStore, Forms, GuildStore, PermissionsBits, Switch, TextInput, Tooltip, useState } from "@webpack/common";
 import type { Permissions, RC } from "@webpack/types";
 import type { Channel, Guild, Message, User } from "discord-types/general";
 
@@ -107,8 +107,14 @@ const defaultSettings = Object.fromEntries(
     tags.map(({ name, displayName }) => [name, { text: displayName, showInChat: true, showInNotChat: true }])
 ) as TagSettings;
 
-function SettingsComponent() {
-    const tagSettings = settings.store.tagSettings ??= defaultSettings;
+function SettingsComponent(props: { setValue(v: any): void; }) {
+    settings.store.tagSettings ??= defaultSettings;
+
+    const [tagSettings, setTagSettings] = useState(settings.store.tagSettings as TagSettings);
+    const setValue = (v: TagSettings) => {
+        setTagSettings(v);
+        props.setValue(v);
+    };
 
     return (
         <Flex flexDirection="column">
@@ -131,13 +137,19 @@ function SettingsComponent() {
                         type="text"
                         value={tagSettings[t.name]?.text ?? t.displayName}
                         placeholder={`Text on tag (default: ${t.displayName})`}
-                        onChange={v => tagSettings[t.name].text = v}
+                        onChange={v => {
+                            tagSettings[t.name].text = v;
+                            setValue(tagSettings);
+                        }}
                         className={Margins.bottom16}
                     />
 
                     <Switch
                         value={tagSettings[t.name]?.showInChat ?? true}
-                        onChange={v => tagSettings[t.name].showInChat = v}
+                        onChange={v => {
+                            tagSettings[t.name].showInChat = v;
+                            setValue(tagSettings);
+                        }}
                         hideBorder
                     >
                         Show in messages
@@ -145,7 +157,10 @@ function SettingsComponent() {
 
                     <Switch
                         value={tagSettings[t.name]?.showInNotChat ?? true}
-                        onChange={v => tagSettings[t.name].showInNotChat = v}
+                        onChange={v => {
+                            tagSettings[t.name].showInNotChat = v;
+                            setValue(tagSettings);
+                        }}
                         hideBorder
                     >
                         Show in member list and profiles
@@ -168,7 +183,7 @@ const settings = definePluginSettings({
     tagSettings: {
         type: OptionType.COMPONENT,
         component: SettingsComponent,
-        description: "fill me"
+        description: "fill me",
     }
 });
 
@@ -232,9 +247,9 @@ export default definePlugin({
             }
         },
         {
-            find: ".Messages.USER_PROFILE_PRONOUNS",
+            find: 'copyMetaData:"User Tag"',
             replacement: {
-                match: /(?=,hideBotTag:!0)/,
+                match: /(?=,botClass:)/,
                 replace: ",moreTags_channelId:arguments[0].moreTags_channelId"
             }
         },

src/plugins/mutualGroupDMs/index.tsx

@@ -20,15 +20,14 @@ import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import { isNonNullish } from "@utils/guards";
 import definePlugin from "@utils/types";
-import { findByPropsLazy, findComponentByCodeLazy } from "@webpack";
-import { Avatar, ChannelStore, Clickable, IconUtils, RelationshipStore, ScrollerThin, useMemo, UserStore } from "@webpack/common";
+import { findByPropsLazy } from "@webpack";
+import { Avatar, ChannelStore, Clickable, IconUtils, RelationshipStore, ScrollerThin, UserStore } from "@webpack/common";
 import { Channel, User } from "discord-types/general";
 
 const SelectedChannelActionCreators = findByPropsLazy("selectPrivateChannel");
 const UserUtils = findByPropsLazy("getGlobalName");
 
 const ProfileListClasses = findByPropsLazy("emptyIconFriends", "emptyIconGuilds");
-const ExpandableList = findComponentByCodeLazy(".mutualFriendItem]");
 const GuildLabelClasses = findByPropsLazy("guildNick", "guildAvatarWithoutIcon");
 
 function getGroupDMName(channel: Channel) {
@@ -40,19 +39,45 @@ function getGroupDMName(channel: Channel) {
             .join(", ");
 }
 
-const getMutualGroupDms = (userId: string) =>
-    ChannelStore.getSortedPrivateChannels()
-        .filter(c => c.isGroupDM() && c.recipients.includes(userId));
+export default definePlugin({
+    name: "MutualGroupDMs",
+    description: "Shows mutual group dms in profiles",
+    authors: [Devs.amia],
 
-const isBotOrSelf = (user: User) => user.bot || user.id === UserStore.getCurrentUser().id;
-
-function getMutualGDMCountText(user: User) {
-    const count = getMutualGroupDms(user.id).length;
-    return `${count === 0 ? "No" : count} Mutual Group${count !== 1 ? "s" : ""}`;
+    patches: [
+        {
+            find: ".Messages.MUTUAL_GUILDS_WITH_END_COUNT", // Note: the module is lazy-loaded
+            replacement: {
+                match: /(?<=\.tabBarItem.{0,50}MUTUAL_GUILDS.+?}\),)(?=.+?(\(0,\i\.jsxs?\)\(.{0,100}id:))/,
+                replace: '$self.isBotOrSelf(arguments[0].user)?null:$1"MUTUAL_GDMS",children:"Mutual Groups"}),'
             }
+        },
+        {
+            find: ".USER_INFO_CONNECTIONS:case",
+            replacement: {
+                match: /(?<={user:(\i),onClose:(\i)}\);)(?=case \i\.\i\.MUTUAL_FRIENDS)/,
+                replace: "case \"MUTUAL_GDMS\":return $self.renderMutualGDMs({user: $1, onClose: $2});"
+            }
+        },
+        {
+            find: ".MUTUAL_FRIENDS?(",
+            replacement: [
+                {
+                    match: /(?<=onItemSelect:\i,children:)(\i)\.map/,
+                    replace: "[...$1, ...($self.isBotOrSelf(arguments[0].user) ? [] : [{section:'MUTUAL_GDMS',text:'Mutual Groups'}])].map"
+                },
+                {
+                    match: /\(0,\i\.jsx\)\(\i,\{items:\i,section:(\i)/,
+                    replace: "$1==='MUTUAL_GDMS'?$self.renderMutualGDMs(arguments[0]):$&"
+                }
+            ]
+        }
+    ],
 
-function renderClickableGDMs(mutualDms: Channel[], onClose: () => void) {
-    return mutualDms.map(c => (
+    isBotOrSelf: (user: User) => user.bot || user.id === UserStore.getCurrentUser().id,
+
+    renderMutualGDMs: ErrorBoundary.wrap(({ user, onClose }: { user: User, onClose: () => void; }) => {
+        const entries = ChannelStore.getSortedPrivateChannels().filter(c => c.isGroupDM() && c.recipients.includes(user.id)).map(c => (
             <Clickable
                 className={ProfileListClasses.listRow}
                 onClick={() => {
@@ -72,52 +97,6 @@ function renderClickableGDMs(mutualDms: Channel[], onClose: () => void) {
                 </div>
             </Clickable>
         ));
-}
-
-const IS_PATCHED = Symbol("MutualGroupDMs.Patched");
-
-export default definePlugin({
-    name: "MutualGroupDMs",
-    description: "Shows mutual group dms in profiles",
-    authors: [Devs.amia],
-
-    patches: [
-        {
-            find: ".MUTUAL_FRIENDS?(",
-            replacement: [
-                {
-                    match: /\i\.useEffect.{0,100}(\i)\[0\]\.section/,
-                    replace: "$self.pushSection($1, arguments[0].user);$&"
-                },
-                {
-                    match: /\(0,\i\.jsx\)\(\i,\{items:\i,section:(\i)/,
-                    replace: "$1==='MUTUAL_GDMS'?$self.renderMutualGDMs(arguments[0]):$&"
-                }
-            ]
-        },
-        {
-            find: 'section:"MUTUAL_FRIENDS"',
-            replacement: {
-                match: /\.openUserProfileModal.+?\)}\)}\)(?<=(\(0,\i\.jsxs?\)\(\i\.\i,{className:(\i)\.divider}\)).+?)/,
-                replace: "$&,$self.renderDMPageList({user: arguments[0].user, Divider: $1, listStyle: $2.list})"
-            }
-        }
-    ],
-
-    pushSection(sections: any[], user: User) {
-        if (isBotOrSelf(user) || sections[IS_PATCHED]) return;
-
-        sections[IS_PATCHED] = true;
-        sections.push({
-            section: "MUTUAL_GDMS",
-            text: getMutualGDMCountText(user)
-        });
-    },
-
-    renderMutualGDMs: ErrorBoundary.wrap(({ user, onClose }: { user: User, onClose: () => void; }) => {
-        const mutualGDms = useMemo(() => getMutualGroupDms(user.id), [user.id]);
-
-        const entries = renderClickableGDMs(mutualGDms, onClose);
 
         return (
             <ScrollerThin
@@ -136,24 +115,5 @@ export default definePlugin({
                 }
             </ScrollerThin>
         );
-    }),
-
-    renderDMPageList: ErrorBoundary.wrap(({ user, Divider, listStyle }: { user: User, Divider: JSX.Element, listStyle: string; }) => {
-        const mutualGDms = getMutualGroupDms(user.id);
-        if (mutualGDms.length === 0) return null;
-
-        const header = getMutualGDMCountText(user);
-
-        return (
-            <>
-                {Divider}
-                <ExpandableList
-                    className={listStyle}
-                    header={header}
-                    isLoadingHeader={false}
-                    children={renderClickableGDMs(mutualGDms, () => { })}
-                />
-            </>
-        );
     })
 });

src/plugins/noMaskedUrlPaste/README.md

@@ -1,3 +0,0 @@
-# NoMaskedUrlPaste
-
-Pasting a link while you have text selected will NOT paste your link as a masked link.

src/plugins/noMaskedUrlPaste/index.ts

@@ -1,23 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2023 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import { Devs } from "@utils/constants.js";
-import definePlugin from "@utils/types";
-
-export default definePlugin({
-    name: "NoMaskedUrlPaste",
-    authors: [Devs.CatNoir],
-    description: "Pasting a link while having text selected will not paste as masked URL",
-    patches: [
-        {
-            find: ".selection,preventEmojiSurrogates:",
-            replacement: {
-                match: /if\(null!=\i.selection&&\i.\i.isExpanded\(\i.selection\)\)/,
-                replace: "if(false)"
-            }
-        }
-    ],
-});

src/plugins/noPendingCount/index.ts

@@ -62,7 +62,16 @@ export default definePlugin({
                 replace: "return 0;"
             }
         },
-        // Message requests hook
+        // New message requests hook
+        {
+            find: 'location:"use-message-requests-count"',
+            predicate: () => settings.store.hideMessageRequestsCount,
+            replacement: {
+                match: /getNonChannelAckId\(\i\.\i\.MESSAGE_REQUESTS\).+?return /,
+                replace: "$&0;"
+            }
+        },
+        // Old message requests hook
         {
             find: "getMessageRequestsCount(){",
             predicate: () => settings.store.hideMessageRequestsCount,

src/plugins/noProfileThemes/index.ts

@@ -18,21 +18,36 @@
 
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
-import { UserStore } from "@webpack/common";
 
 export default definePlugin({
     name: "NoProfileThemes",
-    description: "Completely removes Nitro profile themes from everyone but yourself",
+    description: "Completely removes Nitro profile themes",
     authors: [Devs.TheKodeToad],
     patches: [
+        {
+            find: ".NITRO_BANNER,",
+            replacement: {
+                // = isPremiumAtLeast(user.premiumType, TIER_2)
+                match: /=(?=\i\.\i\.isPremiumAtLeast\(null==(\i))/,
+                // = user.banner && isPremiumAtLeast(user.premiumType, TIER_2)
+                replace: "=(arguments[0]?.bannerSrc||$1?.banner)&&"
+            }
+        },
+        {
+            find: ".avatarPositionPremiumNoBanner,default:",
+            replacement: {
+                // premiumUserWithoutBanner: foo().avatarPositionPremiumNoBanner, default: foo().avatarPositionNormal
+                match: /\.avatarPositionPremiumNoBanner(?=,default:\i\.(\i))/,
+                // premiumUserWithoutBanner: foo().avatarPositionNormal...
+                replace: ".$1"
+            }
+        },
         {
             find: "hasThemeColors(){",
             replacement: {
                 match: /get canUsePremiumProfileCustomization\(\){return /,
-                replace: "$&$self.isCurrentUser(this.userId)&&"
+                replace: "$&false &&"
             }
-        },
-    ],
-
-    isCurrentUser: (userId: string) => userId === UserStore.getCurrentUser()?.id,
+        }
+    ]
 });

src/plugins/noServerEmojis/index.ts

@@ -36,7 +36,7 @@ export default definePlugin({
         }
     ],
     shouldSkip(guildId: string, emoji: any) {
-        if (emoji.type !== 1) {
+        if (emoji.type !== "GUILD_EMOJI") {
             return false;
         }
         if (settings.store.shownEmojis === "onlyUnicode") {

src/plugins/openInApp/README.md

@@ -1,11 +0,0 @@
-# OpenInApp
-
-Open links in their respective apps instead of your browser
-
-## Currently supports:
-
-- Spotify
-- Steam
-- EpicGames
-- Tidal
-- Apple Music (iTunes)

src/plugins/openInApp/index.ts

@@ -18,70 +18,46 @@
 
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
-import definePlugin, { OptionType, PluginNative, SettingsDefinition } from "@utils/types";
+import definePlugin, { OptionType, PluginNative } from "@utils/types";
 import { showToast, Toasts } from "@webpack/common";
 import type { MouseEvent } from "react";
 
-interface URLReplacementRule {
-    match: RegExp;
-    replace: (...matches: string[]) => string;
-    description: string;
-    shortlinkMatch?: RegExp;
-    accountViewReplace?: (userId: string) => string;
-}
+const ShortUrlMatcher = /^https:\/\/(spotify\.link|s\.team)\/.+$/;
+const SpotifyMatcher = /^https:\/\/open\.spotify\.com\/(track|album|artist|playlist|user|episode)\/(.+)(?:\?.+?)?$/;
+const SteamMatcher = /^https:\/\/(steamcommunity\.com|(?:help|store)\.steampowered\.com)\/.+$/;
+const EpicMatcher = /^https:\/\/store\.epicgames\.com\/(.+)$/;
+const TidalMatcher = /^https:\/\/tidal\.com\/browse\/(track|album|artist|playlist|user|video|mix)\/(.+)(?:\?.+?)?$/;
 
-// Do not forget to add protocols to the ALLOWED_PROTOCOLS constant
-const UrlReplacementRules: Record<string, URLReplacementRule> = {
+const settings = definePluginSettings({
     spotify: {
-        match: /^https:\/\/open\.spotify\.com\/(?:intl-[a-z]{2}\/)?(track|album|artist|playlist|user|episode)\/(.+)(?:\?.+?)?$/,
-        replace: (_, type, id) => `spotify://${type}/${id}`,
+        type: OptionType.BOOLEAN,
         description: "Open Spotify links in the Spotify app",
-        shortlinkMatch: /^https:\/\/spotify\.link\/.+$/,
-        accountViewReplace: userId => `spotify:user:${userId}`,
+        default: true,
     },
     steam: {
-        match: /^https:\/\/(steamcommunity\.com|(?:help|store)\.steampowered\.com)\/.+$/,
-        replace: match => `steam://openurl/${match}`,
+        type: OptionType.BOOLEAN,
         description: "Open Steam links in the Steam app",
-        shortlinkMatch: /^https:\/\/s.team\/.+$/,
-        accountViewReplace: userId => `steam://openurl/https://steamcommunity.com/profiles/${userId}`,
+        default: true,
     },
     epic: {
-        match: /^https:\/\/store\.epicgames\.com\/(.+)$/,
-        replace: (_, id) => `com.epicgames.launcher://store/${id}`,
+        type: OptionType.BOOLEAN,
         description: "Open Epic Games links in the Epic Games Launcher",
+        default: true,
     },
     tidal: {
-        match: /^https:\/\/tidal\.com\/browse\/(track|album|artist|playlist|user|video|mix)\/(.+)(?:\?.+?)?$/,
-        replace: (_, type, id) => `tidal://${type}/${id}`,
-        description: "Open Tidal links in the Tidal app",
-    },
-    itunes: {
-        match: /^https:\/\/music\.apple\.com\/([a-z]{2}\/)?(album|artist|playlist|song|curator)\/([^/?#]+)\/?([^/?#]+)?(?:\?.*)?(?:#.*)?$/,
-        replace: (_, lang, type, name, id) => id ? `itunes://music.apple.com/us/${type}/${name}/${id}` : `itunes://music.apple.com/us/${type}/${name}`,
-        description: "Open Apple Music links in the iTunes app"
-    },
-};
-
-const pluginSettings = definePluginSettings(
-    Object.entries(UrlReplacementRules).reduce((acc, [key, rule]) => {
-        acc[key] = {
         type: OptionType.BOOLEAN,
-            description: rule.description,
+        description: "Open Tidal links in the Tidal app",
         default: true,
-        };
-        return acc;
-    }, {} as SettingsDefinition)
-);
-
+    }
+});
 
 const Native = VencordNative.pluginHelpers.OpenInApp as PluginNative<typeof import("./native")>;
 
 export default definePlugin({
     name: "OpenInApp",
-    description: "Open links in their respective apps instead of your browser",
-    authors: [Devs.Ven, Devs.surgedevs],
-    settings: pluginSettings,
+    description: "Open Spotify, Tidal, Steam and Epic Games URLs in their respective apps instead of your browser",
+    authors: [Devs.Ven],
+    settings,
 
     patches: [
         {
@@ -94,7 +70,7 @@ export default definePlugin({
         // Make Spotify profile activity links open in app on web
         {
             find: "WEB_OPEN(",
-            predicate: () => !IS_DISCORD_DESKTOP && pluginSettings.store.spotify,
+            predicate: () => !IS_DISCORD_DESKTOP && settings.store.spotify,
             replacement: {
                 match: /\i\.\i\.isProtocolRegistered\(\)(.{0,100})window.open/g,
                 replace: "true$1VencordNative.native.openExternal"
@@ -103,8 +79,8 @@ export default definePlugin({
         {
             find: ".CONNECTED_ACCOUNT_VIEWED,",
             replacement: {
-                match: /(?<=href:\i,onClick:(\i)=>\{)(?=.{0,10}\i=(\i)\.type,.{0,100}CONNECTED_ACCOUNT_VIEWED)/,
-                replace: "if($self.handleAccountView($1,$2.type,$2.id)) return;"
+                match: /(?<=href:\i,onClick:\i=>\{)(?=.{0,10}\i=(\i)\.type,.{0,100}CONNECTED_ACCOUNT_VIEWED)/,
+                replace: "$self.handleAccountView(arguments[0],$1.type,$1.id);"
             }
         }
     ],
@@ -113,25 +89,61 @@ export default definePlugin({
         if (!data) return false;
 
         let url = data.href;
-        if (!url) return false;
-
-        for (const [key, rule] of Object.entries(UrlReplacementRules)) {
-            if (!pluginSettings.store[key]) continue;
-
-            if (rule.shortlinkMatch?.test(url)) {
+        if (!IS_WEB && ShortUrlMatcher.test(url)) {
             event?.preventDefault();
+            // CORS jumpscare
             url = await Native.resolveRedirect(url);
         }
 
-            if (rule.match.test(url)) {
-                showToast("Opened link in native app", Toasts.Type.SUCCESS);
+        spotify: {
+            if (!settings.store.spotify) break spotify;
 
-                const newUrl = url.replace(rule.match, rule.replace);
-                VencordNative.native.openExternal(newUrl);
+            const match = SpotifyMatcher.exec(url);
+            if (!match) break spotify;
+
+            const [, type, id] = match;
+            VencordNative.native.openExternal(`spotify:${type}:${id}`);
 
             event?.preventDefault();
             return true;
         }
+
+        steam: {
+            if (!settings.store.steam) break steam;
+
+            if (!SteamMatcher.test(url)) break steam;
+
+            VencordNative.native.openExternal(`steam://openurl/${url}`);
+            event?.preventDefault();
+
+            // Steam does not focus itself so show a toast so it's slightly less confusing
+            showToast("Opened link in Steam", Toasts.Type.SUCCESS);
+            return true;
+        }
+
+        epic: {
+            if (!settings.store.epic) break epic;
+
+            const match = EpicMatcher.exec(url);
+            if (!match) break epic;
+
+            VencordNative.native.openExternal(`com.epicgames.launcher://store/${match[1]}`);
+            event?.preventDefault();
+
+            return true;
+        }
+
+        tidal: {
+            if (!settings.store.tidal) break tidal;
+
+            const match = TidalMatcher.exec(url);
+            if (!match) break tidal;
+
+            const [, type, id] = match;
+            VencordNative.native.openExternal(`tidal://${type}/${id}`);
+
+            event?.preventDefault();
+            return true;
         }
 
         // in case short url didn't end up being something we can handle
@@ -143,12 +155,14 @@ export default definePlugin({
         return false;
     },
 
-    handleAccountView(e: MouseEvent, platformType: string, userId: string) {
-        const rule = UrlReplacementRules[platformType];
-        if (rule?.accountViewReplace && pluginSettings.store[platformType]) {
-            VencordNative.native.openExternal(rule.accountViewReplace(userId));
-            e.preventDefault();
-            return true;
+    handleAccountView(event: { preventDefault(): void; }, platformType: string, userId: string) {
+        if (platformType === "spotify" && settings.store.spotify) {
+            VencordNative.native.openExternal(`spotify:user:${userId}`);
+            event.preventDefault();
+        } else if (platformType === "steam" && settings.store.steam) {
+            VencordNative.native.openExternal(`steam://openurl/https://steamcommunity.com/profiles/${userId}`);
+            showToast("Opened link in Steam", Toasts.Type.SUCCESS);
+            event.preventDefault();
         }
     }
 });

src/plugins/pauseInvitesForever/index.tsx

@@ -19,11 +19,16 @@
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
+import { findLazy } from "@webpack";
 import { Constants, GuildStore, i18n, RestAPI } from "@webpack/common";
 
+const InvitesDisabledExperiment = findLazy(m => m.definition?.id === "2022-07_invites_disabled");
+
 function showDisableInvites(guildId: string) {
+    // Once the experiment is removed, this should keep working
+    const { enableInvitesDisabled } = InvitesDisabledExperiment?.getCurrentConfig?.({ guildId }) ?? { enableInvitesDisabled: true };
     // @ts-ignore
-    return !GuildStore.getGuild(guildId).hasFeature("INVITES_DISABLED");
+    return enableInvitesDisabled && !GuildStore.getGuild(guildId).hasFeature("INVITES_DISABLED");
 }
 
 function disableInvites(guildId: string) {

src/plugins/permissionsViewer/components/RolesAndUsersPermissions.tsx

@@ -21,10 +21,8 @@ import { Flex } from "@components/Flex";
 import { InfoIcon, OwnerCrownIcon } from "@components/Icons";
 import { getUniqueUsername } from "@utils/discord";
 import { ModalCloseButton, ModalContent, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
-import { findByCodeLazy } from "@webpack";
-import { Clipboard, ContextMenuApi, FluxDispatcher, GuildMemberStore, GuildStore, i18n, Menu, PermissionsBits, ScrollerThin, Text, Tooltip, useEffect, UserStore, useState, useStateFromStores } from "@webpack/common";
-import { UnicodeEmoji } from "@webpack/types";
-import type { Guild, Role, User } from "discord-types/general";
+import { Clipboard, ContextMenuApi, FluxDispatcher, GuildMemberStore, GuildStore, i18n, Menu, PermissionsBits, Text, Tooltip, useEffect, UserStore, useState, useStateFromStores } from "@webpack/common";
+import type { Guild } from "discord-types/general";
 
 import { settings } from "..";
 import { cl, getPermissionDescription, getPermissionString } from "../utils";
@@ -44,15 +42,15 @@ export interface RoleOrUserPermission {
     overwriteDeny?: bigint;
 }
 
-type GetRoleIconData = (role: Role, size: number) => { customIconSrc?: string; unicodeEmoji?: UnicodeEmoji; };
-const getRoleIconData: GetRoleIconData = findByCodeLazy("convertSurrogateToName", "customIconSrc", "unicodeEmoji");
-
-function getRoleIconSrc(role: Role) {
-    const icon = getRoleIconData(role, 20);
-    if (!icon) return;
-
-    const { customIconSrc, unicodeEmoji } = icon;
-    return customIconSrc ?? unicodeEmoji?.url;
+function openRolesAndUsersPermissionsModal(permissions: Array<RoleOrUserPermission>, guild: Guild, header: string) {
+    return openModal(modalProps => (
+        <RolesAndUsersPermissions
+            modalProps={modalProps}
+            permissions={permissions}
+            guild={guild}
+            header={header}
+        />
+    ));
 }
 
 function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, header }: { permissions: Array<RoleOrUserPermission>; guild: Guild; modalProps: ModalProps; header: string; }) {
@@ -88,34 +86,31 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
             size={ModalSize.LARGE}
         >
             <ModalHeader>
-                <Text className={cl("modal-title")} variant="heading-lg/semibold">{header} permissions:</Text>
+                <Text className={cl("perms-title")} variant="heading-lg/semibold">{header} permissions:</Text>
                 <ModalCloseButton onClick={modalProps.onClose} />
             </ModalHeader>
 
-            <ModalContent className={cl("modal-content")}>
+            <ModalContent>
                 {!selectedItem && (
-                    <div className={cl("modal-no-perms")}>
+                    <div className={cl("perms-no-perms")}>
                         <Text variant="heading-lg/normal">No permissions to display!</Text>
                     </div>
                 )}
 
                 {selectedItem && (
-                    <div className={cl("modal-container")}>
-                        <ScrollerThin className={cl("modal-list")} orientation="auto">
+                    <div className={cl("perms-container")}>
+                        <div className={cl("perms-list")}>
                             {permissions.map((permission, index) => {
-                                const user: User | undefined = UserStore.getUser(permission.id ?? "");
-                                const role: Role | undefined = roles[permission.id ?? ""];
-                                const roleIconSrc = role != null ? getRoleIconSrc(role) : undefined;
+                                const user = UserStore.getUser(permission.id ?? "");
+                                const role = roles[permission.id ?? ""];
 
                                 return (
-                                    <div
-                                        className={cl("modal-list-item-btn")}
+                                    <button
+                                        className={cl("perms-list-item-btn")}
                                         onClick={() => selectItem(index)}
-                                        role="button"
-                                        tabIndex={0}
                                     >
                                         <div
-                                            className={cl("modal-list-item", { "modal-list-item-active": selectedItemIndex === index })}
+                                            className={cl("perms-list-item", { "perms-list-item-active": selectedItemIndex === index })}
                                             onContextMenu={e => {
                                                 if (permission.type === PermissionType.Role)
                                                     ContextMenuApi.openContextMenu(e, () => (
@@ -129,6 +124,7 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
                                                     ContextMenuApi.openContextMenu(e, () => (
                                                         <UserContextMenu
                                                             userId={permission.id!}
+                                                            onClose={modalProps.onClose}
                                                         />
                                                     ));
                                                 }
@@ -136,19 +132,13 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
                                         >
                                             {(permission.type === PermissionType.Role || permission.type === PermissionType.Owner) && (
                                                 <span
-                                                    className={cl("modal-role-circle")}
+                                                    className={cl("perms-role-circle")}
                                                     style={{ backgroundColor: role?.colorString ?? "var(--primary-300)" }}
                                                 />
                                             )}
-                                            {permission.type === PermissionType.Role && roleIconSrc != null && (
+                                            {permission.type === PermissionType.User && user !== undefined && (
                                                 <img
-                                                    className={cl("modal-role-image")}
-                                                    src={roleIconSrc}
-                                                />
-                                            )}
-                                            {permission.type === PermissionType.User && user != null && (
-                                                <img
-                                                    className={cl("modal-user-img")}
+                                                    className={cl("perms-user-img")}
                                                     src={user.getAvatarURL(void 0, void 0, false)}
                                                 />
                                             )}
@@ -157,25 +147,28 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
                                                     permission.type === PermissionType.Role
                                                         ? role?.name ?? "Unknown Role"
                                                         : permission.type === PermissionType.User
-                                                            ? (user != null && getUniqueUsername(user)) ?? "Unknown User"
+                                                            ? (user && getUniqueUsername(user)) ?? "Unknown User"
                                                             : (
                                                                 <Flex style={{ gap: "0.2em", justifyItems: "center" }}>
                                                                     @owner
-                                                                    <OwnerCrownIcon height={18} width={18} aria-hidden="true" />
+                                                                    <OwnerCrownIcon
+                                                                        height={18}
+                                                                        width={18}
+                                                                        aria-hidden="true"
+                                                                    />
                                                                 </Flex>
                                                             )
                                                 }
                                             </Text>
                                         </div>
-                                    </div>
+                                    </button>
                                 );
                             })}
-                        </ScrollerThin>
-                        <div className={cl("modal-divider")} />
-                        <ScrollerThin className={cl("modal-perms")} orientation="auto">
+                        </div>
+                        <div className={cl("perms-perms")}>
                             {Object.entries(PermissionsBits).map(([permissionName, bit]) => (
-                                <div className={cl("modal-perms-item")}>
-                                    <div className={cl("modal-perms-item-icon")}>
+                                <div className={cl("perms-perms-item")}>
+                                    <div className={cl("perms-perms-item-icon")}>
                                         {(() => {
                                             const { permissions, overwriteAllow, overwriteDeny } = selectedItem;
 
@@ -199,7 +192,7 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
                                     </Tooltip>
                                 </div>
                             ))}
-                        </ScrollerThin>
+                        </div>
                     </div>
                 )}
             </ModalContent>
@@ -215,7 +208,7 @@ function RoleContextMenu({ guild, roleId, onClose }: { guild: Guild; roleId: str
             aria-label="Role Options"
         >
             <Menu.MenuItem
-                id={cl("copy-role-id")}
+                id="vc-copy-role-id"
                 label={i18n.Messages.COPY_ID_ROLE}
                 action={() => {
                     Clipboard.copy(roleId);
@@ -224,13 +217,14 @@ function RoleContextMenu({ guild, roleId, onClose }: { guild: Guild; roleId: str
 
             {(settings.store as any).unsafeViewAsRole && (
                 <Menu.MenuItem
-                    id={cl("view-as-role")}
+                    id="vc-pw-view-as-role"
                     label={i18n.Messages.VIEW_AS_ROLE}
                     action={() => {
                         const role = GuildStore.getRole(guild.id, roleId);
                         if (!role) return;
 
                         onClose();
+
                         FluxDispatcher.dispatch({
                             type: "IMPERSONATE_UPDATE",
                             guildId: guild.id,
@@ -241,14 +235,15 @@ function RoleContextMenu({ guild, roleId, onClose }: { guild: Guild; roleId: str
                                 }
                             }
                         });
-                    }}
+                    }
+                    }
                 />
             )}
         </Menu.Menu>
     );
 }
 
-function UserContextMenu({ userId }: { userId: string; }) {
+function UserContextMenu({ userId, onClose }: { userId: string; onClose: () => void; }) {
     return (
         <Menu.Menu
             navId={cl("user-context-menu")}
@@ -256,7 +251,7 @@ function UserContextMenu({ userId }: { userId: string; }) {
             aria-label="User Options"
         >
             <Menu.MenuItem
-                id={cl("copy-user-id")}
+                id="vc-copy-user-id"
                 label={i18n.Messages.COPY_ID_USER}
                 action={() => {
                     Clipboard.copy(userId);
@@ -268,13 +263,4 @@ function UserContextMenu({ userId }: { userId: string; }) {
 
 const RolesAndUsersPermissions = ErrorBoundary.wrap(RolesAndUsersPermissionsComponent);
 
-export default function openRolesAndUsersPermissionsModal(permissions: Array<RoleOrUserPermission>, guild: Guild, header: string) {
-    return openModal(modalProps => (
-        <RolesAndUsersPermissions
-            modalProps={modalProps}
-            permissions={permissions}
-            guild={guild}
-            header={header}
-        />
-    ));
-}
+export default openRolesAndUsersPermissionsModal;

src/plugins/permissionsViewer/components/UserPermissions.tsx

@@ -29,65 +29,22 @@ import openRolesAndUsersPermissionsModal, { PermissionType, type RoleOrUserPermi
 
 interface UserPermission {
     permission: string;
-    roleName: string;
     roleColor: string;
     rolePosition: number;
 }
 
 type UserPermissions = Array<UserPermission>;
 
-const { RoleRootClasses, RoleClasses, RoleBorderClasses } = proxyLazyWebpack(() => {
-    const [RoleRootClasses, RoleClasses, RoleBorderClasses] = findBulk(
-        filters.byProps("root", "expandButton", "collapseButton"),
-        filters.byProps("role", "roleCircle", "roleName"),
-        filters.byProps("roleCircle", "dot", "dotBorderColor")
-    ) as Record<string, string>[];
+const Classes = proxyLazyWebpack(() =>
+    Object.assign({}, ...findBulk(
+        filters.byProps("roles", "rolePill", "rolePillBorder"),
+        filters.byProps("roleCircle", "dotBorderBase", "dotBorderColor"),
+        filters.byProps("roleNameOverflow", "root", "roleName", "roleRemoveButton")
+    ))
+) as Record<"roles" | "rolePill" | "rolePillBorder" | "desaturateUserColors" | "flex" | "alignCenter" | "justifyCenter" | "svg" | "background" | "dot" | "dotBorderColor" | "roleCircle" | "dotBorderBase" | "flex" | "alignCenter" | "justifyCenter" | "wrap" | "root" | "role" | "roleRemoveButton" | "roleDot" | "roleFlowerStar" | "roleRemoveIcon" | "roleRemoveIconFocused" | "roleVerifiedIcon" | "roleName" | "roleNameOverflow" | "actionButton" | "overflowButton" | "addButton" | "addButtonIcon" | "overflowRolesPopout" | "overflowRolesPopoutArrowWrapper" | "overflowRolesPopoutArrow" | "popoutBottom" | "popoutTop" | "overflowRolesPopoutHeader" | "overflowRolesPopoutHeaderIcon" | "overflowRolesPopoutHeaderText" | "roleIcon", string>;
 
-    return { RoleRootClasses, RoleClasses, RoleBorderClasses };
-});
-
-interface FakeRoleProps extends React.HTMLAttributes<HTMLDivElement> {
-    text: string;
-    color: string;
-}
-
-function FakeRole({ text, color, ...props }: FakeRoleProps) {
-    return (
-        <div {...props} className={classes(RoleClasses.role)}>
-            <div className={RoleClasses.roleRemoveButton}>
-                <span
-                    className={classes(RoleBorderClasses.roleCircle, RoleClasses.roleCircle)}
-                    style={{ backgroundColor: color }}
-                />
-            </div>
-            <div className={RoleClasses.roleName}>
-                <Text
-                    className={RoleClasses.roleNameOverflow}
-                    variant="text-xs/medium"
-                >
-                    {text}
-                </Text>
-            </div>
-        </div>
-    );
-}
-
-interface GrantedByTooltipProps {
-    roleName: string;
-    roleColor: string;
-}
-
-function GrantedByTooltip({ roleName, roleColor }: GrantedByTooltipProps) {
-    return (
-        <>
-            <Text variant="text-sm/medium">Granted By</Text>
-            <FakeRole text={roleName} color={roleColor} />
-        </>
-    );
-}
-
-function UserPermissionsComponent({ guild, guildMember, forceOpen = false }: { guild: Guild; guildMember: GuildMember; forceOpen?: boolean; }) {
-    const { permissionsSortOrder } = settings.use(["permissionsSortOrder"]);
+function UserPermissionsComponent({ guild, guildMember, showBorder, forceOpen = false }: { guild: Guild; guildMember: GuildMember; showBorder: boolean; forceOpen?: boolean; }) {
+    const stns = settings.use(["permissionsSortOrder"]);
 
     const [rolePermissions, userPermissions] = useMemo(() => {
         const userPermissions: UserPermissions = [];
@@ -108,7 +65,6 @@ function UserPermissionsComponent({ guild, guildMember, forceOpen = false }: { g
             const OWNER = i18n.Messages.GUILD_OWNER || "Server Owner";
             userPermissions.push({
                 permission: OWNER,
-                roleName: "Owner",
                 roleColor: "var(--primary-300)",
                 rolePosition: Infinity
             });
@@ -117,11 +73,10 @@ function UserPermissionsComponent({ guild, guildMember, forceOpen = false }: { g
         sortUserRoles(userRoles);
 
         for (const [permission, bit] of Object.entries(PermissionsBits)) {
-            for (const { permissions, colorString, position, name } of userRoles) {
+            for (const { permissions, colorString, position } of userRoles) {
                 if ((permissions & bit) === bit) {
                     userPermissions.push({
                         permission: getPermissionString(permission),
-                        roleName: name,
                         roleColor: colorString || "var(--primary-300)",
                         rolePosition: position
                     });
@@ -134,7 +89,9 @@ function UserPermissionsComponent({ guild, guildMember, forceOpen = false }: { g
         userPermissions.sort((a, b) => b.rolePosition - a.rolePosition);
 
         return [rolePermissions, userPermissions];
-    }, [permissionsSortOrder]);
+    }, [stns.permissionsSortOrder]);
+
+    const { root, role, roleRemoveButton, roleNameOverflow, roles, rolePill, rolePillBorder, roleCircle, roleName } = Classes;
 
     return (
         <ExpandableHeader
@@ -151,41 +108,46 @@ function UserPermissionsComponent({ guild, guildMember, forceOpen = false }: { g
             onDropDownClick={state => settings.store.defaultPermissionsDropdownState = !state}
             defaultState={settings.store.defaultPermissionsDropdownState}
             buttons={[
-                <Tooltip text={`Sorting by ${permissionsSortOrder === PermissionsSortOrder.HighestRole ? "Highest Role" : "Lowest Role"}`}>
+                (<Tooltip text={`Sorting by ${stns.permissionsSortOrder === PermissionsSortOrder.HighestRole ? "Highest Role" : "Lowest Role"}`}>
                     {tooltipProps => (
-                        <div
+                        <button
                             {...tooltipProps}
-                            className={cl("user-sortorder-btn")}
-                            role="button"
-                            tabIndex={0}
+                            className={cl("userperms-sortorder-btn")}
                             onClick={() => {
-                                settings.store.permissionsSortOrder = permissionsSortOrder === PermissionsSortOrder.HighestRole ? PermissionsSortOrder.LowestRole : PermissionsSortOrder.HighestRole;
+                                stns.permissionsSortOrder = stns.permissionsSortOrder === PermissionsSortOrder.HighestRole ? PermissionsSortOrder.LowestRole : PermissionsSortOrder.HighestRole;
                             }}
                         >
                             <svg
                                 width="20"
                                 height="20"
                                 viewBox="0 96 960 960"
-                                transform={permissionsSortOrder === PermissionsSortOrder.HighestRole ? "scale(1 1)" : "scale(1 -1)"}
+                                transform={stns.permissionsSortOrder === PermissionsSortOrder.HighestRole ? "scale(1 1)" : "scale(1 -1)"}
                             >
                                 <path fill="var(--text-normal)" d="M440 896V409L216 633l-56-57 320-320 320 320-56 57-224-224v487h-80Z" />
                             </svg>
-                        </div>
+                        </button>
                     )}
-                </Tooltip>
+                </Tooltip>)
             ]}>
             {userPermissions.length > 0 && (
-                <div className={classes(RoleRootClasses.root)}>
-                    {userPermissions.map(({ permission, roleColor, roleName }) => (
-                        <Tooltip
-                            text={<GrantedByTooltip roleName={roleName} roleColor={roleColor} />}
-                            tooltipClassName={cl("granted-by-container")}
-                            tooltipContentClassName={cl("granted-by-content")}
+                <div className={classes(root, roles)}>
+                    {userPermissions.map(({ permission, roleColor }) => (
+                        <div className={classes(role, rolePill, showBorder ? rolePillBorder : null)}>
+                            <div className={roleRemoveButton}>
+                                <span
+                                    className={roleCircle}
+                                    style={{ backgroundColor: roleColor }}
+                                />
+                            </div>
+                            <div className={roleName}>
+                                <Text
+                                    className={roleNameOverflow}
+                                    variant="text-xs/medium"
                                 >
-                            {tooltipProps => (
-                                <FakeRole {...tooltipProps} text={permission} color={roleColor} />
-                            )}
-                        </Tooltip>
+                                    {permission}
+                                </Text>
+                            </div>
+                        </div>
                     ))}
                 </div>
             )}

src/plugins/permissionsViewer/index.tsx

@@ -26,7 +26,7 @@ import { Devs } from "@utils/constants";
 import { classes } from "@utils/misc";
 import definePlugin, { OptionType } from "@utils/types";
 import { findByPropsLazy } from "@webpack";
-import { Button, ChannelStore, Dialog, GuildMemberStore, GuildStore, match, Menu, PermissionsBits, Popout, TooltipContainer, UserStore } from "@webpack/common";
+import { Button, ChannelStore, Dialog, GuildMemberStore, GuildStore, Menu, PermissionsBits, Popout, TooltipContainer, UserStore } from "@webpack/common";
 import type { Guild, GuildMember } from "discord-types/general";
 
 import openRolesAndUsersPermissionsModal, { PermissionType, RoleOrUserPermission } from "./components/RolesAndUsersPermissions";
@@ -54,12 +54,12 @@ export const settings = definePluginSettings({
         options: [
             { label: "Highest Role", value: PermissionsSortOrder.HighestRole, default: true },
             { label: "Lowest Role", value: PermissionsSortOrder.LowestRole }
-        ]
+        ],
     },
     defaultPermissionsDropdownState: {
         description: "Whether the permissions dropdown on user popouts should be open by default",
         type: OptionType.BOOLEAN,
-        default: false
+        default: false,
     }
 });
 
@@ -73,12 +73,14 @@ function MenuItem(guildId: string, id?: string, type?: MenuItemParentType) {
             action={() => {
                 const guild = GuildStore.getGuild(guildId);
 
-                const { permissions, header } = match(type)
-                    .returnType<{ permissions: RoleOrUserPermission[], header: string; }>()
-                    .with(MenuItemParentType.User, () => {
+                let permissions: RoleOrUserPermission[];
+                let header: string;
+
+                switch (type) {
+                    case MenuItemParentType.User: {
                         const member = GuildMemberStore.getMember(guildId, id!);
 
-                        const permissions: RoleOrUserPermission[] = getSortedRoles(guild, member)
+                        permissions = getSortedRoles(guild, member)
                             .map(role => ({
                                 type: PermissionType.Role,
                                 ...role
@@ -91,37 +93,37 @@ function MenuItem(guildId: string, id?: string, type?: MenuItemParentType) {
                             });
                         }
 
-                        return {
-                            permissions,
-                            header: member.nick ?? UserStore.getUser(member.userId).username
-                        };
-                    })
-                    .with(MenuItemParentType.Channel, () => {
+                        header = member.nick ?? UserStore.getUser(member.userId).username;
+
+                        break;
+                    }
+
+                    case MenuItemParentType.Channel: {
                         const channel = ChannelStore.getChannel(id!);
 
-                        const permissions = sortPermissionOverwrites(Object.values(channel.permissionOverwrites).map(({ id, allow, deny, type }) => ({
+                        permissions = sortPermissionOverwrites(Object.values(channel.permissionOverwrites).map(({ id, allow, deny, type }) => ({
                             type: type as PermissionType,
                             id,
                             overwriteAllow: allow,
                             overwriteDeny: deny
                         })), guildId);
 
-                        return {
-                            permissions,
-                            header: channel.name
-                        };
-                    })
-                    .otherwise(() => {
-                        const permissions = Object.values(GuildStore.getRoles(guild.id)).map(role => ({
+                        header = channel.name;
+
+                        break;
+                    }
+
+                    default: {
+                        permissions = Object.values(GuildStore.getRoles(guild.id)).map(role => ({
                             type: PermissionType.Role,
                             ...role
                         }));
 
-                        return {
-                            permissions,
-                            header: guild.name
-                        };
-                    });
+                        header = guild.name;
+
+                        break;
+                    }
+                }
 
                 openRolesAndUsersPermissionsModal(permissions, guild, header);
             }}
@@ -131,34 +133,32 @@ function MenuItem(guildId: string, id?: string, type?: MenuItemParentType) {
 
 function makeContextMenuPatch(childId: string | string[], type?: MenuItemParentType): NavContextMenuPatchCallback {
     return (children, props) => {
-        if (
-            !props ||
-            (type === MenuItemParentType.User && !props.user) ||
-            (type === MenuItemParentType.Guild && !props.guild) ||
-            (type === MenuItemParentType.Channel && (!props.channel || !props.guild))
-        ) {
+        if (!props) return;
+        if ((type === MenuItemParentType.User && !props.user) || (type === MenuItemParentType.Guild && !props.guild) || (type === MenuItemParentType.Channel && (!props.channel || !props.guild)))
             return;
-        }
 
         const group = findGroupChildrenByChildId(childId, children);
 
-        const item = match(type)
-            .with(MenuItemParentType.User, () => MenuItem(props.guildId, props.user.id, type))
-            .with(MenuItemParentType.Channel, () => MenuItem(props.guild.id, props.channel.id, type))
-            .with(MenuItemParentType.Guild, () => MenuItem(props.guild.id))
-            .otherwise(() => null);
-
+        const item = (() => {
+            switch (type) {
+                case MenuItemParentType.User:
+                    return MenuItem(props.guildId, props.user.id, type);
+                case MenuItemParentType.Channel:
+                    return MenuItem(props.guild.id, props.channel.id, type);
+                case MenuItemParentType.Guild:
+                    return MenuItem(props.guild.id);
+                default:
+                    return null;
+            }
+        })();
 
         if (item == null) return;
 
-        if (group) {
-            return group.push(item);
-        }
-
+        if (group)
+            group.push(item);
+        else if (childId === "roles" && props.guildId)
             // "roles" may not be present due to the member not having any roles. In that case, add it above "Copy ID"
-        if (childId === "roles" && props.guildId) {
             children.splice(-1, 0, <Menu.MenuGroup>{item}</Menu.MenuGroup>);
-        }
     };
 }
 
@@ -169,22 +169,32 @@ export default definePlugin({
     settings,
 
     patches: [
+        {
+            find: ".popularApplicationCommandIds,",
+            replacement: {
+                match: /showBorder:(.{0,60})}\),(?<=guild:(\i),guildMember:(\i),.+?)/,
+                replace: (m, showBoder, guild, guildMember) => `${m}$self.UserPermissions(${guild},${guildMember},${showBoder}),`
+            }
+        },
         {
             find: ".VIEW_ALL_ROLES,",
             replacement: {
-                match: /\.collapseButton,.+?}\)}\),/,
+                match: /children:"\+"\.concat\(\i\.length-\i\.length\).{0,20}\}\),/,
                 replace: "$&$self.ViewPermissionsButton(arguments[0]),"
             }
         }
     ],
 
+    UserPermissions: (guild: Guild, guildMember: GuildMember | undefined, showBorder: boolean) =>
+        !!guildMember && <UserPermissions guild={guild} guildMember={guildMember} showBorder={showBorder} />,
+
     ViewPermissionsButton: ErrorBoundary.wrap(({ guild, guildMember }: { guild: Guild; guildMember: GuildMember; }) => (
         <Popout
             position="bottom"
             align="center"
             renderPopout={() => (
                 <Dialog className={PopoutClasses.container} style={{ width: "500px" }}>
-                    <UserPermissions guild={guild} guildMember={guildMember} forceOpen />
+                    <UserPermissions guild={guild} guildMember={guildMember} showBorder forceOpen />
                 </Dialog>
             )}
         >

src/plugins/permissionsViewer/styles.css

@@ -1,6 +1,20 @@
 /* User Permissions Component */
 
-.vc-permviewer-user-sortorder-btn {
+.vc-permviewer-userperms-title-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 10px;
+    margin-bottom: 6px;
+}
+
+.vc-permviewer-userperms-btns-container {
+    display: flex;
+    align-items: center;
+}
+
+.vc-permviewer-userperms-sortorder-btn {
+    all: unset;
     cursor: pointer;
     display: flex;
     align-items: center;
@@ -9,17 +23,27 @@
     height: 24px;
 }
 
-/*  RolesAndUsersPermissions Component */
-
-.vc-permviewer-modal-content {
-    padding: 16px 4px 16px 16px;
+.vc-permviewer-userperms-permdetails-btn {
+    all: unset;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
 }
 
-.vc-permviewer-modal-title {
+.vc-permviewer-userperms-toggleperms-btn {
+    all: unset;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+}
+
+/*  RolesAndUsersPermissions Component */
+
+.vc-permviewer-perms-title {
     flex-grow: 1;
 }
 
-.vc-permviewer-modal-no-perms {
+.vc-permviewer-perms-no-perms {
     width: 100%;
     height: 100%;
     display: flex;
@@ -28,103 +52,101 @@
     text-align: center;
 }
 
-.vc-permviewer-modal-container {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    gap: 8px;
+.vc-permviewer-perms-container {
+    display: grid;
+    grid-template-columns: 1fr 2fr;
+    grid-template-areas: "list permissions";
+    padding: 16px 0;
 }
 
-.vc-permviewer-modal-list {
+.vc-permviewer-perms-list {
+    grid-area: list;
     display: flex;
     flex-direction: column;
     gap: 2px;
-    padding-right: 8px;
-    width: 200px;
+    border-right: 2px solid var(--background-modifier-active);
 }
 
-.vc-permviewer-modal-list-item-btn {
+.vc-permviewer-perms-list-item-btn {
+    all: unset;
     cursor: pointer;
 }
 
-.vc-permviewer-modal-list-item {
+.vc-permviewer-perms-list-item {
     display: flex;
     align-items: center;
-    gap: 8px;
-    padding: 8px;
+    padding: 8px 5px;
+    cursor: pointer;
+    width: 230px;
     border-radius: 5px;
 }
 
-.vc-permviewer-modal-list-item:hover {
+.vc-permviewer-perms-list-item:hover {
     background-color: var(--background-modifier-hover);
 }
 
-.vc-permviewer-modal-list-item-active {
+.vc-permviewer-perms-list-item-active {
     background-color: var(--background-modifier-selected);
 }
 
-.vc-permviewer-modal-list-item > div {
+.vc-permviewer-perms-list-item > div {
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
 }
 
-.vc-permviewer-modal-role-circle {
+.vc-permviewer-perms-role-circle {
     border-radius: 50%;
     width: 12px;
     height: 12px;
+    margin-left: 3px;
+    margin-right: 11px;
     flex-shrink: 0;
 }
 
-.vc-permviewer-modal-role-image {
-    width: 20px;
-    height: 20px;
-    object-fit: contain;
-}
-
-.vc-permviewer-modal-user-img {
+.vc-permviewer-perms-user-img {
     border-radius: 50%;
     width: 20px;
     height: 20px;
+    margin-right: 6px;
 }
 
-.vc-permviewer-modal-divider {
-    width: 2px;
-    background-color: var(--background-modifier-active);
-}
-
-.vc-permviewer-modal-perms {
+.vc-permviewer-perms-perms {
+    grid-area: permissions;
     display: flex;
     flex-direction: column;
-    padding-right: 8px;
+    margin-left: 5px;
 }
 
-.vc-permviewer-modal-perms-item {
+.vc-permviewer-perms-perms-item {
+    position: relative;
     display: flex;
     align-items: center;
-    gap: 5px;
-    padding: 10px 2px 10px 10px;
+    padding: 10px;
     border-bottom: 2px solid var(--background-modifier-active);
 }
 
-.vc-permviewer-modal-perms-item:last-child {
+.vc-permviewer-perms-perms-item:last-child {
     border: 0;
 }
 
-.vc-permviewer-modal-perms-item-icon {
+.vc-permviewer-perms-perms-item-icon {
     border: 1px solid var(--background-modifier-selected);
     width: 24px;
     height: 24px;
+    margin-right: 5px;
 }
 
-.vc-permviewer-modal-perms-item .vc-info-icon {
+.vc-permviewer-perms-perms-item .vc-info-icon {
     color: var(--interactive-muted);
-    margin-left: auto;
     cursor: pointer;
+    position: absolute;
+    right: 0;
+    scale: 0.9;
     transition: color ease-in 0.1s;
 }
 
-.vc-permviewer-modal-perms-item .vc-info-icon:hover {
+.vc-permviewer-perms-perms-item .vc-info-icon:hover {
     color: var(--interactive-active);
 }
 
@@ -145,14 +167,3 @@
     background: rgb(var(--bg-overlay-color)/var(--bg-overlay-opacity-6));
     border-color: var(--profile-body-border-color)
 }
-
-.vc-permviewer-granted-by-container {
-    max-width: 300px;
-    width: auto;
-}
-
-.vc-permviewer-granted-by-content {
-    display: flex;
-    align-items: center;
-    gap: 4px;
-}

src/plugins/pictureInPicture/index.tsx

@@ -24,13 +24,13 @@ const settings = definePluginSettings({
 export default definePlugin({
     name: "PictureInPicture",
     description: "Adds picture in picture to videos (next to the Download button)",
-    authors: [Devs.Lumap],
+    authors: [Devs.Nobody],
     settings,
     patches: [
         {
-            find: ".removeMosaicItemHoverButton),",
+            find: ".nonMediaMosaicItem]",
             replacement: {
-                match: /\.nonMediaMosaicItem\]:!(\i).{0,50}?children:\[\S,(\S)/,
+                match: /\.nonMediaMosaicItem\]:!(\i).{0,10}children:\[(\S)/,
                 replace: "$&,$1&&$2&&$self.renderPiPButton(),"
             },
         },

src/plugins/pronoundb/index.ts

@@ -26,6 +26,11 @@ import { CompactPronounsChatComponentWrapper, PronounsChatComponentWrapper } fro
 import { useProfilePronouns } from "./pronoundbUtils";
 import { settings } from "./settings";
 
+const PRONOUN_TOOLTIP_PATCH = {
+    match: /text:(.{0,10}.Messages\.USER_PROFILE_PRONOUNS)(?=,)/,
+    replace: '$& + (typeof vcPronounSource !== "undefined" ? ` (${vcPronounSource})` : "")'
+};
+
 export default definePlugin({
     name: "PronounDB",
     authors: [Devs.Tyman, Devs.TheKodeToad, Devs.Ven, Devs.Elvyra],
@@ -46,23 +51,26 @@ export default definePlugin({
                 }
             ]
         },
-
+        // Patch the profile popout username header to use our pronoun hook instead of Discord's pronouns
         {
-            find: ".Messages.USER_PROFILE_PRONOUNS",
-            group: true,
+            find: ".pronouns,children",
             replacement: [
                 {
-                    match: /\.PANEL},/,
-                    replace: "$&[vcPronoun,vcPronounSource,vcHasPendingPronouns]=$self.useProfilePronouns(arguments[0].user?.id),"
+                    match: /{user:(\i),[^}]*,pronouns:(\i),[^}]*}=\i.*?;(?=return)/,
+                    replace: "$&let vcPronounSource;[$2,vcPronounSource]=$self.useProfilePronouns($1.id);"
                 },
-                {
-                    match: /text:\i\.\i.Messages.USER_PROFILE_PRONOUNS/,
-                    replace: '$&+(vcHasPendingPronouns?"":` (${vcPronounSource})`)'
+                PRONOUN_TOOLTIP_PATCH
+            ]
         },
+        // Patch the profile modal username header to use our pronoun hook instead of Discord's pronouns
         {
-                    match: /(\.pronounsText.+?children:)(\i)/,
-                    replace: "$1vcHasPendingPronouns?$2:vcPronoun"
-                }
+            find: ".nameTagSmall)",
+            replacement: [
+                {
+                    match: /\.getName\(\i\);(?<=displayProfile.{0,200})/,
+                    replace: "$&const [vcPronounce,vcPronounSource]=$self.useProfilePronouns(arguments[0].user.id,true);if(arguments[0].displayProfile&&vcPronounce)arguments[0].displayProfile.pronouns=vcPronounce;"
+                },
+                PRONOUN_TOOLTIP_PATCH
             ]
         }
     ],

src/plugins/pronoundb/pronoundbUtils.ts

@@ -21,16 +21,13 @@ import { debounce } from "@shared/debounce";
 import { VENCORD_USER_AGENT } from "@shared/vencordUserAgent";
 import { getCurrentChannel } from "@utils/discord";
 import { useAwaiter } from "@utils/react";
-import { findStoreLazy } from "@webpack";
 import { UserProfileStore, UserStore } from "@webpack/common";
 
 import { settings } from "./settings";
 import { CachePronouns, PronounCode, PronounMapping, PronounsResponse } from "./types";
 
-const UserSettingsAccountStore = findStoreLazy("UserSettingsAccountStore");
-
-type PronounsWithSource = [pronouns: string | null, source: string, hasPendingPronouns: boolean];
-const EmptyPronouns: PronounsWithSource = [null, "", false];
+type PronounsWithSource = [string | null, string];
+const EmptyPronouns: PronounsWithSource = [null, ""];
 
 export const enum PronounsFormat {
     Lowercase = "LOWERCASE",
@@ -78,15 +75,13 @@ export function useFormattedPronouns(id: string, useGlobalProfile: boolean = fal
         onError: e => console.error("Fetching pronouns failed: ", e)
     });
 
-    const hasPendingPronouns = UserSettingsAccountStore.getPendingPronouns() != null;
-
     if (settings.store.pronounSource === PronounSource.PreferDiscord && discordPronouns)
-        return [discordPronouns, "Discord", hasPendingPronouns];
+        return [discordPronouns, "Discord"];
 
     if (result && result !== PronounMapping.unspecified)
-        return [result, "PronounDB", hasPendingPronouns];
+        return [result, "PronounDB"];
 
-    return [discordPronouns, "Discord", hasPendingPronouns];
+    return [discordPronouns, "Discord"];
 }
 
 export function useProfilePronouns(id: string, useGlobalProfile: boolean = false): PronounsWithSource {
@@ -152,7 +147,7 @@ async function bulkFetchPronouns(ids: string[]): Promise<PronounsResponse> {
     }
 }
 
-export function extractPronouns(pronounSet?: { [locale: string]: PronounCode[]; }): string {
+export function extractPronouns(pronounSet?: { [locale: string]: PronounCode[] }): string {
     if (!pronounSet || !pronounSet.en) return PronounMapping.unspecified;
     // PronounDB returns an empty set instead of {sets: {en: ["unspecified"]}}.
     const pronouns = pronounSet.en;

src/plugins/reviewDB/components/ReviewModal.tsx

@@ -22,13 +22,12 @@ import { useForceUpdater } from "@utils/react";
 import { Paginator, Text, useRef, useState } from "@webpack/common";
 
 import { Auth } from "../auth";
-import { ReviewType } from "../entities";
 import { Response, REVIEWS_PER_PAGE } from "../reviewDbApi";
 import { cl } from "../utils";
 import ReviewComponent from "./ReviewComponent";
 import ReviewsView, { ReviewsInputComponent } from "./ReviewsView";
 
-function Modal({ modalProps, modalKey, discordId, name, type }: { modalProps: any; modalKey: string, discordId: string; name: string; type: ReviewType; }) {
+function Modal({ modalProps, modalKey, discordId, name }: { modalProps: any; modalKey: string, discordId: string; name: string; }) {
     const [data, setData] = useState<Response>();
     const [signal, refetch] = useForceUpdater(true);
     const [page, setPage] = useState(1);
@@ -59,7 +58,6 @@ function Modal({ modalProps, modalKey, discordId, name, type }: { modalProps: an
                             onFetchReviews={setData}
                             scrollToTop={() => ref.current?.scrollTo({ top: 0, behavior: "smooth" })}
                             hideOwnReview
-                            type={type}
                         />
                     </div>
                 </ModalContent>
@@ -97,7 +95,7 @@ function Modal({ modalProps, modalKey, discordId, name, type }: { modalProps: an
     );
 }
 
-export function openReviewsModal(discordId: string, name: string, type: ReviewType) {
+export function openReviewsModal(discordId: string, name: string) {
     const modalKey = "vc-rdb-modal-" + Date.now();
 
     openModal(props => (
@@ -106,7 +104,6 @@ export function openReviewsModal(discordId: string, name: string, type: ReviewTy
             modalProps={props}
             discordId={discordId}
             name={name}
-            type={type}
         />
     ), { modalKey });
 }

src/plugins/reviewDB/components/ReviewsView.tsx

@@ -21,7 +21,7 @@ import { findByCodeLazy, findByPropsLazy, findComponentByCodeLazy } from "@webpa
 import { Forms, React, RelationshipStore, useRef, UserStore } from "@webpack/common";
 
 import { Auth, authorize } from "../auth";
-import { Review, ReviewType } from "../entities";
+import { Review } from "../entities";
 import { addReview, getReviews, Response, REVIEWS_PER_PAGE } from "../reviewDbApi";
 import { settings } from "../settings";
 import { cl, showToast } from "../utils";
@@ -45,7 +45,6 @@ interface Props extends UserProps {
     page?: number;
     scrollToTop?(): void;
     hideOwnReview?: boolean;
-    type: ReviewType;
 }
 
 export default function ReviewsView({
@@ -57,7 +56,6 @@ export default function ReviewsView({
     page = 1,
     showInput = false,
     hideOwnReview = false,
-    type,
 }: Props) {
     const [signal, refetch] = useForceUpdater(true);
 
@@ -82,7 +80,6 @@ export default function ReviewsView({
                 reviews={reviewData!.reviews}
                 hideOwnReview={hideOwnReview}
                 profileId={discordId}
-                type={type}
             />
 
             {showInput && (
@@ -97,7 +94,7 @@ export default function ReviewsView({
     );
 }
 
-function ReviewList({ refetch, reviews, hideOwnReview, profileId, type }: { refetch(): void; reviews: Review[]; hideOwnReview: boolean; profileId: string; type: ReviewType; }) {
+function ReviewList({ refetch, reviews, hideOwnReview, profileId }: { refetch(): void; reviews: Review[]; hideOwnReview: boolean; profileId: string; }) {
     const myId = UserStore.getCurrentUser().id;
 
     return (
@@ -114,7 +111,7 @@ function ReviewList({ refetch, reviews, hideOwnReview, profileId, type }: { refe
 
             {reviews?.length === 0 && (
                 <Forms.FormText className={cl("placeholder")}>
-                    Looks like nobody reviewed this {type === ReviewType.User ? "user" : "server"} yet. You could be the first!
+                    Looks like nobody reviewed this user yet. You could be the first!
                 </Forms.FormText>
             )}
         </div>

src/plugins/reviewDB/index.tsx

@@ -20,17 +20,19 @@ import "./style.css";
 
 import { NavContextMenuPatchCallback } from "@api/ContextMenu";
 import ErrorBoundary from "@components/ErrorBoundary";
+import { ExpandableHeader } from "@components/ExpandableHeader";
 import { NotesIcon, OpenExternalIcon } from "@components/Icons";
 import { Devs } from "@utils/constants";
 import { classes } from "@utils/misc";
 import definePlugin from "@utils/types";
 import { findByPropsLazy } from "@webpack";
-import { Alerts, Button, Menu, Parser, TooltipContainer } from "@webpack/common";
+import { Alerts, Button, Menu, Parser, TooltipContainer, useState } from "@webpack/common";
 import { Guild, User } from "discord-types/general";
 
 import { Auth, initAuth, updateAuth } from "./auth";
 import { openReviewsModal } from "./components/ReviewModal";
-import { NotificationType, ReviewType } from "./entities";
+import ReviewsView from "./components/ReviewsView";
+import { NotificationType } from "./entities";
 import { getCurrentUserInfo, readNotification } from "./reviewDbApi";
 import { settings } from "./settings";
 import { showToast } from "./utils";
@@ -44,7 +46,7 @@ const guildPopoutPatch: NavContextMenuPatchCallback = (children, { guild }: { gu
             label="View Reviews"
             id="vc-rdb-server-reviews"
             icon={OpenExternalIcon}
-            action={() => openReviewsModal(guild.id, guild.name, ReviewType.Server)}
+            action={() => openReviewsModal(guild.id, guild.name)}
         />
     );
 };
@@ -56,7 +58,7 @@ const userContextPatch: NavContextMenuPatchCallback = (children, { user }: { use
             label="View Reviews"
             id="vc-rdb-user-reviews"
             icon={OpenExternalIcon}
-            action={() => openReviewsModal(user.id, user.username, ReviewType.User)}
+            action={() => openReviewsModal(user.id, user.username)}
         />
     );
 };
@@ -76,25 +78,18 @@ export default definePlugin({
     },
 
     patches: [
+        {
+            find: "showBorder:null",
+            replacement: {
+                match: /user:(\i),setNote:\i,canDM.+?\}\)/,
+                replace: "$&,$self.getReviewsComponent($1)"
+            }
+        },
         {
             find: ".BITE_SIZE,user:",
             replacement: {
-                match: /{profileType:\i\.\i\.BITE_SIZE,children:\[/,
-                replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user}),"
-            }
-        },
-        {
-            find: ".FULL_SIZE,user:",
-            replacement: {
-                match: /{profileType:\i\.\i\.FULL_SIZE,children:\[/,
-                replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user}),"
-            }
-        },
-        {
-            find: ".PANEL,isInteractionSource:",
-            replacement: {
-                match: /{profileType:\i\.\i\.PANEL,children:\[/,
-                replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user}),"
+                match: /(?<=\.BITE_SIZE,children:\[)\(0,\i\.jsx\)\(\i\.\i,\{user:(\i),/,
+                replace: "$self.BiteSizeReviewsButton({user:$1}),$&"
             }
         }
     ],
@@ -153,11 +148,36 @@ export default definePlugin({
         }, 4000);
     },
 
+    getReviewsComponent: ErrorBoundary.wrap((user: User) => {
+        const [reviewCount, setReviewCount] = useState<number>();
+
+        return (
+            <ExpandableHeader
+                headerText="User Reviews"
+                onMoreClick={() => openReviewsModal(user.id, user.username)}
+                moreTooltipText={
+                    reviewCount && reviewCount > 50
+                        ? `View all ${reviewCount} reviews`
+                        : "Open Review Modal"
+                }
+                onDropDownClick={state => settings.store.reviewsDropdownState = !state}
+                defaultState={settings.store.reviewsDropdownState}
+            >
+                <ReviewsView
+                    discordId={user.id}
+                    name={user.username}
+                    onFetchReviews={r => setReviewCount(r.reviewCount)}
+                    showInput
+                />
+            </ExpandableHeader>
+        );
+    }, { message: "Failed to render Reviews" }),
+
     BiteSizeReviewsButton: ErrorBoundary.wrap(({ user }: { user: User; }) => {
         return (
             <TooltipContainer text="View Reviews">
                 <Button
-                    onClick={() => openReviewsModal(user.id, user.username, ReviewType.User)}
+                    onClick={() => openReviewsModal(user.id, user.username)}
                     look={Button.Looks.FILLED}
                     size={Button.Sizes.NONE}
                     color={RoleButtonClasses.bannerColor}

src/plugins/roleColorEverywhere/index.tsx

@@ -57,7 +57,7 @@ export default definePlugin({
     patches: [
         // Chat Mentions
         {
-            find: ".USER_MENTION)",
+            find: 'location:"UserMention',
             replacement: [
                 {
                     match: /onContextMenu:\i,color:\i,\.\.\.\i(?=,children:)(?<=user:(\i),channel:(\i).{0,500}?)/,

src/plugins/secretRingTone/index.ts

@@ -4,38 +4,21 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
-import definePlugin, { OptionType } from "@utils/types";
-
-const settings = definePluginSettings({
-    onlySnow: {
-        type: OptionType.BOOLEAN,
-        description: "Only play the Snow Halation Theme",
-        default: false,
-        restartNeeded: true
-    }
-});
+import definePlugin from "@utils/types";
 
+// NOTE - Ultimately should probably be turned into a ringtone picker plugin
 export default definePlugin({
     name: "SecretRingToneEnabler",
     description: "Always play the secret version of the discord ringtone (except during special ringtone events)",
-    authors: [Devs.AndrewDLO, Devs.FieryFlames, Devs.RamziAH],
-    settings,
+    authors: [Devs.AndrewDLO, Devs.FieryFlames],
     patches: [
         {
             find: '"call_ringing_beat"',
-            replacement: [
-                {
+            replacement: {
                 match: /500!==\i\(\)\.random\(1,1e3\)/,
-                    replace: "false"
+                replace: "false",
+            }
         },
-                {
-                    predicate: () => settings.store.onlySnow,
-                    match: /"call_ringing_beat",/,
-                    replace: ""
-                }
-            ]
-        }
-    ]
+    ],
 });

src/plugins/sendTimestamps/styles.css

@@ -26,7 +26,8 @@
 }
 
 .vc-st-modal-header {
-    place-content: center space-between;
+    justify-content: space-between;
+    align-content: center;
 }
 
 .vc-st-modal-header h1 {