Add AntiTessie plugin

src/api/NicknameIcons.tsx

@@ -1,40 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2025 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import ErrorBoundary from "@components/ErrorBoundary";
-import { Logger } from "@utils/Logger";
-import { ReactNode } from "react";
-
-export interface NicknameIconProps {
-    userId: string;
-}
-
-export type NicknameIconFactory = (props: NicknameIconProps) => ReactNode | Promise<ReactNode>;
-
-export interface NicknameIcon {
-    priority: number;
-    factory: NicknameIconFactory;
-}
-
-const nicknameIcons = new Map<string, NicknameIcon>();
-const logger = new Logger("NicknameIcons");
-
-export function addNicknameIcon(id: string, factory: NicknameIconFactory, priority = 0) {
-    return nicknameIcons.set(id, {
-        priority,
-        factory: ErrorBoundary.wrap(factory, { noop: true, onError: error => logger.error(`Failed to render ${id}`, error) })
-    });
-}
-
-export function removeNicknameIcon(id: string) {
-    return nicknameIcons.delete(id);
-}
-
-export function _renderIcons(props: NicknameIconProps) {
-    return Array.from(nicknameIcons)
-        .sort((a, b) => b[1].priority - a[1].priority)
-        .map(([id, { factory: NicknameIcon }]) => <NicknameIcon key={id} {...props} />);
-}

src/api/index.ts

@@ -27,7 +27,6 @@ import * as $MessageDecorations from "./MessageDecorations";
 import * as $MessageEventsAPI from "./MessageEvents";
 import * as $MessagePopover from "./MessagePopover";
 import * as $MessageUpdater from "./MessageUpdater";
-import * as $NicknameIcons from "./NicknameIcons";
 import * as $Notices from "./Notices";
 import * as $Notifications from "./Notifications";
 import * as $ServerList from "./ServerList";
@@ -123,8 +122,3 @@ export const MessageUpdater = $MessageUpdater;
  * An API allowing you to get an user setting
  */
 export const UserSettings = $UserSettings;
-
-/**
- * An API allowing you to add icons to the nickname, in profiles
- */
-export const NicknameIcons = $NicknameIcons;

src/plugins/_api/nicknameIcons.ts

@@ -1,23 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2025 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import { Devs } from "@utils/constants";
-import definePlugin from "@utils/types";
-
-export default definePlugin({
-    name: "NicknameIconsAPI",
-    description: "API to add icons to the nickname, in profiles",
-    authors: [Devs.Nuckyz],
-    patches: [
-        {
-            find: "#{intl::USER_PROFILE_LOAD_ERROR}",
-            replacement: {
-                match: /(\.fetchError.+?\?)null/,
-                replace: (_, rest) => `${rest}Vencord.Api.NicknameIcons._renderIcons(arguments[0])`
-            }
-        }
-    ]
-});

src/plugins/antiTessie/index.ts

@@ -0,0 +1,179 @@
+/*
+ * Vencord, a Discord client mod
+ * Copyright (c) 2025 Vendicated and contributors
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ */
+
+import { MessageExtra, MessageObject } from "@api/MessageEvents";
+import { Devs } from "@utils/constants";
+import { Logger } from "@utils/Logger";
+import definePlugin from "@utils/types";
+import { findLazy } from "@webpack";
+
+const TesseractLogger = new Logger("Tesseract", "#ff9e64");
+
+let worker!: Tesseract.Worker;
+function reduceBboxGreatest(acc: Tesseract.Bbox, cur: Tesseract.Bbox): Tesseract.Bbox {
+    return {
+        x0: Math.min(acc.x0, cur.x0),
+        x1: Math.max(acc.x1, cur.x1),
+        y0: Math.min(acc.y0, cur.y0),
+        y1: Math.max(acc.y1, cur.y1)
+    };
+}
+function findWordLocation(text: Tesseract.Block[], regex: RegExp): Tesseract.Bbox[] {
+    const locs: Tesseract.Bbox[] = [];
+    for (let i = 0; i < text.length; i++) {
+        const block = text[i];
+        if (block.text.match(regex)) {
+            const bl = locs.length;
+            for (let j = 0; j < block.paragraphs.length; j++) {
+                const paragraph = block.paragraphs[j];
+                if (paragraph.text.match(regex)) {
+                    const bl = locs.length;
+                    for (let k = 0; k < paragraph.lines.length; k++) {
+                        const line = paragraph.lines[k];
+                        if (line.text.match(regex)) {
+                            const bl = locs.length;
+                            for (let l = 0; l < line.words.length; l++) {
+                                const word = line.words[l];
+                                let matches: RegExpExecArray[];
+                                if ((matches = [...word.text.matchAll(new RegExp(regex, `${regex.flags.replace("g", "")}g`))]).length) {
+                                    for (const match of matches) {
+                                        const syms = word.symbols
+                                            .slice(match.index, match.index + match[0].length)
+                                            .map(x => x.bbox)
+                                            .reduce(reduceBboxGreatest);
+                                        locs.push(syms);
+                                    }
+                                }
+                            }
+                            if (locs.length === bl) {
+                                locs.push(line.bbox);
+                            }
+                        }
+                    }
+                    if (locs.length === bl) {
+                        locs.push(paragraph.bbox);
+                    }
+                }
+            }
+            if (locs.length === bl) {
+                locs.push(block.bbox);
+            }
+        }
+    }
+    return locs;
+}
+
+interface CloudUpload {
+    new(file: { file: File; isThumbnail: boolean; platform: number; }, channelId: string, showDiaglog: boolean, numCurAttachments: number): CloudUpload;
+    upload(): void;
+}
+const CloudUpload: CloudUpload = findLazy(m => m.prototype?.trackUploadFinished);
+
+function getImage(file: File): Promise<HTMLImageElement> {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.src = URL.createObjectURL(file);
+        img.onload = () => resolve(img);
+        img.onerror = reject;
+    });
+}
+
+function canvasToBlob(canvas: HTMLCanvasElement): Promise<Blob> {
+    return new Promise<Blob>(resolve => {
+        canvas.toBlob(blob => {
+            if (blob) {
+                resolve(blob);
+            } else {
+                throw new Error("Failed to create Blob");
+            }
+        }, "image/png");
+    });
+}
+const badRegex = /nix(?:os)?|This ?content ?is|blocked ?by ?this ?server/i;
+export default definePlugin({
+    name: "AntiTessie",
+    authors: [Devs.sadan],
+    description: "Scans your messages with ocr for anything that matches the selected regex, and if found, blurs it",
+
+    start() {
+        if (!window?.Tesseract) {
+            fetch(
+                "https://unpkg.com/tesseract.js@6.0.0/dist/tesseract.min.js"
+            )
+                .then(async r => void (0, eval)(await r.text()))
+                .then(async () => {
+                    worker = await Tesseract.createWorker("eng", Tesseract.OEM.TESSERACT_LSTM_COMBINED, {
+                        corePath: "https://unpkg.com/tesseract.js-core@6.0.0/tesseract-core-simd-lstm.wasm.js",
+                        workerPath: "https://unpkg.com/tesseract.js@6.0.0/dist/worker.min.js",
+                    });
+                })
+                .then(() => {
+                    worker.setParameters({
+                        tessedit_pageseg_mode: Tesseract.PSM.AUTO
+                    });
+                });
+        }
+    },
+
+    stop() {
+        worker.terminate();
+    },
+
+
+    async onBeforeMessageSend(channelId: string, message: MessageObject, extra: MessageExtra): Promise<void | { cancel: boolean; }> {
+        if (extra.channel.guild_id !== "1015060230222131221" && extra.channel.guild_id !== "1041012073603289109") {
+            return;
+        }
+
+        const uploads = extra?.uploads ?? [];
+        for (let i = 0; i < uploads.length; i++) {
+            async function convertToFile(canvas: HTMLCanvasElement): Promise<File> {
+                const blob = await canvasToBlob(canvas);
+                return new File([blob], `${upload.filename.substring(0, upload.filename.lastIndexOf("."))}.png`, {
+                    type: "image/png"
+                });
+            }
+            const upload = uploads[i];
+
+            if (!upload.isImage) continue;
+
+            console.log(upload);
+
+            const ret = await worker.recognize(upload.item.file, {
+            }, {
+                text: true,
+                blocks: true,
+            });
+            if (ret.data.text.match(badRegex)) {
+                const toBlur = findWordLocation(ret.data.blocks!, badRegex);
+
+                const sourceImage = await getImage(upload.item.file);
+                const width = sourceImage.naturalWidth;
+                const height = sourceImage.naturalHeight;
+
+                const canvas = document.createElement("canvas");
+                const ctx = canvas.getContext("2d")!;
+                ctx.canvas.width = width;
+                ctx.canvas.height = height;
+
+                ctx.drawImage(sourceImage, 0, 0, width, height);
+                for (const { x0, x1, y0, y1 } of toBlur) {
+                    ctx.fillStyle = "black";
+                    ctx.fillRect(x0, y0, x1 - x0, y1 - y0);
+                }
+                const newFile = await convertToFile(canvas);
+                const attachment = new CloudUpload({
+                    file: newFile,
+                    isThumbnail: false,
+                    platform: 1
+                }, channelId, false, uploads.length);
+                attachment.upload();
+                extra.uploads![i] = attachment as any;
+            }
+        }
+    }
+
+});

src/plugins/index.ts

@@ -25,7 +25,6 @@ import { addMessageAccessory, removeMessageAccessory } from "@api/MessageAccesso
 import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
 import { addMessageClickListener, addMessagePreEditListener, addMessagePreSendListener, removeMessageClickListener, removeMessagePreEditListener, removeMessagePreSendListener } from "@api/MessageEvents";
 import { addMessagePopoverButton, removeMessagePopoverButton } from "@api/MessagePopover";
-import { addNicknameIcon, removeNicknameIcon } from "@api/NicknameIcons";
 import { Settings, SettingsStore } from "@api/Settings";
 import { Logger } from "@utils/Logger";
 import { canonicalizeFind } from "@utils/patches";
@@ -93,7 +92,7 @@ function isReporterTestable(p: Plugin, part: ReporterTestable) {
 
 const pluginKeysToBind: Array<keyof PluginDef & `${"on" | "render"}${string}`> = [
     "onBeforeMessageEdit", "onBeforeMessageSend", "onMessageClick",
-    "renderChatBarButton", "renderMemberListDecorator", "renderNicknameIcon", "renderMessageAccessory", "renderMessageDecoration", "renderMessagePopoverButton"
+    "renderChatBarButton", "renderMemberListDecorator", "renderMessageAccessory", "renderMessageDecoration", "renderMessagePopoverButton"
 ];
 
 const neededApiPlugins = new Set<string>();
@@ -125,7 +124,6 @@ for (const p of pluginsValues) if (isPluginEnabled(p.name)) {
     if (p.onBeforeMessageEdit || p.onBeforeMessageSend || p.onMessageClick) neededApiPlugins.add("MessageEventsAPI");
     if (p.renderChatBarButton) neededApiPlugins.add("ChatInputButtonAPI");
     if (p.renderMemberListDecorator) neededApiPlugins.add("MemberListDecoratorsAPI");
-    if (p.renderNicknameIcon) neededApiPlugins.add("NicknameIconsAPI");
     if (p.renderMessageAccessory) neededApiPlugins.add("MessageAccessoriesAPI");
     if (p.renderMessageDecoration) neededApiPlugins.add("MessageDecorationsAPI");
     if (p.renderMessagePopoverButton) neededApiPlugins.add("MessagePopoverAPI");
@@ -258,7 +256,7 @@ export const startPlugin = traceFunction("startPlugin", function startPlugin(p:
     const {
         name, commands, contextMenus, userProfileBadge,
         onBeforeMessageEdit, onBeforeMessageSend, onMessageClick,
-        renderChatBarButton, renderMemberListDecorator, renderNicknameIcon, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
+        renderChatBarButton, renderMemberListDecorator, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
     } = p;
 
     if (p.start) {
@@ -308,7 +306,6 @@ export const startPlugin = traceFunction("startPlugin", function startPlugin(p:
 
     if (renderChatBarButton) addChatBarButton(name, renderChatBarButton);
     if (renderMemberListDecorator) addMemberListDecorator(name, renderMemberListDecorator);
-    if (renderNicknameIcon) addNicknameIcon(name, renderNicknameIcon);
     if (renderMessageDecoration) addMessageDecoration(name, renderMessageDecoration);
     if (renderMessageAccessory) addMessageAccessory(name, renderMessageAccessory);
     if (renderMessagePopoverButton) addMessagePopoverButton(name, renderMessagePopoverButton);
@@ -320,7 +317,7 @@ export const stopPlugin = traceFunction("stopPlugin", function stopPlugin(p: Plu
     const {
         name, commands, contextMenus, userProfileBadge,
         onBeforeMessageEdit, onBeforeMessageSend, onMessageClick,
-        renderChatBarButton, renderMemberListDecorator, renderNicknameIcon, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
+        renderChatBarButton, renderMemberListDecorator, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
     } = p;
 
     if (p.stop) {
@@ -368,7 +365,6 @@ export const stopPlugin = traceFunction("stopPlugin", function stopPlugin(p: Plu
 
     if (renderChatBarButton) removeChatBarButton(name);
     if (renderMemberListDecorator) removeMemberListDecorator(name);
-    if (renderNicknameIcon) removeNicknameIcon(name);
     if (renderMessageDecoration) removeMessageDecoration(name);
     if (renderMessageAccessory) removeMessageAccessory(name);
     if (renderMessagePopoverButton) removeMessagePopoverButton(name);

src/plugins/platformIndicators/index.tsx

@@ -18,15 +18,15 @@
 
 import "./style.css";
 
+import { addProfileBadge, BadgePosition, BadgeUserArgs, ProfileBadge, removeProfileBadge } from "@api/Badges";
 import { addMemberListDecorator, removeMemberListDecorator } from "@api/MemberListDecorators";
 import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
-import { addNicknameIcon, removeNicknameIcon } from "@api/NicknameIcons";
-import { definePluginSettings, migratePluginSetting } from "@api/Settings";
+import { Settings } from "@api/Settings";
+import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
-import { classes } from "@utils/misc";
 import definePlugin, { OptionType } from "@utils/types";
 import { filters, findStoreLazy, mapMangledModuleLazy } from "@webpack";
-import { PresenceStore, Tooltip, UserStore, useStateFromStores } from "@webpack/common";
+import { PresenceStore, Tooltip, UserStore } from "@webpack/common";
 import { User } from "discord-types/general";
 
 export interface Session {
@@ -44,26 +44,10 @@ const SessionsStore = findStoreLazy("SessionsStore") as {
     getSessions(): Record<string, Session>;
 };
 
-const { useStatusFillColor } = mapMangledModuleLazy(".concat(.5625*", {
-    useStatusFillColor: filters.byCode(".hex")
-});
-
-interface IconFactoryOpts {
-    viewBox?: string;
-    width?: number;
-    height?: number;
-}
-
-interface IconProps {
-    color: string;
-    tooltip: string;
-    small?: boolean;
-}
-
-function Icon(path: string, opts?: IconFactoryOpts) {
-    return ({ color, tooltip, small }: IconProps) => (
+function Icon(path: string, opts?: { viewBox?: string; width?: number; height?: number; }) {
+    return ({ color, tooltip, small }: { color: string; tooltip: string; small: boolean; }) => (
         <Tooltip text={tooltip} >
-            {tooltipProps => (
+            {(tooltipProps: any) => (
                 <svg
                     {...tooltipProps}
                     height={(opts?.height ?? 20) - (small ? 3 : 0)}
@@ -84,17 +68,13 @@ const Icons = {
     mobile: Icon("M 187 0 L 813 0 C 916.277 0 1000 83.723 1000 187 L 1000 1313 C 1000 1416.277 916.277 1500 813 1500 L 187 1500 C 83.723 1500 0 1416.277 0 1313 L 0 187 C 0 83.723 83.723 0 187 0 Z M 125 1000 L 875 1000 L 875 250 L 125 250 Z M 500 1125 C 430.964 1125 375 1180.964 375 1250 C 375 1319.036 430.964 1375 500 1375 C 569.036 1375 625 1319.036 625 1250 C 625 1180.964 569.036 1125 500 1125 Z", { viewBox: "0 0 1000 1500", height: 17, width: 17 }),
     embedded: Icon("M14.8 2.7 9 3.1V47h3.3c1.7 0 6.2.3 10 .7l6.7.6V2l-4.2.2c-2.4.1-6.9.3-10 .5zm1.8 6.4c1 1.7-1.3 3.6-2.7 2.2C12.7 10.1 13.5 8 15 8c.5 0 1.2.5 1.6 1.1zM16 33c0 6-.4 10-1 10s-1-4-1-10 .4-10 1-10 1 4 1 10zm15-8v23.3l3.8-.7c2-.3 4.7-.6 6-.6H43V3h-2.2c-1.3 0-4-.3-6-.6L31 1.7V25z", { viewBox: "0 0 50 50" }),
 };
-
 type Platform = keyof typeof Icons;
 
-interface PlatformIconProps {
-    platform: Platform;
-    status: string;
-    small?: boolean;
-    isProfile?: boolean;
-}
+const { useStatusFillColor } = mapMangledModuleLazy(".concat(.5625*", {
+    useStatusFillColor: filters.byCode(".hex")
+});
 
-const PlatformIcon = ({ platform, status, small }: PlatformIconProps) => {
+const PlatformIcon = ({ platform, status, small }: { platform: Platform, status: string; small: boolean; }) => {
     const tooltip = platform === "embedded"
         ? "Console"
         : platform[0].toUpperCase() + platform.slice(1);
@@ -104,12 +84,9 @@ const PlatformIcon = ({ platform, status, small }: PlatformIconProps) => {
     return <Icon color={useStatusFillColor(status)} tooltip={tooltip} small={small} />;
 };
 
-function useEnsureOwnStatus(user: User) {
-    if (user.id !== UserStore.getCurrentUser()?.id) {
-        return;
-    }
-
-    const sessions = useStateFromStores([SessionsStore], () => SessionsStore.getSessions());
+function ensureOwnStatus(user: User) {
+    if (user.id === UserStore.getCurrentUser().id) {
+        const sessions = SessionsStore.getSessions();
         if (typeof sessions !== "object") return null;
         const sortedSessions = Object.values(sessions).sort(({ status: a }, { status: b }) => {
             if (a === b) return 0;
@@ -129,121 +106,133 @@ function useEnsureOwnStatus(user: User) {
         const { clientStatuses } = PresenceStore.getState();
         clientStatuses[UserStore.getCurrentUser().id] = ownStatus;
     }
-
-interface PlatformIndicatorProps {
-    user: User;
-    isProfile?: boolean;
-    isMessage?: boolean;
-    isMemberList?: boolean;
 }
 
-const PlatformIndicator = ({ user, isProfile, isMessage, isMemberList }: PlatformIndicatorProps) => {
-    if (user == null || user.bot) return null;
-    useEnsureOwnStatus(user);
+function getBadges({ userId }: BadgeUserArgs): ProfileBadge[] {
+    const user = UserStore.getUser(userId);
 
-    const status: Record<Platform, string> | undefined = useStateFromStores([PresenceStore], () => PresenceStore.getState()?.clientStatuses?.[user.id]);
-    if (status == null) {
-        return null;
-    }
+    if (!user || user.bot) return [];
 
-    const icons = Array.from(Object.entries(status), ([platform, status]) => (
+    ensureOwnStatus(user);
+
+    const status = PresenceStore.getState()?.clientStatuses?.[user.id] as Record<Platform, string>;
+    if (!status) return [];
+
+    return Object.entries(status).map(([platform, status]) => ({
+        component: () => (
+            <span className="vc-platform-indicator">
                 <PlatformIcon
                     key={platform}
                     platform={platform as Platform}
                     status={status}
-            small={isProfile || isMemberList}
+                    small={false}
+                />
+            </span>
+        ),
+        key: `vc-platform-indicator-${platform}`
+    }));
+}
+
+const PlatformIndicator = ({ user, wantMargin = true, wantTopMargin = false, small = false }: { user: User; wantMargin?: boolean; wantTopMargin?: boolean; small?: boolean; }) => {
+    if (!user || user.bot) return null;
+
+    ensureOwnStatus(user);
+
+    const status = PresenceStore.getState()?.clientStatuses?.[user.id] as Record<Platform, string>;
+    if (!status) return null;
+
+    const icons = Object.entries(status).map(([platform, status]) => (
+        <PlatformIcon
+            key={platform}
+            platform={platform as Platform}
+            status={status}
+            small={small}
         />
     ));
 
-    if (!icons.length) {
-        return null;
-    }
+    if (!icons.length) return null;
 
     return (
-        <div
-            className={classes("vc-platform-indicator", isProfile && "vc-platform-indicator-profile", isMessage && "vc-platform-indicator-message")}
-            style={{ marginLeft: isMemberList ? "4px" : undefined }}
+        <span
+            className="vc-platform-indicator"
+            style={{
+                marginLeft: wantMargin ? 4 : 0,
+                top: wantTopMargin ? 2 : 0,
+                gap: 2
+            }}
         >
             {icons}
-        </div>
+        </span>
     );
 };
 
-function toggleMemberListDecorators(enabled: boolean) {
-    if (enabled) {
-        addMemberListDecorator("PlatformIndicators", props => <PlatformIndicator user={props.user} isMemberList />);
-    } else {
-        removeMemberListDecorator("PlatformIndicators");
-    }
-}
+const badge: ProfileBadge = {
+    getBadges,
+    position: BadgePosition.START,
+};
 
-function toggleNicknameIcons(enabled: boolean) {
-    if (enabled) {
-        addNicknameIcon("PlatformIndicators", props => <PlatformIndicator user={UserStore.getUser(props.userId)} isProfile />, 1);
-    } else {
-        removeNicknameIcon("PlatformIndicators");
-    }
-}
-
-function toggleMessageDecorators(enabled: boolean) {
-    if (enabled) {
-        addMessageDecoration("PlatformIndicators", props => <PlatformIndicator user={props.message?.author} isMessage />);
-    } else {
-        removeMessageDecoration("PlatformIndicators");
-    }
-}
-
-migratePluginSetting("PlatformIndicators", "badges", "profiles");
-const settings = definePluginSettings({
+const indicatorLocations = {
     list: {
-        type: OptionType.BOOLEAN,
-        description: "Show indicators in the member list",
-        default: true,
-        onChange: toggleMemberListDecorators
+        description: "In the member list",
+        onEnable: () => addMemberListDecorator("platform-indicator", props =>
+            <ErrorBoundary noop>
+                <PlatformIndicator user={props.user} small={true} />
+            </ErrorBoundary>
+        ),
+        onDisable: () => removeMemberListDecorator("platform-indicator")
     },
-    profiles: {
-        type: OptionType.BOOLEAN,
-        description: "Show indicators in user profiles",
-        default: true,
-        onChange: toggleNicknameIcons
+    badges: {
+        description: "In user profiles, as badges",
+        onEnable: () => addProfileBadge(badge),
+        onDisable: () => removeProfileBadge(badge)
     },
     messages: {
-        type: OptionType.BOOLEAN,
-        description: "Show indicators inside messages",
-        default: true,
-        onChange: toggleMessageDecorators
-    },
-    colorMobileIndicator: {
-        type: OptionType.BOOLEAN,
-        description: "Whether to make the mobile indicator match the color of the user status.",
-        default: true,
-        restartNeeded: true
+        description: "Inside messages",
+        onEnable: () => addMessageDecoration("platform-indicator", props =>
+            <ErrorBoundary noop>
+                <PlatformIndicator user={props.message?.author} wantTopMargin={true} />
+            </ErrorBoundary>
+        ),
+        onDisable: () => removeMessageDecoration("platform-indicator")
     }
-});
+};
 
 export default definePlugin({
     name: "PlatformIndicators",
     description: "Adds platform indicators (Desktop, Mobile, Web...) to users",
     authors: [Devs.kemo, Devs.TheSun, Devs.Nuckyz, Devs.Ven],
-    dependencies: ["MemberListDecoratorsAPI", "NicknameIconsAPI", "MessageDecorationsAPI"],
-    settings,
+    dependencies: ["MessageDecorationsAPI", "MemberListDecoratorsAPI"],
 
     start() {
-        if (settings.store.list) toggleMemberListDecorators(true);
-        if (settings.store.profiles) toggleNicknameIcons(true);
-        if (settings.store.messages) toggleMessageDecorators(true);
+        const settings = Settings.plugins.PlatformIndicators;
+        const { displayMode } = settings;
+
+        // transfer settings from the old ones, which had a select menu instead of booleans
+        if (displayMode) {
+            if (displayMode !== "both") settings[displayMode] = true;
+            else {
+                settings.list = true;
+                settings.badges = true;
+            }
+            settings.messages = true;
+            delete settings.displayMode;
+        }
+
+        Object.entries(indicatorLocations).forEach(([key, value]) => {
+            if (settings[key]) value.onEnable();
+        });
     },
 
     stop() {
-        if (settings.store.list) toggleMemberListDecorators(false);
-        if (settings.store.profiles) toggleNicknameIcons;
-        if (settings.store.messages) toggleMessageDecorators(false);
+        Object.entries(indicatorLocations).forEach(([_, value]) => {
+            value.onDisable();
+        });
     },
 
     patches: [
         {
             find: ".Masks.STATUS_ONLINE_MOBILE",
-            predicate: () => settings.store.colorMobileIndicator,
+            predicate: () => Settings.plugins.PlatformIndicators.colorMobileIndicator,
             replacement: [
                 {
                     // Return the STATUS_ONLINE_MOBILE mask if the user is on mobile, no matter the status
@@ -259,7 +248,7 @@ export default definePlugin({
         },
         {
             find: ".AVATAR_STATUS_MOBILE_16;",
-            predicate: () => settings.store.colorMobileIndicator,
+            predicate: () => Settings.plugins.PlatformIndicators.colorMobileIndicator,
             replacement: [
                 {
                     // Return the AVATAR_STATUS_MOBILE size mask if the user is on mobile, no matter the status
@@ -280,12 +269,32 @@ export default definePlugin({
         },
         {
             find: "}isMobileOnline(",
-            predicate: () => settings.store.colorMobileIndicator,
+            predicate: () => Settings.plugins.PlatformIndicators.colorMobileIndicator,
             replacement: {
                 // Make isMobileOnline return true no matter what is the user status
                 match: /(?<=\i\[\i\.\i\.MOBILE\])===\i\.\i\.ONLINE/,
                 replace: "!= null"
             }
         }
-    ]
+    ],
+
+    options: {
+        ...Object.fromEntries(
+            Object.entries(indicatorLocations).map(([key, value]) => {
+                return [key, {
+                    type: OptionType.BOOLEAN,
+                    description: `Show indicators ${value.description.toLowerCase()}`,
+                    // onChange doesn't give any way to know which setting was changed, so restart required
+                    restartNeeded: true,
+                    default: true
+                }];
+            })
+        ),
+        colorMobileIndicator: {
+            type: OptionType.BOOLEAN,
+            description: "Whether to make the mobile indicator match the color of the user status.",
+            default: true,
+            restartNeeded: true
+        }
+    }
 });

src/plugins/platformIndicators/style.css

@@ -2,20 +2,6 @@
     display: inline-flex;
     justify-content: center;
     align-items: center;
-    gap: 2px;
-}
-
-.vc-platform-indicator-profile {
-    background: rgb(var(--bg-overlay-color) / var(--bg-overlay-opacity-6));
-    border: 1px solid var(--border-faint);
-    border-radius: var(--radius-xs);
-    border-color: var(--profile-body-border-color);
-    margin: 0 1px;
-    padding: 0 1px;
-}
-
-.vc-platform-indicator-message {
-    position: relative;
     vertical-align: top;
-    top: 2px;
+    position: relative;
 }

src/plugins/userVoiceShow/index.tsx

@@ -20,7 +20,6 @@ import "./style.css";
 
 import { addMemberListDecorator, removeMemberListDecorator } from "@api/MemberListDecorators";
 import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
-import { addNicknameIcon, removeNicknameIcon } from "@api/NicknameIcons";
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
@@ -52,10 +51,19 @@ export default definePlugin({
     name: "UserVoiceShow",
     description: "Shows an indicator when a user is in a Voice Channel",
     authors: [Devs.Nuckyz, Devs.LordElias],
-    dependencies: ["NicknameIconsAPI", "MemberListDecoratorsAPI", "MessageDecorationsAPI"],
+    dependencies: ["MemberListDecoratorsAPI", "MessageDecorationsAPI"],
     settings,
 
     patches: [
+        // User Popout, Full Size Profile, Direct Messages Side Profile
+        {
+            find: "#{intl::USER_PROFILE_LOAD_ERROR}",
+            replacement: {
+                match: /(\.fetchError.+?\?)null/,
+                replace: (_, rest) => `${rest}$self.VoiceChannelIndicator({userId:arguments[0]?.userId,isProfile:true})`
+            },
+            predicate: () => settings.store.showInUserProfileModal
+        },
         // To use without the MemberList decorator API
         /* // Guild Members List
         {
@@ -87,9 +95,6 @@ export default definePlugin({
     ],
 
     start() {
-        if (settings.store.showInUserProfileModal) {
-            addNicknameIcon("UserVoiceShow", ({ userId }) => <VoiceChannelIndicator userId={userId} isProfile />);
-        }
         if (settings.store.showInMemberList) {
             addMemberListDecorator("UserVoiceShow", ({ user }) => user == null ? null : <VoiceChannelIndicator userId={user.id} />);
         }
@@ -99,7 +104,6 @@ export default definePlugin({
     },
 
     stop() {
-        removeNicknameIcon("UserVoiceShow");
         removeMemberListDecorator("UserVoiceShow");
         removeMessageDecoration("UserVoiceShow");
     },

src/utils/types.ts

@@ -25,11 +25,9 @@ import { MessageAccessoryFactory } from "@api/MessageAccessories";
 import { MessageDecorationFactory } from "@api/MessageDecorations";
 import { MessageClickListener, MessageEditListener, MessageSendListener } from "@api/MessageEvents";
 import { MessagePopoverButtonFactory } from "@api/MessagePopover";
-import { NicknameIconFactory } from "@api/NicknameIcons";
 import { FluxEvents } from "@webpack/types";
 import { JSX } from "react";
 import { Promisable } from "type-fest";
-import { LiteralStringUnion } from "type-fest/source/literal-union";
 
 // exists to export default definePlugin({...})
 export default function definePlugin<P extends PluginDef>(p: P & Record<string, any>) {
@@ -90,7 +88,7 @@ export interface PluginDef {
      * These will automatically be enabled and loaded before your plugin
      * Generally these will be API plugins
      */
-    dependencies?: Array<LiteralStringUnion<"BadgeAPI" | "ChatInputButtonAPI" | "CommandsAPI" | "ContextMenuAPI" | "DynamicImageModalAPI" | "NicknameIconsAPI" | "MemberListDecoratorsAPI" | "MenuItemDemanglerAPI" | "MessageAccessoriesAPI" | "MessageDecorationsAPI" | "MessageEventsAPI" | "MessagePopoverAPI" | "MessageUpdaterAPI" | "NoticesAPI" | "ServerListAPI" | "UserSettingsAPI">>,
+    dependencies?: string[],
     /**
      * Whether this plugin is required and forcefully enabled
      */
@@ -163,7 +161,6 @@ export interface PluginDef {
     renderMessageDecoration?: MessageDecorationFactory;
 
     renderMemberListDecorator?: MemberListDecoratorFactory;
-    renderNicknameIcon?: NicknameIconFactory;
 
     renderChatBarButton?: ChatBarButtonFactory;
 }