bump to 1.2.3

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

README.md

@@ -10,7 +10,7 @@ The cutest Discord client mod
 
 -   Super easy to install (Download Installer, open, click install button, done)
 -   100+ plugins built in: [See a list](https://vencord.dev/plugins)
-    -   Some highlights: SpotifyControls, MessageLogger, Experiments, GameActivityToggle, Translate, NoTrack, QuickReply, Free Emotes/Stickers, CustomCommands, ShowHiddenChannels, PronounDB
+    -   Some highlights: SpotifyControls, MessageLogger, Experiments, GameActivityToggle, Translate, NoTrack, QuickReply, Free Emotes/Stickers, PermissionsViewer, CustomCommands, ShowHiddenChannels, PronounDB
 -   Fairly lightweight despite the many inbuilt plugins
 -   Excellent Browser Support: Run Vencord in your Browser via extension or UserScript
 -   Works on any Discord branch: Stable, Canary or PTB all work (though for the best experience I recommend stable!)
@@ -32,12 +32,21 @@ Click the below button to install Vencord to the Discord Desktop app
 
 Or use the [UserScript](https://raw.githubusercontent.com/Vencord/builds/main/Vencord.user.js) - Please note that the CSS Editor, Themes loaded from remote sources and co. will not work in the UserScript. Use the extension if you need any of those
 
-## Installing our Desktop App
+<details>
+<summary>Alternative Downloads</summary>
+
+## Vencord Desktop
+
+> **Warning**
+> This is an alternative app. It currently doesn't support screensharing or keybinds. If you just want to install to the normal Discord Desktop app, scroll up
+
 
 As an alternative to the Discord Desktop app, Vencord also has its own standalone Desktop app that is snappier and lighter than Discord's official Desktop app. It is currently in beta and we have yet to implement some features like screensharing, but you can try the beta nonetheless
 
 [![Download Vencord Desktop](https://img.shields.io/github/v/release/Vencord/Desktop?label=Download%20Vencord%20Desktop&style=for-the-badge)](https://github.com/Vencord/Desktop#vencord-desktop)
 
+</details>
+
 ## Join our Support/Community Server
 
 [![Vencord Discord Server](https://invidget.switchblade.xyz/D9uwnFnqmd?theme=dark)](https://discord.gg/D9uwnFnqmd)

package.json

@@ -1,7 +1,7 @@
 {
     "name": "vencord",
     "private": "true",
-    "version": "1.2.2",
+    "version": "1.2.3",
     "description": "The cutest Discord client mod",
     "homepage": "https://github.com/Vendicated/Vencord#readme",
     "bugs": {

src/components/Icons.tsx

@@ -16,28 +16,31 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import "./iconStyles.css";
+
 import { classes } from "@utils/misc";
-import type { PropsWithChildren } from "react";
+import { i18n } from "@webpack/common";
+import type { PropsWithChildren, SVGProps } from "react";
 
 interface BaseIconProps extends IconProps {
     viewBox: string;
 }
 
-interface IconProps {
+interface IconProps extends SVGProps<SVGSVGElement> {
     className?: string;
     height?: number;
     width?: number;
 }
 
-function Icon({ height = 24, width = 24, className, children, viewBox }: PropsWithChildren<BaseIconProps>) {
+function Icon({ height = 24, width = 24, className, children, viewBox, ...svgProps }: PropsWithChildren<BaseIconProps>) {
     return (
         <svg
             className={classes(className, "vc-icon")}
-            aria-hidden="true"
             role="img"
             width={width}
             height={height}
             viewBox={viewBox}
+            {...svgProps}
         >
             {children}
         </svg>
@@ -81,3 +84,65 @@ export function CopyIcon(props: IconProps) {
         </Icon>
     );
 }
+
+/**
+ * Discord's open external icon, as seen in the user profile connections
+ */
+export function OpenExternalIcon(props: IconProps) {
+    return (
+        <Icon
+            {...props}
+            className={classes(props.className, "vc-open-external-icon")}
+            viewBox="0 0 24 24"
+        >
+            <polygon
+                fill="currentColor"
+                fill-rule="nonzero"
+                points="13 20 11 20 11 8 5.5 13.5 4.08 12.08 12 4.16 19.92 12.08 18.5 13.5 13 8"
+            />
+        </Icon>
+    );
+}
+
+export function ImageIcon(props: IconProps) {
+    return (
+        <Icon
+            {...props}
+            className={classes(props.className, "vc-image-icon")}
+            viewBox="0 0 24 24"
+        >
+            <path fill="currentColor" d="M21,19V5c0,-1.1 -0.9,-2 -2,-2H5c-1.1,0 -2,0.9 -2,2v14c0,1.1 0.9,2 2,2h14c1.1,0 2,-0.9 2,-2zM8.5,13.5l2.5,3.01L14.5,12l4.5,6H5l3.5,-4.5z" />
+        </Icon>
+    );
+}
+
+export function InfoIcon(props: IconProps) {
+    return (
+        <Icon
+            {...props}
+            className={classes(props.className, "vc-info-icon")}
+            viewBox="0 0 12 12"
+        >
+            <path fill="currentColor" d="M6 1C3.243 1 1 3.244 1 6c0 2.758 2.243 5 5 5s5-2.242 5-5c0-2.756-2.243-5-5-5zm0 2.376a.625.625 0 110 1.25.625.625 0 010-1.25zM7.5 8.5h-3v-1h1V6H5V5h1a.5.5 0 01.5.5v2h1v1z" />
+        </Icon>
+    );
+}
+
+export function OwnerCrownIcon(props: IconProps) {
+    return (
+        <Icon
+            aria-label={i18n.Messages.GUILD_OWNER}
+            {...props}
+            className={classes(props.className, "vc-owner-crown-icon")}
+            role="img"
+            viewBox="0 0 16 16"
+        >
+            <path
+                fill="currentColor"
+                fill-rule="evenodd"
+                clip-rule="evenodd"
+                d="M13.6572 5.42868C13.8879 5.29002 14.1806 5.30402 14.3973 5.46468C14.6133 5.62602 14.7119 5.90068 14.6473 6.16202L13.3139 11.4954C13.2393 11.7927 12.9726 12.0007 12.6666 12.0007H3.33325C3.02725 12.0007 2.76058 11.792 2.68592 11.4954L1.35258 6.16202C1.28792 5.90068 1.38658 5.62602 1.60258 5.46468C1.81992 5.30468 2.11192 5.29068 2.34325 5.42868L5.13192 7.10202L7.44592 3.63068C7.46173 3.60697 7.48377 3.5913 7.50588 3.57559C7.5192 3.56612 7.53255 3.55663 7.54458 3.54535L6.90258 2.90268C6.77325 2.77335 6.77325 2.56068 6.90258 2.43135L7.76458 1.56935C7.89392 1.44002 8.10658 1.44002 8.23592 1.56935L9.09792 2.43135C9.22725 2.56068 9.22725 2.77335 9.09792 2.90268L8.45592 3.54535C8.46794 3.55686 8.48154 3.56651 8.49516 3.57618C8.51703 3.5917 8.53897 3.60727 8.55458 3.63068L10.8686 7.10202L13.6572 5.42868ZM2.66667 12.6673H13.3333V14.0007H2.66667V12.6673Z"
+            />
+        </Icon>
+    );
+}

src/components/VencordSettings/settingsStyles.css

@@ -57,7 +57,7 @@
 }
 
 .vc-text-selectable,
-.vc-text-selectable :not(a, button, a *, button *) {
+.vc-text-selectable :not(a, button, a *, button *, input, input *) {
     /* make text selectable, silly discord makes the entirety of settings not selectable */
     user-select: text;
 

src/components/iconStyles.css

@@ -0,0 +1,7 @@
+.vc-open-external-icon {
+    transform: rotate(45deg);
+}
+
+.vc-owner-crown-icon {
+    color: var(--text-warning);
+}

src/plugins/moreUserTags.tsx

@@ -17,11 +17,13 @@
 */
 
 import { definePluginSettings } from "@api/Settings";
+import { Flex } from "@components/Flex";
 import { Devs } from "@utils/constants";
-import { proxyLazy } from "@utils/lazy.js";
+import { Margins } from "@utils/margins";
 import definePlugin, { OptionType } from "@utils/types";
-import { find, findByPropsLazy } from "@webpack";
+import { findByPropsLazy, findLazy } from "@webpack";
-import { ChannelStore, GuildStore } from "@webpack/common";
+import { Card, ChannelStore, Forms, GuildStore, Switch, TextInput, Tooltip, useState } from "@webpack/common";
+import { RC } from "@webpack/types";
 import { Channel, Message, User } from "discord-types/general";
 
 type PermissionName = "CREATE_INSTANT_INVITE" | "KICK_MEMBERS" | "BAN_MEMBERS" | "ADMINISTRATOR" | "MANAGE_CHANNELS" | "MANAGE_GUILD" | "CHANGE_NICKNAME" | "MANAGE_NICKNAMES" | "MANAGE_ROLES" | "MANAGE_WEBHOOKS" | "MANAGE_GUILD_EXPRESSIONS" | "CREATE_GUILD_EXPRESSIONS" | "VIEW_AUDIT_LOG" | "VIEW_CHANNEL" | "VIEW_GUILD_ANALYTICS" | "VIEW_CREATOR_MONETIZATION_ANALYTICS" | "MODERATE_MEMBERS" | "SEND_MESSAGES" | "SEND_TTS_MESSAGES" | "MANAGE_MESSAGES" | "EMBED_LINKS" | "ATTACH_FILES" | "READ_MESSAGE_HISTORY" | "MENTION_EVERYONE" | "USE_EXTERNAL_EMOJIS" | "ADD_REACTIONS" | "USE_APPLICATION_COMMANDS" | "MANAGE_THREADS" | "CREATE_PUBLIC_THREADS" | "CREATE_PRIVATE_THREADS" | "USE_EXTERNAL_STICKERS" | "SEND_MESSAGES_IN_THREADS" | "CONNECT" | "SPEAK" | "MUTE_MEMBERS" | "DEAFEN_MEMBERS" | "MOVE_MEMBERS" | "USE_VAD" | "PRIORITY_SPEAKER" | "STREAM" | "USE_EMBEDDED_ACTIVITIES" | "USE_SOUNDBOARD" | "USE_EXTERNAL_SOUNDS" | "REQUEST_TO_SPEAK" | "MANAGE_EVENTS" | "CREATE_EVENTS";
@@ -36,6 +38,21 @@ interface Tag {
     condition?(message: Message | null, user: User, channel: Channel): boolean;
 }
 
+interface TagSetting {
+    text: string;
+    showInChat: boolean;
+    showInNotChat: boolean;
+}
+interface TagSettings {
+    WEBHOOK: TagSetting,
+    OWNER: TagSetting,
+    ADMINISTRATOR: TagSetting,
+    MODERATOR_STAFF: TagSetting,
+    MODERATOR: TagSetting,
+    VOICE_MODERATOR: TagSetting,
+    [k: string]: TagSetting;
+}
+
 const CLYDE_ID = "1081004946872352958";
 
 // PermissionStore.computePermissions is not the same function and doesn't work here
@@ -44,7 +61,7 @@ const PermissionUtil = findByPropsLazy("computePermissions", "canEveryoneRole")
 };
 
 const Permissions = findByPropsLazy("SEND_MESSAGES", "VIEW_CREATOR_MONETIZATION_ANALYTICS") as Record<PermissionName, bigint>;
-const Tags = proxyLazy(() => find(m => m.Types?.[0] === "BOT").Types) as Record<string, number>;
+const Tag = findLazy(m => m.Types?.[0] === "BOT") as RC<{ type?: number, className?: string, useRemSizes?: boolean; }> & { Types: Record<string, number>; };
 
 const isWebhook = (message: Message, user: User) => !!message?.webhookId && user.isNonUserBot();
 
@@ -81,64 +98,119 @@ const tags: Tag[] = [
         permissions: ["MOVE_MEMBERS", "MUTE_MEMBERS", "DEAFEN_MEMBERS"]
     }
 ];
+const defaultSettings = Object.fromEntries(
+    tags.map(({ name, displayName }) => [name, { text: displayName, showInChat: true, showInNotChat: true }])
+) as TagSettings;
+
+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">
+            {tags.map(t => (
+                <Card style={{ padding: "1em 1em 0" }}>
+                    <Forms.FormTitle style={{ width: "fit-content" }}>
+                        <Tooltip text={t.description}>
+                            {({ onMouseEnter, onMouseLeave }) => (
+                                <div
+                                    onMouseEnter={onMouseEnter}
+                                    onMouseLeave={onMouseLeave}
+                                >
+                                    {t.displayName} Tag <Tag type={Tag.Types[t.name]} />
+                                </div>
+                            )}
+                        </Tooltip>
+                    </Forms.FormTitle>
+
+                    <TextInput
+                        type="text"
+                        value={tagSettings[t.name]?.text ?? t.displayName}
+                        placeholder={`Text on tag (default: ${t.displayName})`}
+                        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;
+                            setValue(tagSettings);
+                        }}
+                        hideBorder
+                    >
+                        Show in messages
+                    </Switch>
+
+                    <Switch
+                        value={tagSettings[t.name]?.showInNotChat ?? true}
+                        onChange={v => {
+                            tagSettings[t.name].showInNotChat = v;
+                            setValue(tagSettings);
+                        }}
+                        hideBorder
+                    >
+                        Show in member list and profiles
+                    </Switch>
+                </Card>
+            ))}
+        </Flex>
+    );
+}
 
 const settings = definePluginSettings({
     dontShowForBots: {
-        description: "Don't show tags (not including the webhook tag) for bots",
+        description: "Don't show extra tags for bots (excluding webhooks)",
         type: OptionType.BOOLEAN
     },
     dontShowBotTag: {
-        description: "Don't show [BOT] text for bots with other tags (verified bots will still have checkmark)",
+        description: "Only show extra tags for bots / Hide [BOT] text",
         type: OptionType.BOOLEAN
     },
-    ...Object.fromEntries(tags.map(({ name, displayName, description }) => [
+    tagSettings: {
-        `visibility_${name}`, {
+        type: OptionType.COMPONENT,
-            description: `Show ${displayName} tags (${description})`,
+        component: SettingsComponent,
-            type: OptionType.SELECT,
+        description: "fill me",
-            options: [
+    }
-                {
-                    label: "Always",
-                    value: "always",
-                    default: true
-                }, {
-                    label: "Only in chat",
-                    value: "chat"
-                }, {
-                    label: "Only in member list and profiles",
-                    value: "not-chat"
-                }, {
-                    label: "Never",
-                    value: "never"
-                }
-            ]
-        }
-    ]))
 });
 
 export default definePlugin({
     name: "MoreUserTags",
     description: "Adds tags for webhooks and moderative roles (owner, admin, etc.)",
-    authors: [Devs.Cyn, Devs.TheSun, Devs.RyanCaoDev],
+    authors: [Devs.Cyn, Devs.TheSun, Devs.RyanCaoDev, Devs.LordElias],
     settings,
     patches: [
         // add tags to the tag list
         {
             find: '.BOT=0]="BOT"',
             replacement: [
-                // add tags to the exported tags list (the Tags variable here)
+                // add tags to the exported tags list (Tag.Types)
                 {
                     match: /(\i)\[.\.BOT=0\]="BOT";/,
                     replace: "$&$1=$self.addTagVariants($1);"
-                },
+                }
+            ]
+        },
+        {
+            find: ".DISCORD_SYSTEM_MESSAGE_BOT_TAG_TOOLTIP;",
+            replacement: [
                 // make the tag show the right text
                 {
-                    match: /(switch\((\i)\){.+?)case (\i)\.BOT:default:(\i)=(\i\.\i\.Messages)\.BOT_TAG_BOT/,
+                    match: /(switch\((\i)\){.+?)case (\i(?:\.\i)?)\.BOT:default:(\i)=(\i\.\i\.Messages)\.BOT_TAG_BOT/,
                     replace: (_, origSwitch, variant, tags, displayedText, strings) =>
                         `${origSwitch}default:{${displayedText} = $self.getTagText(${tags}[${variant}], ${strings})}`
                 },
                 // show OP tags correctly
                 {
-                    match: /(\i)=(\i)===\i\.ORIGINAL_POSTER/,
+                    match: /(\i)=(\i)===\i(?:\.\i)?\.ORIGINAL_POSTER/,
                     replace: "$1=$self.isOPTag($2)"
                 },
                 // add HTML data attributes (for easier theming)
@@ -169,15 +241,15 @@ return type!==null?$2.botTag,type"
         {
             find: ".hasAvatarForGuild(null==",
             replacement: {
-                match: /\.usernameSection,user/,
+                match: /(?=usernameIcon:)/,
-                replace: ".usernameSection,moreTags_channelId:arguments[0].channelId,user"
+                replace: "moreTags_channelId:arguments[0].channelId,"
             }
         },
         {
             find: 'copyMetaData:"User Tag"',
             replacement: {
-                match: /discriminatorClass:(.{1,100}),botClass:/,
+                match: /(?=,botClass:)/,
-                replace: "discriminatorClass:$1,moreTags_channelId:arguments[0].moreTags_channelId,botClass:"
+                replace: ",moreTags_channelId:arguments[0].moreTags_channelId"
             }
         },
         // in profiles
@@ -190,6 +262,37 @@ return type!==null?$2.botTag,type"
         },
     ],
 
+    start() {
+        if (settings.store.tagSettings) return;
+        // @ts-ignore
+        if (!settings.store.visibility_WEBHOOK) settings.store.tagSettings = defaultSettings;
+        else {
+            const newSettings = { ...defaultSettings };
+            Object.entries(Vencord.PlainSettings.plugins.MoreUserTags).forEach(([name, value]) => {
+                const [setting, tag] = name.split("_");
+                if (setting === "visibility") {
+                    switch (value) {
+                        case "always":
+                            // its the default
+                            break;
+                        case "chat":
+                            newSettings[tag].showInNotChat = false;
+                            break;
+                        case "not-chat":
+                            newSettings[tag].showInChat = false;
+                            break;
+                        case "never":
+                            newSettings[tag].showInChat = false;
+                            newSettings[tag].showInNotChat = false;
+                            break;
+                    }
+                }
+                settings.store.tagSettings = newSettings;
+                delete Vencord.Settings.plugins.MoreUserTags[name];
+            });
+        }
+    },
+
     getPermissions(user: User, channel: Channel): string[] {
         const guild = GuildStore.getGuild(channel?.guild_id);
         if (!guild) return [];
@@ -202,35 +305,36 @@ return type!==null?$2.botTag,type"
             .filter(Boolean);
     },
 
-    addTagVariants(val: any /* i cant think of a good name */) {
+    addTagVariants(tagConstant) {
         let i = 100;
         tags.forEach(({ name }) => {
-            val[name] = ++i;
+            tagConstant[name] = ++i;
-            val[i] = name;
+            tagConstant[i] = name;
-            val[`${name}-BOT`] = ++i;
+            tagConstant[`${name}-BOT`] = ++i;
-            val[i] = `${name}-BOT`;
+            tagConstant[i] = `${name}-BOT`;
-            val[`${name}-OP`] = ++i;
+            tagConstant[`${name}-OP`] = ++i;
-            val[i] = `${name}-OP`;
+            tagConstant[i] = `${name}-OP`;
         });
-        return val;
+        return tagConstant;
     },
 
-    isOPTag: (tag: number) => tag === Tags.ORIGINAL_POSTER || tags.some(t => tag === Tags[`${t.name}-OP`]),
+    isOPTag: (tag: number) => tag === Tag.Types.ORIGINAL_POSTER || tags.some(t => tag === Tag.Types[`${t.name}-OP`]),
 
     getTagText(passedTagName: string, strings: Record<string, string>) {
-        if (!passedTagName) return "BOT";
+        if (!passedTagName) return strings.BOT_TAG_BOT;
         const [tagName, variant] = passedTagName.split("-");
         const tag = tags.find(({ name }) => tagName === name);
-        if (!tag) return "BOT";
+        if (!tag) return strings.BOT_TAG_BOT;
         if (variant === "BOT" && tagName !== "WEBHOOK" && this.settings.store.dontShowForBots) return strings.BOT_TAG_BOT;
 
+        const tagText = settings.store.tagSettings?.[tag.name]?.text || tag.displayName;
         switch (variant) {
             case "OP":
-                return `${strings.BOT_TAG_FORUM_ORIGINAL_POSTER} • ${tag.displayName}`;
+                return `${strings.BOT_TAG_FORUM_ORIGINAL_POSTER} • ${tagText}`;
             case "BOT":
-                return `${strings.BOT_TAG_BOT} • ${tag.displayName}`;
+                return `${strings.BOT_TAG_BOT} • ${tagText}`;
             default:
-                return tag.displayName;
+                return tagText;
         }
     },
 
@@ -242,12 +346,12 @@ return type!==null?$2.botTag,type"
         channel?: Channel & { isForumPost(): boolean; },
         channelId?: string;
         origType?: number;
-        location: string;
+        location: "chat" | "not-chat";
     }): number | null {
         if (location === "chat" && user.id === "1")
-            return Tags.OFFICIAL;
+            return Tag.Types.OFFICIAL;
         if (user.id === CLYDE_ID)
-            return Tags.AI;
+            return Tag.Types.AI;
 
         let type = typeof origType === "number" ? origType : null;
 
@@ -258,24 +362,19 @@ return type!==null?$2.botTag,type"
         const perms = this.getPermissions(user, channel);
 
         for (const tag of tags) {
-            switch (settings[`visibility_${tag.name}`]) {
+            if (location === "chat" && !settings.tagSettings[tag.name].showInChat) continue;
-                case "always":
+            if (location === "not-chat" && !settings.tagSettings[tag.name].showInNotChat) continue;
-                case location:
-                    break;
-                default:
-                    continue;
-            }
 
             if (
                 tag.permissions?.some(perm => perms.includes(perm)) ||
                 (tag.condition?.(message!, user, channel))
             ) {
                 if (channel.isForumPost() && channel.ownerId === user.id)
-                    type = Tags[`${tag.name}-OP`];
+                    type = Tag.Types[`${tag.name}-OP`];
                 else if (user.bot && !isWebhook(message!, user) && !settings.dontShowBotTag)
-                    type = Tags[`${tag.name}-BOT`];
+                    type = Tag.Types[`${tag.name}-BOT`];
                 else
-                    type = Tags[tag.name];
+                    type = Tag.Types[tag.name];
                 break;
             }
         }

src/plugins/noReplyMention.tsx

@@ -22,12 +22,27 @@ import definePlugin, { OptionType } from "@utils/types";
 import type { Message } from "discord-types/general";
 
 const settings = definePluginSettings({
-    exemptList: {
+    userList: {
         description:
-            "List of users to exempt from this plugin (separated by commas or spaces)",
+            "List of users to allow or exempt pings for (separated by commas or spaces)",
         type: OptionType.STRING,
         default: "1234567890123445,1234567890123445",
     },
+    shouldPingListed: {
+        description: "Behaviour",
+        type: OptionType.SELECT,
+        options: [
+            {
+                label: "Do not ping the listed users",
+                value: false,
+            },
+            {
+                label: "Only ping the listed users",
+                value: true,
+                default: true,
+            },
+        ],
+    },
     inverseShiftReply: {
         description: "Invert Discord's shift replying behaviour (enable to make shift reply mention user)",
         type: OptionType.BOOLEAN,
@@ -38,11 +53,12 @@ const settings = definePluginSettings({
 export default definePlugin({
     name: "NoReplyMention",
     description: "Disables reply pings by default",
-    authors: [Devs.DustyAngel47, Devs.axyie, Devs.pylix],
+    authors: [Devs.DustyAngel47, Devs.axyie, Devs.pylix, Devs.outfoxxed],
     settings,
 
     shouldMention(message: Message, isHoldingShift: boolean) {
-        const isExempt = settings.store.exemptList.includes(message.author.id);
+        const isListed = settings.store.userList.includes(message.author.id);
+        const isExempt = settings.store.shouldPingListed ? isListed : !isListed;
         return settings.store.inverseShiftReply ? isHoldingShift !== isExempt : !isHoldingShift && isExempt;
     },
 

src/plugins/permissionsViewer/components/RolesAndUsersPermissions.tsx

@@ -0,0 +1,225 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Flex } from "@components/Flex";
+import { InfoIcon, OwnerCrownIcon } from "@components/Icons";
+import { ModalCloseButton, ModalContent, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
+import { ContextMenu, FluxDispatcher, GuildMemberStore, Menu, PermissionsBits, Text, Tooltip, useEffect, UserStore, useState, useStateFromStores } from "@webpack/common";
+import type { Guild } from "discord-types/general";
+
+import { cl, getPermissionDescription, getPermissionString } from "../utils";
+import { PermissionAllowedIcon, PermissionDefaultIcon, PermissionDeniedIcon } from "./icons";
+
+export const enum PermissionType {
+    Role = 0,
+    User = 1,
+    Owner = 2
+}
+
+export interface RoleOrUserPermission {
+    type: PermissionType;
+    id?: string;
+    permissions?: bigint;
+    overwriteAllow?: bigint;
+    overwriteDeny?: bigint;
+}
+
+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; }) {
+    permissions.sort((a, b) => a.type - b.type);
+
+    useStateFromStores(
+        [GuildMemberStore],
+        () => GuildMemberStore.getMemberIds(guild.id),
+        null,
+        (old, current) => old.length === current.length
+    );
+
+    useEffect(() => {
+        const usersToRequest = permissions
+            .filter(p => p.type === PermissionType.User && !GuildMemberStore.isMember(guild.id, p.id!))
+            .map(({ id }) => id);
+
+        FluxDispatcher.dispatch({
+            type: "GUILD_MEMBERS_REQUEST",
+            guildIds: [guild.id],
+            userIds: usersToRequest
+        });
+    }, []);
+
+    const [selectedItemIndex, selectItem] = useState(0);
+    const selectedItem = permissions[selectedItemIndex];
+
+    return (
+        <ModalRoot
+            {...modalProps}
+            size={ModalSize.LARGE}
+        >
+            <ModalHeader>
+                <Text className={cl("perms-title")} variant="heading-lg/semibold">{header} permissions:</Text>
+                <ModalCloseButton onClick={modalProps.onClose} />
+            </ModalHeader>
+
+            <ModalContent>
+                {!selectedItem && (
+                    <div className={cl("perms-no-perms")}>
+                        <Text variant="heading-lg/normal">No permissions to display!</Text>
+                    </div>
+                )}
+
+                {selectedItem && (
+                    <div className={cl("perms-container")}>
+                        <div className={cl("perms-list")}>
+                            {permissions.map((permission, index) => {
+                                const user = UserStore.getUser(permission.id ?? "");
+                                const role = guild.roles[permission.id ?? ""];
+
+                                return (
+                                    <button
+                                        className={cl("perms-list-item-btn")}
+                                        onClick={() => selectItem(index)}
+                                    >
+                                        <div
+                                            className={cl("perms-list-item", { "perms-list-item-active": selectedItemIndex === index })}
+                                            onContextMenu={e => {
+                                                if (permission.type === PermissionType.Role)
+                                                    ContextMenu.open(e, () => (
+                                                        <RoleContextMenu
+                                                            guild={guild}
+                                                            roleId={permission.id!}
+                                                            onClose={modalProps.onClose}
+                                                        />
+                                                    ));
+                                            }}
+                                        >
+                                            {(permission.type === PermissionType.Role || permission.type === PermissionType.Owner) && (
+                                                <span
+                                                    className={cl("perms-role-circle")}
+                                                    style={{ backgroundColor: role?.colorString ?? "var(--primary-300)" }}
+                                                />
+                                            )}
+                                            {permission.type === PermissionType.User && user !== undefined && (
+                                                <img
+                                                    className={cl("perms-user-img")}
+                                                    src={user.getAvatarURL(void 0, void 0, false)}
+                                                />
+                                            )}
+                                            <Text variant="text-md/normal">
+                                                {
+                                                    permission.type === PermissionType.Role
+                                                        ? role?.name || "Unknown Role"
+                                                        : permission.type === PermissionType.User
+                                                            ? user?.tag || "Unknown User"
+                                                            : (
+                                                                <Flex style={{ gap: "0.2em", justifyItems: "center" }}>
+                                                                    @owner
+                                                                    <OwnerCrownIcon
+                                                                        height={18}
+                                                                        width={18}
+                                                                        aria-hidden="true"
+                                                                    />
+                                                                </Flex>
+                                                            )
+                                                }
+                                            </Text>
+                                        </div>
+                                    </button>
+                                );
+                            })}
+                        </div>
+                        <div className={cl("perms-perms")}>
+                            {Object.entries(PermissionsBits).map(([permissionName, bit]) => (
+                                <div className={cl("perms-perms-item")}>
+                                    <div className={cl("perms-perms-item-icon")}>
+                                        {(() => {
+                                            const { permissions, overwriteAllow, overwriteDeny } = selectedItem;
+
+                                            if (permissions)
+                                                return (permissions & bit) === bit
+                                                    ? PermissionAllowedIcon()
+                                                    : PermissionDeniedIcon();
+
+                                            if (overwriteAllow && (overwriteAllow & bit) === bit)
+                                                return PermissionAllowedIcon();
+                                            if (overwriteDeny && (overwriteDeny & bit) === bit)
+                                                return PermissionDeniedIcon();
+
+                                            return PermissionDefaultIcon();
+                                        })()}
+                                    </div>
+                                    <Text variant="text-md/normal">{getPermissionString(permissionName)}</Text>
+
+                                    <Tooltip text={getPermissionDescription(permissionName) || "No Description"}>
+                                        {props => <InfoIcon {...props} />}
+                                    </Tooltip>
+                                </div>
+                            ))}
+                        </div>
+                    </div>
+                )}
+            </ModalContent>
+        </ModalRoot >
+    );
+}
+
+function RoleContextMenu({ guild, roleId, onClose }: { guild: Guild; roleId: string; onClose: () => void; }) {
+    return (
+        <Menu.Menu
+            navId={cl("role-context-menu")}
+            onClose={ContextMenu.close}
+            aria-label="Role Options"
+        >
+            <Menu.MenuItem
+                id="vc-pw-view-as-role"
+                label="View As Role"
+                action={() => {
+                    const role = guild.roles[roleId];
+                    if (!role) return;
+
+                    onClose();
+
+                    FluxDispatcher.dispatch({
+                        type: "IMPERSONATE_UPDATE",
+                        guildId: guild.id,
+                        data: {
+                            type: "ROLES",
+                            roles: {
+                                [roleId]: role
+                            }
+                        }
+                    });
+                }}
+            />
+        </Menu.Menu>
+    );
+}
+
+const RolesAndUsersPermissions = ErrorBoundary.wrap(RolesAndUsersPermissionsComponent);
+
+export default openRolesAndUsersPermissionsModal;

src/plugins/permissionsViewer/components/UserPermissions.tsx

@@ -0,0 +1,175 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import ErrorBoundary from "@components/ErrorBoundary";
+import { proxyLazy } from "@utils/lazy";
+import { classes } from "@utils/misc";
+import { filters, findBulk } from "@webpack";
+import { i18n, PermissionsBits, Text, Tooltip, useMemo, UserStore, useState } from "@webpack/common";
+import type { Guild, GuildMember } from "discord-types/general";
+
+import { settings } from "..";
+import { cl, getPermissionString, getSortedRoles, sortUserRoles } from "../utils";
+import openRolesAndUsersPermissionsModal, { PermissionType, type RoleOrUserPermission } from "./RolesAndUsersPermissions";
+
+interface UserPermission {
+    permission: string;
+    roleColor: string;
+    rolePosition: number;
+}
+
+type UserPermissions = Array<UserPermission>;
+
+const Classes = proxyLazy(() => {
+    const modules = findBulk(
+        filters.byProps("roles", "rolePill", "rolePillBorder"),
+        filters.byProps("roleCircle", "dotBorderBase", "dotBorderColor"),
+        filters.byProps("roleNameOverflow", "root", "roleName", "roleRemoveButton")
+    );
+
+    return Object.assign({}, ...modules);
+}) 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>;
+
+function UserPermissionsComponent({ guild, guildMember }: { guild: Guild; guildMember: GuildMember; }) {
+    const [viewPermissions, setViewPermissions] = useState(settings.store.defaultPermissionsDropdownState);
+
+    const [rolePermissions, userPermissions] = useMemo(() => {
+        const userPermissions: UserPermissions = [];
+
+        const userRoles = getSortedRoles(guild, guildMember);
+
+        const rolePermissions: Array<RoleOrUserPermission> = userRoles.map(role => ({
+            type: PermissionType.Role,
+            ...role
+        }));
+
+        if (guild.ownerId === guildMember.userId) {
+            rolePermissions.push({
+                type: PermissionType.Owner,
+                permissions: Object.values(PermissionsBits).reduce((prev, curr) => prev | curr, 0n)
+            });
+
+            const OWNER = i18n.Messages.GUILD_OWNER || "Server Owner";
+            userPermissions.push({
+                permission: OWNER,
+                roleColor: "var(--primary-300)",
+                rolePosition: Infinity
+            });
+        }
+
+        sortUserRoles(userRoles);
+
+        for (const [permission, bit] of Object.entries(PermissionsBits)) {
+            for (const { permissions, colorString, position, name } of userRoles) {
+                if ((permissions & bit) === bit) {
+                    userPermissions.push({
+                        permission: getPermissionString(permission),
+                        roleColor: colorString || "var(--primary-300)",
+                        rolePosition: position
+                    });
+
+                    break;
+                }
+            }
+        }
+
+        userPermissions.sort((a, b) => b.rolePosition - a.rolePosition);
+
+        return [rolePermissions, userPermissions];
+    }, []);
+
+    const { root, role, roleRemoveButton, roleNameOverflow, roles, rolePill, rolePillBorder, roleCircle, roleName } = Classes;
+
+    return (
+        <div>
+            <div className={cl("userperms-title-container")}>
+                <Text className={cl("userperms-title")} variant="eyebrow">Permissions</Text>
+
+                <div>
+                    <Tooltip text="Role Details">
+                        {tooltipProps => (
+                            <button
+                                {...tooltipProps}
+                                className={cl("userperms-permdetails-btn")}
+                                onClick={() =>
+                                    openRolesAndUsersPermissionsModal(
+                                        rolePermissions,
+                                        guild,
+                                        guildMember.nick || UserStore.getUser(guildMember.userId).username
+                                    )
+                                }
+                            >
+                                <svg
+                                    width="24"
+                                    height="24"
+                                    viewBox="0 0 24 24"
+                                >
+                                    <path fill="var(--text-normal)" d="M7 12.001C7 10.8964 6.10457 10.001 5 10.001C3.89543 10.001 3 10.8964 3 12.001C3 13.1055 3.89543 14.001 5 14.001C6.10457 14.001 7 13.1055 7 12.001ZM14 12.001C14 10.8964 13.1046 10.001 12 10.001C10.8954 10.001 10 10.8964 10 12.001C10 13.1055 10.8954 14.001 12 14.001C13.1046 14.001 14 13.1055 14 12.001ZM19 10.001C20.1046 10.001 21 10.8964 21 12.001C21 13.1055 20.1046 14.001 19 14.001C17.8954 14.001 17 13.1055 17 12.001C17 10.8964 17.8954 10.001 19 10.001Z" />
+                                </svg>
+                            </button>
+                        )}
+                    </Tooltip>
+
+                    <Tooltip text={viewPermissions ? "Hide Permissions" : "View Permissions"}>
+                        {tooltipProps => (
+                            <button
+                                {...tooltipProps}
+                                className={cl("userperms-toggleperms-btn")}
+                                onClick={() => setViewPermissions(v => !v)}
+                            >
+                                <svg
+                                    width="24"
+                                    height="24"
+                                    viewBox="0 0 24 24"
+                                    transform={viewPermissions ? "scale(1 -1)" : "scale(1 1)"}
+                                >
+                                    <path fill="var(--text-normal)" d="M16.59 8.59003L12 13.17L7.41 8.59003L6 10L12 16L18 10L16.59 8.59003Z" />
+                                </svg>
+                            </button>
+                        )}
+                    </Tooltip>
+                </div>
+            </div>
+
+            {viewPermissions && userPermissions.length > 0 && (
+                <div className={classes(root, roles)}>
+                    {userPermissions.map(({ permission, roleColor }) => (
+                        <div className={classes(role, rolePill, rolePillBorder)}>
+                            <div className={roleRemoveButton}>
+                                <span
+                                    className={roleCircle}
+                                    style={{ backgroundColor: roleColor }}
+                                />
+                            </div>
+                            <div className={roleName}>
+                                <Text
+                                    className={roleNameOverflow}
+                                    variant="text-xs/medium"
+                                >
+                                    {permission}
+                                </Text>
+                            </div>
+                        </div>
+                    ))}
+                </div>
+            )}
+        </div>
+    );
+}
+
+export default ErrorBoundary.wrap(UserPermissionsComponent, { noop: true });

src/plugins/permissionsViewer/components/icons.tsx

@@ -0,0 +1,58 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+export function PermissionDeniedIcon() {
+    return (
+        <svg
+            height="24"
+            width="24"
+            viewBox="0 0 24 24"
+        >
+            <title>Denied</title>
+            <path fill="var(--status-danger)" d="M18.4 4L12 10.4L5.6 4L4 5.6L10.4 12L4 18.4L5.6 20L12 13.6L18.4 20L20 18.4L13.6 12L20 5.6L18.4 4Z" />
+        </svg>
+    );
+}
+
+export function PermissionAllowedIcon() {
+    return (
+        <svg
+            height="24"
+            width="24"
+            viewBox="0 0 24 24"
+        >
+            <title>Allowed</title>
+            <path fill="var(--text-positive)" d="M8.99991 16.17L4.82991 12L3.40991 13.41L8.99991 19L20.9999 7.00003L19.5899 5.59003L8.99991 16.17ZZ" />
+        </svg>
+    );
+}
+
+export function PermissionDefaultIcon() {
+    return (
+        <svg
+            height="24"
+            width="24"
+            viewBox="0 0 16 16"
+        >
+            <g>
+                <title>Not overwritten</title>
+                <polygon fill="var(--text-normal)" points="12 2.32 10.513 2 4 13.68 5.487 14" />
+            </g>
+        </svg>
+    );
+}

src/plugins/permissionsViewer/index.tsx

@@ -0,0 +1,180 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import "./styles.css";
+
+import { addContextMenuPatch, findGroupChildrenByChildId, NavContextMenuPatchCallback, removeContextMenuPatch } from "@api/ContextMenu";
+import { definePluginSettings } from "@api/Settings";
+import { Devs } from "@utils/constants";
+import definePlugin, { OptionType } from "@utils/types";
+import { ChannelStore, GuildMemberStore, GuildStore, Menu, PermissionsBits, UserStore } from "@webpack/common";
+import type { Guild, GuildMember } from "discord-types/general";
+
+import openRolesAndUsersPermissionsModal, { PermissionType, RoleOrUserPermission } from "./components/RolesAndUsersPermissions";
+import UserPermissions from "./components/UserPermissions";
+import { getSortedRoles } from "./utils";
+
+export const enum PermissionsSortOrder {
+    HighestRole,
+    LowestRole
+}
+
+const enum MenuItemParentType {
+    User,
+    Channel,
+    Guild
+}
+
+export const settings = definePluginSettings({
+    permissionsSortOrder: {
+        description: "The sort method used for defining which role grants an user a certain permission",
+        type: OptionType.SELECT,
+        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,
+    }
+});
+
+function MenuItem(guildId: string, id?: string, type?: MenuItemParentType) {
+    return (
+        <Menu.MenuItem
+            id="perm-viewer-permissions"
+            label="Permissions"
+            action={() => {
+                const guild = GuildStore.getGuild(guildId);
+
+                let permissions: RoleOrUserPermission[];
+                let header: string;
+
+                switch (type) {
+                    case MenuItemParentType.User: {
+                        const member = GuildMemberStore.getMember(guildId, id!);
+
+                        permissions = getSortedRoles(guild, member)
+                            .map(role => ({
+                                type: PermissionType.Role,
+                                ...role
+                            }));
+
+                        if (guild.ownerId === id) {
+                            permissions.push({
+                                type: PermissionType.Owner,
+                                permissions: Object.values(PermissionsBits).reduce((prev, curr) => prev | curr, 0n)
+                            });
+                        }
+
+                        header = member.nick ?? UserStore.getUser(member.userId).username;
+
+                        break;
+                    }
+
+                    case MenuItemParentType.Channel: {
+                        const channel = ChannelStore.getChannel(id!);
+
+                        permissions = Object.values(channel.permissionOverwrites).map(({ id, allow, deny, type }) => ({
+                            type: type as PermissionType,
+                            id,
+                            overwriteAllow: allow,
+                            overwriteDeny: deny
+                        }));
+
+                        header = channel.name;
+
+                        break;
+                    }
+
+                    default: {
+                        permissions = Object.values(guild.roles).map(role => ({
+                            type: PermissionType.Role,
+                            ...role
+                        }));
+
+                        header = guild.name;
+
+                        break;
+                    }
+                }
+
+                openRolesAndUsersPermissionsModal(permissions, guild, header);
+            }}
+        />
+    );
+}
+
+function makeContextMenuPatch(childId: string, type?: MenuItemParentType): NavContextMenuPatchCallback {
+    return (children, props) => () => {
+        if (!props) return children;
+
+        const group = findGroupChildrenByChildId(childId, children);
+
+        if (group) {
+            switch (type) {
+                case MenuItemParentType.User:
+                    group.push(MenuItem(props.guildId, props.user.id, type));
+                    break;
+                case MenuItemParentType.Channel:
+                    group.push(MenuItem(props.guild.id, props.channel.id, type));
+                    break;
+                case MenuItemParentType.Guild:
+                    group.push(MenuItem(props.guild.id));
+                    break;
+            }
+        }
+    };
+}
+
+export default definePlugin({
+    name: "PermissionsViewer",
+    description: "View the permissions a user or channel has, and the roles of a server",
+    authors: [Devs.Nuckyz, Devs.Ven],
+    settings,
+
+    patches: [
+        {
+            find: ".Messages.BOT_PROFILE_SLASH_COMMANDS",
+            replacement: {
+                match: /showBorder:.{0,60}}\),(?<=guild:(\i),guildMember:(\i),.+?)/,
+                replace: (m, guild, guildMember) => `${m}$self.UserPermissions(${guild},${guildMember}),`
+            }
+        }
+    ],
+
+    UserPermissions: (guild: Guild, guildMember: GuildMember) => <UserPermissions guild={guild} guildMember={guildMember} />,
+
+    userContextMenuPatch: makeContextMenuPatch("roles", MenuItemParentType.User),
+    channelContextMenuPatch: makeContextMenuPatch("mute-channel", MenuItemParentType.Channel),
+    guildContextMenuPatch: makeContextMenuPatch("privacy", MenuItemParentType.Guild),
+
+    start() {
+        addContextMenuPatch("user-context", this.userContextMenuPatch);
+        addContextMenuPatch("channel-context", this.channelContextMenuPatch);
+        addContextMenuPatch("guild-context", this.guildContextMenuPatch);
+    },
+
+    stop() {
+        removeContextMenuPatch("user-context", this.userContextMenuPatch);
+        removeContextMenuPatch("channel-context", this.channelContextMenuPatch);
+        removeContextMenuPatch("guild-context", this.guildContextMenuPatch);
+    },
+});

src/plugins/permissionsViewer/styles.css

@@ -0,0 +1,128 @@
+/* User Permissions Component */
+
+.vc-permviewer-userperms-title-container {
+    display: flex;
+    justify-content: space-between;
+}
+
+.vc-permviewer-userperms-title {
+    margin-top: 10px;
+    margin-bottom: 6px;
+}
+
+.vc-permviewer-userperms-permdetails-btn {
+    all: unset;
+    cursor: pointer;
+}
+
+.vc-permviewer-userperms-toggleperms-btn {
+    all: unset;
+    cursor: pointer;
+}
+
+/*  RolesAndUsersPermissions Component */
+
+.vc-permviewer-perms-title {
+    flex-grow: 1;
+}
+
+.vc-permviewer-perms-no-perms {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+}
+
+.vc-permviewer-perms-container {
+    display: grid;
+    grid-template-columns: 1fr 2fr;
+    grid-template-areas: "list permissions";
+    padding: 16px 0;
+}
+
+.vc-permviewer-perms-list {
+    grid-area: list;
+    display: flex;
+    flex-direction: column;
+    border-right: 2px solid var(--background-modifier-active);
+}
+
+.vc-permviewer-perms-list-item-btn {
+    all: unset;
+    cursor: pointer;
+}
+
+.vc-permviewer-perms-list-item {
+    display: flex;
+    align-items: center;
+    padding: 8px 5px;
+    cursor: pointer;
+    width: 165px;
+}
+
+.vc-permviewer-perms-list-item > div {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+.vc-permviewer-perms-list-item-active {
+    background-color: var(--background-modifier-selected);
+    border-radius: 5px;
+}
+
+.vc-permviewer-perms-role-circle {
+    border-radius: 50%;
+    width: 12px;
+    height: 12px;
+    margin-left: 3px;
+    margin-right: 11px;
+    flex-shrink: 0;
+}
+
+.vc-permviewer-perms-user-img {
+    border-radius: 50%;
+    width: 20px;
+    height: 20px;
+    margin-right: 6px;
+}
+
+.vc-permviewer-perms-perms {
+    grid-area: permissions;
+    display: flex;
+    flex-direction: column;
+    margin-left: 5px;
+}
+
+.vc-permviewer-perms-perms-item {
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding: 10px;
+    border-bottom: 2px solid var(--background-modifier-active);
+}
+
+.vc-permviewer-perms-perms-item:last-child {
+    border: 0;
+}
+
+.vc-permviewer-perms-perms-item-icon {
+    border: 1px solid var(--background-modifier-selected);
+    width: 25px;
+    height: 25px;
+    margin-right: 5px;
+}
+
+.vc-permviewer-perms-perms-item .vc-info-icon {
+    color: var(--interactive-muted);
+    cursor: pointer;
+    position: absolute;
+    right: 0;
+    scale: 0.9;
+}
+
+.vc-permviewer-perms-perms-item .vc-info-icon:hover {
+    color: var(--interactive-active);
+}

src/plugins/permissionsViewer/utils.ts

@@ -0,0 +1,84 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2023 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { classNameFactory } from "@api/Styles";
+import { wordsToTitle } from "@utils/text";
+import { i18n, Parser } from "@webpack/common";
+import { Guild, GuildMember, Role } from "discord-types/general";
+import type { ReactNode } from "react";
+
+import { PermissionsSortOrder, settings } from ".";
+
+export const cl = classNameFactory("vc-permviewer-");
+
+function formatPermissionWithoutMatchingString(permission: string) {
+    return wordsToTitle(permission.toLowerCase().split("_"));
+}
+
+// because discord is unable to be consistent with their names
+const PermissionKeyMap = {
+    MANAGE_GUILD: "MANAGE_SERVER",
+    MANAGE_GUILD_EXPRESSIONS: "MANAGE_EXPRESSIONS",
+    CREATE_GUILD_EXPRESSIONS: "CREATE_EXPRESSIONS",
+    MODERATE_MEMBERS: "MODERATE_MEMBER", // HELLOOOO ??????
+    STREAM: "VIDEO",
+    SEND_VOICE_MESSAGES: "ROLE_PERMISSIONS_SEND_VOICE_MESSAGE",
+} as const;
+
+export function getPermissionString(permission: string) {
+    permission = PermissionKeyMap[permission] || permission;
+
+    return i18n.Messages[permission] ||
+        // shouldn't get here but just in case
+        formatPermissionWithoutMatchingString(permission);
+}
+
+export function getPermissionDescription(permission: string): ReactNode {
+    // DISCORD PLEEEEEEEEAAAAASE IM BEGGING YOU :(
+    if (permission === "USE_APPLICATION_COMMANDS")
+        permission = "USE_APPLICATION_COMMANDS_GUILD";
+    else if (permission === "SEND_VOICE_MESSAGES")
+        permission = "SEND_VOICE_MESSAGE_GUILD";
+    else if (permission !== "STREAM")
+        permission = PermissionKeyMap[permission] || permission;
+
+    const msg = i18n.Messages[`ROLE_PERMISSIONS_${permission}_DESCRIPTION`] as any;
+    if (msg?.hasMarkdown)
+        return Parser.parse(msg.message);
+
+    if (typeof msg === "string") return msg;
+
+    return "";
+}
+
+export function getSortedRoles({ roles, id }: Guild, member: GuildMember) {
+    return [...member.roles, id]
+        .map(id => roles[id])
+        .sort((a, b) => b.position - a.position);
+}
+
+export function sortUserRoles(roles: Role[]) {
+    switch (settings.store.permissionsSortOrder) {
+        case PermissionsSortOrder.HighestRole:
+            return roles.sort((a, b) => b.position - a.position);
+        case PermissionsSortOrder.LowestRole:
+            return roles.sort((a, b) => a.position - b.position);
+        default:
+            return roles;
+    }
+}

src/plugins/platformIndicators.tsx

@@ -114,8 +114,8 @@ const PlatformIndicator = ({ user, wantMargin = true }: { user: User; wantMargin
                 verticalAlign: "top",
                 position: "relative",
                 top: wantMargin ? 1 : 0,
-                padding: !wantMargin ? 2 : 0,
+                padding: !wantMargin ? 1 : 0,
-                gap: 4
+                gap: 2
             }}
 
         >
@@ -160,7 +160,7 @@ const indicatorLocations = {
 export default definePlugin({
     name: "PlatformIndicators",
     description: "Adds platform indicators (Desktop, Mobile, Web...) to users",
-    authors: [Devs.kemo, Devs.TheSun, Devs.Nuckyz],
+    authors: [Devs.kemo, Devs.TheSun, Devs.Nuckyz, Devs.Ven],
     dependencies: ["MessageDecorationsAPI", "MemberListDecoratorsAPI"],
 
     start() {

src/plugins/reverseImageSearch.tsx

@@ -17,6 +17,8 @@
 */
 
 import { addContextMenuPatch, findGroupChildrenByChildId, NavContextMenuPatchCallback, removeContextMenuPatch } from "@api/ContextMenu";
+import { Flex } from "@components/Flex";
+import { OpenExternalIcon } from "@components/Icons";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
 import { Menu } from "@webpack/common";
@@ -28,7 +30,7 @@ const Engines = {
     IQDB: "https://iqdb.org/?url=",
     TinEye: "https://www.tineye.com/search?url=",
     ImgOps: "https://imgops.com/start?url="
-};
+} as const;
 
 function search(src: string, engine: string) {
     open(engine + encodeURIComponent(src), "_blank");
@@ -50,13 +52,28 @@ const imageContextMenuPatch: NavContextMenuPatchCallback = (children, props) =>
                 key="search-image"
                 id="search-image"
             >
-                {Object.keys(Engines).map(engine => {
+                {Object.keys(Engines).map((engine, i) => {
                     const key = "search-image-" + engine;
                     return (
                         <Menu.MenuItem
                             key={key}
                             id={key}
-                            label={engine}
+                            label={
+                                <Flex style={{ alignItems: "center", gap: "0.5em" }}>
+                                    <img
+                                        style={{
+                                            borderRadius: i >= 3 // Do not round Google, Yandex & SauceNAO
+                                                ? "50%"
+                                                : void 0
+                                        }}
+                                        aria-hidden="true"
+                                        height={16}
+                                        width={16}
+                                        src={new URL("/favicon.ico", Engines[engine]).toString().replace("lens.", "")}
+                                    />
+                                    {engine}
+                                </Flex>
+                            }
                             action={() => search(src, Engines[engine])}
                         />
                     );
@@ -64,7 +81,12 @@ const imageContextMenuPatch: NavContextMenuPatchCallback = (children, props) =>
                 <Menu.MenuItem
                     key="search-image-all"
                     id="search-image-all"
-                    label="All"
+                    label={
+                        <Flex style={{ alignItems: "center", gap: "0.5em" }}>
+                            <OpenExternalIcon height={16} width={16} />
+                            All
+                        </Flex>
+                    }
                     action={() => Object.values(Engines).forEach(e => search(src, e))}
                 />
             </Menu.MenuItem>

src/plugins/reviewDB/Utils/Utils.tsx

@@ -44,20 +44,19 @@ export function authorize(callback?: any) {
             {...props}
             scopes={["identify"]}
             responseType="code"
-            redirectUri="https://manti.vendicated.dev/URauth"
+            redirectUri="https://manti.vendicated.dev/api/reviewdb/auth"
             permissions={0n}
             clientId="915703782174752809"
             cancelCompletesFlow={false}
             callback={async (u: string) => {
                 try {
                     const url = new URL(u);
-                    url.searchParams.append("returnType", "json");
                     url.searchParams.append("clientMod", "vencord");
                     const res = await fetch(url, {
                         headers: new Headers({ Accept: "application/json" })
                     });
-                    const { token, status } = await res.json();
+                    const { token, success } = await res.json();
-                    if (status === 0) {
+                    if (success) {
                         Settings.plugins.ReviewDB.token = token;
                         showToast("Successfully logged in!");
                         callback?.();
@@ -65,7 +64,7 @@ export function authorize(callback?: any) {
                         showToast("An Error occurred while logging in.");
                     }
                 } catch (e) {
-                    new Logger("ReviewDB").error("Failed to authorise", e);
+                    new Logger("ReviewDB").error("Failed to authorize", e);
                 }
             }}
         />
@@ -86,5 +85,5 @@ export function showToast(text: string) {
 export const sleep = (ms: number) => new Promise(r => setTimeout(r, ms));
 
 export function canDeleteReview(review: Review, userId: string) {
-    if (review.sender.discordID === userId || Settings.plugins.ReviewDB.userType === UserType.Admin) return true;
+    if (review.sender.discordID === userId || Settings.plugins.ReviewDB.user?.type === UserType.Admin) return true;
 }

src/plugins/reviewDB/components/ReviewComponent.tsx

@@ -34,19 +34,17 @@ export default LazyComponent(() => {
     const [
         { cozyMessage, buttons, message, groupStart },
         { container, isHeader },
-        { avatar, clickable, username, messageContent, wrapper, cozy, timestampInline, timestamp },
+        { avatar, clickable, username, messageContent, wrapper, cozy },
-        { contents },
         buttonClasses,
-        { defaultColor }
     ] = findBulk(
         p("cozyMessage"),
         p("container", "isHeader"),
         p("avatar", "zalgo"),
-        p("contents"),
         p("button", "wrapper", "selected"),
-        p("defaultColor")
     );
 
+    const dateFormat = new Intl.DateTimeFormat();
+
     return function ReviewComponent({ review, refetch }: { review: Review; refetch(): void; }) {
         function openModal() {
             openUserProfileModal(review.sender.discordID);
@@ -89,7 +87,7 @@ export default LazyComponent(() => {
                 }
             }>
 
-                <div className={contents} style={{ paddingLeft: "0px" }}>
+                <div>
                     <img
                         className={classes(avatar, clickable)}
                         onClick={openModal}
@@ -107,16 +105,14 @@ export default LazyComponent(() => {
 
                     {
                         !Settings.plugins.ReviewDB.hideTimestamps && (
-                            <Timestamp
+                            <Timestamp timestamp={moment(review.timestamp * 1000)} >
-                                timestamp={moment(review.timestamp * 1000)}
+                                {dateFormat.format(review.timestamp * 1000)}
-                                compact={true}
+                            </Timestamp>)
-                            />
-                        )
                     }
 
                     <p
-                        className={classes(messageContent, defaultColor)}
+                        className={classes(messageContent)}
-                        style={{ fontSize: 15, marginTop: 4 }}
+                        style={{ fontSize: 15, marginTop: 4, color: "var(--text-normal)" }}
                     >
                         {review.comment}
                     </p>

src/plugins/reviewDB/components/ReviewsView.tsx

@@ -19,7 +19,7 @@
 import { Settings } from "@api/Settings";
 import { classes } from "@utils/misc";
 import { useAwaiter } from "@utils/react";
-import { findLazy } from "@webpack";
+import { findByPropsLazy } from "@webpack";
 import { Forms, React, Text, UserStore } from "@webpack/common";
 import type { KeyboardEvent } from "react";
 
@@ -27,7 +27,7 @@ import { addReview, getReviews } from "../Utils/ReviewDBAPI";
 import { authorize, showToast } from "../Utils/Utils";
 import ReviewComponent from "./ReviewComponent";
 
-const Classes = findLazy(m => typeof m.textarea === "string");
+const Classes = findByPropsLazy("inputDefault", "editable");
 
 export default function ReviewsView({ userId }: { userId: string; }) {
     const { token } = Settings.plugins.ReviewDB;
@@ -65,7 +65,7 @@ export default function ReviewsView({ userId }: { userId: string; }) {
                 tag="h2"
                 variant="eyebrow"
                 style={{
-                    marginBottom: "12px",
+                    marginBottom: "8px",
                     color: "var(--header-primary)"
                 }}
             >
@@ -79,13 +79,17 @@ export default function ReviewsView({ userId }: { userId: string; }) {
                 />
             )}
             {reviews?.length === 0 && (
-                <Forms.FormText style={{ padding: "12px", paddingTop: "0px", paddingLeft: "4px", fontWeight: "bold", fontStyle: "italic" }}>
+                <Forms.FormText style={{ paddingRight: "12px", paddingTop: "0px", paddingLeft: "0px", paddingBottom: "4px", fontWeight: "bold", fontStyle: "italic" }}>
                     Looks like nobody reviewed this user yet. You could be the first!
                 </Forms.FormText>
             )}
             <textarea
-                className={classes(Classes.textarea.replace("textarea", ""), "enter-comment")}
+                className={classes(Classes.inputDefault, "enter-comment")}
-                // this produces something like '-_59yqs ...' but since no class exists with that name its fine
+                onKeyDownCapture={e => {
+                    if (e.key === "Enter") {
+                        e.preventDefault(); // prevent newlines
+                    }
+                }}
                 placeholder={
                     token
                         ? (reviews?.some(r => r.sender.discordID === UserStore.getCurrentUser().id)
@@ -106,6 +110,9 @@ export default function ReviewsView({ userId }: { userId: string; }) {
                     resize: "none",
                     marginBottom: "12px",
                     overflow: "hidden",
+                    background: "transparent",
+                    border: "1px solid var(--profile-message-input-border-color)",
+                    fontSize: "14px",
                 }}
             />
         </div>

src/plugins/reviewDB/entities/User.ts

@@ -22,7 +22,23 @@ export const enum UserType {
     Admin = 1
 }
 
-export interface ReviewDBUser {
+export interface BanInfo {
-    lastReviewID: number,
+    id: string;
-    type: UserType;
+    discordID: string;
+    reviewID: number;
+    reviewContent: string;
+    banEndDate: string;
+}
+
+export interface ReviewDBUser {
+    ID: number
+    discordID: string
+    username: string
+    profilePhoto: string
+    clientMod: string
+    warningCount: number
+    badges: any[]
+    banInfo: BanInfo | null
+    lastReviewID: number
+    type: UserType
 }

src/plugins/reviewDB/index.tsx

@@ -22,10 +22,11 @@ import { Settings } from "@api/Settings";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
-import { Button } from "@webpack/common";
+import { Alerts, Button } from "@webpack/common";
 import { User } from "discord-types/general";
 
 import ReviewsView from "./components/ReviewsView";
+import { UserType } from "./entities/User";
 import { getCurrentUserInfo } from "./Utils/ReviewDBAPI";
 import { authorize, showToast } from "./Utils/Utils";
 
@@ -47,10 +48,10 @@ export default definePlugin({
     options: {
         authorize: {
             type: OptionType.COMPONENT,
-            description: "Authorise with ReviewDB",
+            description: "Authorize with ReviewDB",
             component: () => (
                 <Button onClick={authorize}>
-                    Authorise with ReviewDB
+                    Authorize with ReviewDB
                 </Button>
             )
         },
@@ -68,7 +69,29 @@ export default definePlugin({
             type: OptionType.BOOLEAN,
             description: "Hide timestamps on reviews",
             default: false,
-        }
+        },
+        website: {
+            type: OptionType.COMPONENT,
+            description: "ReviewDB website",
+            component: () => (
+                <Button onClick={() => {
+                    window.open("https://reviewdb.mantikafasi.dev");
+                }}>
+                    ReviewDB website
+                </Button>
+            )
+        },
+        supportServer: {
+            type: OptionType.COMPONENT,
+            description: "ReviewDB Support Server",
+            component: () => (
+                <Button onClick={() => {
+                    window.open("https://discord.gg/eWPBSbvznt");
+                }}>
+                    ReviewDB Support Server
+                </Button>
+            )
+        },
     },
 
     async start() {
@@ -82,7 +105,34 @@ export default definePlugin({
                 if (user.lastReviewID !== 0)
                     showToast("You have new reviews on your profile!");
             }
-            settings.userType = user.type;
+
+            if (user.banInfo) {
+                const endDate = new Date(user.banInfo.banEndDate);
+                if (endDate > new Date() && (settings.user?.banInfo?.banEndDate ?? 0) < endDate) {
+
+                    Alerts.show({
+                        title: "You have been banned from ReviewDB",
+                        body: <>
+                            <p>
+                                You are banned from ReviewDB {(user.type === UserType.Banned) ? "permanently" : "until " + endDate.toLocaleString()}
+                            </p>
+                            <p>
+                                Offending Review: {user.banInfo.reviewContent}
+                            </p>
+                            <p>
+                                Continued offenses will result in a permanent ban.
+                            </p>
+                        </>,
+                        cancelText: "Appeal",
+                        confirmText: "Ok",
+                        onCancel: () => {
+                            window.open("https://forms.gle/Thj3rDYaMdKoMMuq6");
+                        }
+                    });
+                }
+            }
+
+            settings.user = user;
         }, 4000);
     },
 

src/plugins/spotifyControls/PlayerComponent.tsx

@@ -20,6 +20,7 @@ import "./spotifyStyles.css";
 
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
+import { ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons";
 import { Link } from "@components/Link";
 import { debounce } from "@utils/debounce";
 import { classes, copyWithToast } from "@utils/misc";
@@ -88,12 +89,14 @@ function CopyContextMenu({ name, path }: { name: string; path: string; }) {
                 id={copyId}
                 label={`Copy ${name} Link`}
                 action={() => copyWithToast("https://open.spotify.com" + path)}
+                icon={LinkIcon}
             />
             <Menu.MenuItem
                 key={openId}
                 id={openId}
                 label={`Open ${name} in Spotify`}
                 action={() => SpotifyStore.openExternal(path)}
+                icon={OpenExternalIcon}
             />
         </Menu.Menu>
     );
@@ -221,6 +224,7 @@ function AlbumContextMenu({ track }: { track: Track; }) {
                 id="open-album"
                 label="Open Album"
                 action={() => SpotifyStore.openExternal(`/album/${track.album.id}`)}
+                icon={OpenExternalIcon}
             />
             <Menu.MenuItem
                 key="view-cover"
@@ -228,6 +232,7 @@ function AlbumContextMenu({ track }: { track: Track; }) {
                 label="View Album Cover"
                 // trolley
                 action={() => (Vencord.Plugins.plugins.ViewIcons as any).openImage(track.album.image.url)}
+                icon={ImageIcon}
             />
             <Menu.MenuControlItem
                 id="spotify-volume"

src/plugins/viewIcons.tsx

@@ -18,6 +18,7 @@
 
 import { addContextMenuPatch, NavContextMenuPatchCallback, removeContextMenuPatch } from "@api/ContextMenu";
 import { definePluginSettings } from "@api/Settings";
+import { ImageIcon } from "@components/Icons";
 import { Devs } from "@utils/constants";
 import { ModalRoot, ModalSize, openModal } from "@utils/modal";
 import { LazyComponent } from "@utils/react";
@@ -90,6 +91,7 @@ const UserContext: NavContextMenuPatchCallback = (children, { user, guildId }: U
                 id="view-avatar"
                 label="View Avatar"
                 action={() => openImage(BannerStore.getUserAvatarURL(user, true, 512))}
+                icon={ImageIcon}
             />
             {memberAvatar && (
                 <Menu.MenuItem
@@ -100,6 +102,7 @@ const UserContext: NavContextMenuPatchCallback = (children, { user, guildId }: U
                         avatar: memberAvatar,
                         guildId
                     }, true))}
+                    icon={ImageIcon}
                 />
             )}
         </Menu.MenuGroup>
@@ -123,6 +126,7 @@ const GuildContext: NavContextMenuPatchCallback = (children, { guild: { id, icon
                             canAnimate: true
                         }))
                     }
+                    icon={ImageIcon}
                 />
             ) : null}
             {banner ? (
@@ -135,6 +139,7 @@ const GuildContext: NavContextMenuPatchCallback = (children, { guild: { id, icon
                             banner,
                         }, true))
                     }
+                    icon={ImageIcon}
                 />
             ) : null}
         </Menu.MenuGroup>

src/utils/constants.ts

@@ -290,5 +290,9 @@ export const Devs = /* #__PURE__*/ Object.freeze({
     CatNoir: {
         name: "CatNoir",
         id: 260371016348336128n
-    }
+    },
+    outfoxxed: {
+        name: "outfoxxed",
+        id: 837425748435796060n
+    },
 });

src/webpack/common/types/menu.d.ts

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import type { ComponentType, CSSProperties, MouseEvent, PropsWithChildren, UIEvent } from "react";
+import type { ComponentType, CSSProperties, MouseEvent, PropsWithChildren, ReactNode, UIEvent } from "react";
 
 type RC<C> = ComponentType<PropsWithChildren<C & Record<string, any>>>;
 
@@ -35,11 +35,12 @@ export interface Menu {
     }>;
     MenuItem: RC<{
         id: string;
-        label: string;
+        label: ReactNode;
         action?(e: MouseEvent): void;
+        icon?: ComponentType<any>;
 
         color?: string;
-        render?: ComponentType;
+        render?: ComponentType<any>;
         onChildrenScroll?: Function;
         childRowHeight?: number;
         listClassName?: string;

src/webpack/common/types/utils.d.ts

@@ -85,6 +85,51 @@ export type RestAPI = Record<"delete" | "get" | "patch" | "post" | "put", (data:
     getAPIBaseURL(withVersion?: boolean): string;
 };
 
+export type Permissions = "CREATE_INSTANT_INVITE"
+    | "KICK_MEMBERS"
+    | "BAN_MEMBERS"
+    | "ADMINISTRATOR"
+    | "MANAGE_CHANNELS"
+    | "MANAGE_GUILD"
+    | "CHANGE_NICKNAME"
+    | "MANAGE_NICKNAMES"
+    | "MANAGE_ROLES"
+    | "MANAGE_WEBHOOKS"
+    | "MANAGE_GUILD_EXPRESSIONS"
+    | "VIEW_AUDIT_LOG"
+    | "VIEW_CHANNEL"
+    | "VIEW_GUILD_ANALYTICS"
+    | "VIEW_CREATOR_MONETIZATION_ANALYTICS"
+    | "MODERATE_MEMBERS"
+    | "SEND_MESSAGES"
+    | "SEND_TTS_MESSAGES"
+    | "MANAGE_MESSAGES"
+    | "EMBED_LINKS"
+    | "ATTACH_FILES"
+    | "READ_MESSAGE_HISTORY"
+    | "MENTION_EVERYONE"
+    | "USE_EXTERNAL_EMOJIS"
+    | "ADD_REACTIONS"
+    | "USE_APPLICATION_COMMANDS"
+    | "MANAGE_THREADS"
+    | "CREATE_PUBLIC_THREADS"
+    | "CREATE_PRIVATE_THREADS"
+    | "USE_EXTERNAL_STICKERS"
+    | "SEND_MESSAGES_IN_THREADS"
+    | "CONNECT"
+    | "SPEAK"
+    | "MUTE_MEMBERS"
+    | "DEAFEN_MEMBERS"
+    | "MOVE_MEMBERS"
+    | "USE_VAD"
+    | "PRIORITY_SPEAKER"
+    | "STREAM"
+    | "USE_EMBEDDED_ACTIVITIES"
+    | "REQUEST_TO_SPEAK"
+    | "MANAGE_EVENTS";
+
+export type PermissionsBits = Record<Permissions, bigint>;
+
 export interface Locale {
     name: string;
     value: string;

src/webpack/common/utils.ts

@@ -114,3 +114,5 @@ waitFor("parseTopic", m => Parser = m);
 
 export let SettingsRouter: any;
 waitFor(["open", "saveAccountChanges"], m => SettingsRouter = m);
+
+export const PermissionsBits: t.PermissionsBits = findLazy(m => typeof m.ADMINISTRATOR === "bigint");