Replace API add/remove funcs with methods in plugin definition (#3028)

src/api/Badges.ts

@@ -57,7 +57,7 @@ const Badges = new Set<ProfileBadge>();
  * Register a new badge with the Badges API
  * @param badge The badge to register
  */
-export function addBadge(badge: ProfileBadge) {
+export function addProfileBadge(badge: ProfileBadge) {
     badge.component &&= ErrorBoundary.wrap(badge.component, { noop: true });
     Badges.add(badge);
 }
@@ -66,7 +66,7 @@ export function addBadge(badge: ProfileBadge) {
  * Unregister a badge from the Badges API
  * @param badge The badge to remove
  */
-export function removeBadge(badge: ProfileBadge) {
+export function removeProfileBadge(badge: ProfileBadge) {
     return Badges.delete(badge);
 }
 
@@ -100,20 +100,3 @@ export interface BadgeUserArgs {
     userId: string;
     guildId: string;
 }
-
-interface ConnectedAccount {
-    type: string;
-    id: string;
-    name: string;
-    verified: boolean;
-}
-
-interface Profile {
-    connectedAccounts: ConnectedAccount[];
-    premiumType: number;
-    premiumSince: string;
-    premiumGuildSince?: any;
-    lastFetched: number;
-    profileFetchFailed: boolean;
-    application?: any;
-}

src/api/ChatButtons.tsx

@@ -74,9 +74,9 @@ export interface ChatBarProps {
     };
 }
 
-export type ChatBarButton = (props: ChatBarProps & { isMainChat: boolean; }) => JSX.Element | null;
+export type ChatBarButtonFactory = (props: ChatBarProps & { isMainChat: boolean; }) => JSX.Element | null;
 
-const buttonFactories = new Map<string, ChatBarButton>();
+const buttonFactories = new Map<string, ChatBarButtonFactory>();
 const logger = new Logger("ChatButtons");
 
 export function _injectButtons(buttons: ReactNode[], props: ChatBarProps) {
@@ -91,7 +91,7 @@ export function _injectButtons(buttons: ReactNode[], props: ChatBarProps) {
     }
 }
 
-export const addChatBarButton = (id: string, button: ChatBarButton) => buttonFactories.set(id, button);
+export const addChatBarButton = (id: string, button: ChatBarButtonFactory) => buttonFactories.set(id, button);
 export const removeChatBarButton = (id: string) => buttonFactories.delete(id);
 
 export interface ChatBarButtonProps {

src/api/MemberListDecorators.tsx

@@ -16,6 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import ErrorBoundary from "@components/ErrorBoundary";
 import { Channel, User } from "discord-types/general/index.js";
 import { JSX } from "react";
 
@@ -39,27 +40,32 @@ interface DecoratorProps {
     user: User;
     [key: string]: any;
 }
-export type Decorator = (props: DecoratorProps) => JSX.Element | null;
+export type MemberListDecoratorFactory = (props: DecoratorProps) => JSX.Element | null;
 type OnlyIn = "guilds" | "dms";
 
-export const decorators = new Map<string, { decorator: Decorator, onlyIn?: OnlyIn; }>();
+export const decorators = new Map<string, { render: MemberListDecoratorFactory, onlyIn?: OnlyIn; }>();
 
-export function addDecorator(identifier: string, decorator: Decorator, onlyIn?: OnlyIn) {
+export function addMemberListDecorator(identifier: string, render: MemberListDecoratorFactory, onlyIn?: OnlyIn) {
-    decorators.set(identifier, { decorator, onlyIn });
+    decorators.set(identifier, { render, onlyIn });
 }
 
-export function removeDecorator(identifier: string) {
+export function removeMemberListDecorator(identifier: string) {
     decorators.delete(identifier);
 }
 
 export function __getDecorators(props: DecoratorProps): (JSX.Element | null)[] {
     const isInGuild = !!(props.guildId);
-    return Array.from(decorators.values(), decoratorObj => {
+    return Array.from(
-        const { decorator, onlyIn } = decoratorObj;
+        decorators.entries(),
-        // this can most likely be done cleaner
+        ([key, { render: Decorator, onlyIn }]) => {
-        if (!onlyIn || (onlyIn === "guilds" && isInGuild) || (onlyIn === "dms" && !isInGuild)) {
+            if ((onlyIn === "guilds" && !isInGuild) || (onlyIn === "dms" && isInGuild))
-            return decorator(props);
-        }
                 return null;
-    });
+
+            return (
+                <ErrorBoundary noop key={key} message={`Failed to render ${key} Member List Decorator`}>
+                    <Decorator {...props} />
+                </ErrorBoundary>
+            );
+        }
+    );
 }

src/api/MessageAccessories.tsx

@@ -16,28 +16,29 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { JSX } from "react";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { JSX, ReactNode } from "react";
 
-export type AccessoryCallback = (props: Record<string, any>) => JSX.Element | null | Array<JSX.Element | null>;
+export type MessageAccessoryFactory = (props: Record<string, any>) => ReactNode;
-export type Accessory = {
+export type MessageAccessory = {
-    callback: AccessoryCallback;
+    render: MessageAccessoryFactory;
     position?: number;
 };
 
-export const accessories = new Map<String, Accessory>();
+export const accessories = new Map<string, MessageAccessory>();
 
-export function addAccessory(
+export function addMessageAccessory(
     identifier: string,
-    callback: AccessoryCallback,
+    render: MessageAccessoryFactory,
     position?: number
 ) {
     accessories.set(identifier, {
-        callback,
+        render,
         position,
     });
 }
 
-export function removeAccessory(identifier: string) {
+export function removeMessageAccessory(identifier: string) {
     accessories.delete(identifier);
 }
 
@@ -45,15 +46,12 @@ export function _modifyAccessories(
     elements: JSX.Element[],
     props: Record<string, any>
 ) {
-    for (const accessory of accessories.values()) {
+    for (const [key, accessory] of accessories.entries()) {
-        let accessories = accessory.callback(props);
+        const res = (
-        if (accessories == null)
+            <ErrorBoundary message={`Failed to render ${key} Message Accessory`} key={key}>
-            continue;
+                <accessory.render {...props} />
-
+            </ErrorBoundary>
-        if (!Array.isArray(accessories))
+        );
-            accessories = [accessories];
-        else if (accessories.length === 0)
-            continue;
 
         elements.splice(
             accessory.position != null
@@ -62,7 +60,7 @@ export function _modifyAccessories(
                     : accessory.position
                 : elements.length,
             0,
-            ...accessories.filter(e => e != null) as JSX.Element[]
+            res
         );
     }
 

src/api/MessageDecorations.tsx

@@ -16,10 +16,11 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import ErrorBoundary from "@components/ErrorBoundary";
 import { Channel, Message } from "discord-types/general/index.js";
 import { JSX } from "react";
 
-interface DecorationProps {
+export interface MessageDecorationProps {
     author: {
         /**
          * Will be username if the user has no nickname
@@ -45,20 +46,25 @@ interface DecorationProps {
     message: Message;
     [key: string]: any;
 }
-export type Decoration = (props: DecorationProps) => JSX.Element | null;
+export type MessageDecorationFactory = (props: MessageDecorationProps) => JSX.Element | null;
 
-export const decorations = new Map<string, Decoration>();
+export const decorations = new Map<string, MessageDecorationFactory>();
 
-export function addDecoration(identifier: string, decoration: Decoration) {
+export function addMessageDecoration(identifier: string, decoration: MessageDecorationFactory) {
     decorations.set(identifier, decoration);
 }
 
-export function removeDecoration(identifier: string) {
+export function removeMessageDecoration(identifier: string) {
     decorations.delete(identifier);
 }
 
-export function __addDecorationsToMessage(props: DecorationProps): (JSX.Element | null)[] {
+export function __addDecorationsToMessage(props: MessageDecorationProps): (JSX.Element | null)[] {
-    return [...decorations.values()].map(decoration => {
+    return Array.from(
-        return decoration(props);
+        decorations.entries(),
-    });
+        ([key, Decoration]) => (
+            <ErrorBoundary noop message={`Failed to render ${key} Message Decoration`} key={key}>
+                <Decoration {...props} />
+            </ErrorBoundary>
+        )
+    );
 }

src/api/MessageEvents.ts

@@ -73,11 +73,11 @@ export interface MessageExtra {
     openWarningPopout: (props: any) => any;
 }
 
-export type SendListener = (channelId: string, messageObj: MessageObject, extra: MessageExtra) => Promisable<void | { cancel: boolean; }>;
+export type MessageSendListener = (channelId: string, messageObj: MessageObject, extra: MessageExtra) => Promisable<void | { cancel: boolean; }>;
-export type EditListener = (channelId: string, messageId: string, messageObj: MessageObject) => Promisable<void | { cancel: boolean; }>;
+export type MessageEditListener = (channelId: string, messageId: string, messageObj: MessageObject) => Promisable<void | { cancel: boolean; }>;
 
-const sendListeners = new Set<SendListener>();
+const sendListeners = new Set<MessageSendListener>();
-const editListeners = new Set<EditListener>();
+const editListeners = new Set<MessageEditListener>();
 
 export async function _handlePreSend(channelId: string, messageObj: MessageObject, extra: MessageExtra, replyOptions: MessageReplyOptions) {
     extra.replyOptions = replyOptions;
@@ -111,29 +111,29 @@ export async function _handlePreEdit(channelId: string, messageId: string, messa
 /**
  * Note: This event fires off before a message is sent, allowing you to edit the message.
  */
-export function addPreSendListener(listener: SendListener) {
+export function addMessagePreSendListener(listener: MessageSendListener) {
     sendListeners.add(listener);
     return listener;
 }
 /**
  * Note: This event fires off before a message's edit is applied, allowing you to further edit the message.
  */
-export function addPreEditListener(listener: EditListener) {
+export function addMessagePreEditListener(listener: MessageEditListener) {
     editListeners.add(listener);
     return listener;
 }
-export function removePreSendListener(listener: SendListener) {
+export function removeMessagePreSendListener(listener: MessageSendListener) {
     return sendListeners.delete(listener);
 }
-export function removePreEditListener(listener: EditListener) {
+export function removeMessagePreEditListener(listener: MessageEditListener) {
     return editListeners.delete(listener);
 }
 
 
 // Message clicks
-type ClickListener = (message: Message, channel: Channel, event: MouseEvent) => void;
+export type MessageClickListener = (message: Message, channel: Channel, event: MouseEvent) => void;
 
-const listeners = new Set<ClickListener>();
+const listeners = new Set<MessageClickListener>();
 
 export function _handleClick(message: Message, channel: Channel, event: MouseEvent) {
     // message object may be outdated, so (try to) fetch latest one
@@ -147,11 +147,11 @@ export function _handleClick(message: Message, channel: Channel, event: MouseEve
     }
 }
 
-export function addClickListener(listener: ClickListener) {
+export function addMessageClickListener(listener: MessageClickListener) {
     listeners.add(listener);
     return listener;
 }
 
-export function removeClickListener(listener: ClickListener) {
+export function removeMessageClickListener(listener: MessageClickListener) {
     return listeners.delete(listener);
 }

src/api/MessagePopover.tsx

@@ -23,7 +23,7 @@ import type { ComponentType, MouseEventHandler } from "react";
 
 const logger = new Logger("MessagePopover");
 
-export interface ButtonItem {
+export interface MessagePopoverButtonItem {
     key?: string,
     label: string,
     icon: ComponentType<any>,
@@ -33,23 +33,23 @@ export interface ButtonItem {
     onContextMenu?: MouseEventHandler<HTMLButtonElement>;
 }
 
-export type getButtonItem = (message: Message) => ButtonItem | null;
+export type MessagePopoverButtonFactory = (message: Message) => MessagePopoverButtonItem | null;
 
-export const buttons = new Map<string, getButtonItem>();
+export const buttons = new Map<string, MessagePopoverButtonFactory>();
 
-export function addButton(
+export function addMessagePopoverButton(
     identifier: string,
-    item: getButtonItem,
+    item: MessagePopoverButtonFactory,
 ) {
     buttons.set(identifier, item);
 }
 
-export function removeButton(identifier: string) {
+export function removeMessagePopoverButton(identifier: string) {
     buttons.delete(identifier);
 }
 
 export function _buildPopoverElements(
-    Component: React.ComponentType<ButtonItem>,
+    Component: React.ComponentType<MessagePopoverButtonItem>,
     message: Message
 ) {
     const items: React.ReactNode[] = [];

src/api/ServerList.tsx

@@ -16,41 +16,36 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Logger } from "@utils/Logger";
+import ErrorBoundary from "@components/ErrorBoundary";
-import { JSX } from "react";
+import { ComponentType } from "react";
-
-const logger = new Logger("ServerListAPI");
 
 export const enum ServerListRenderPosition {
     Above,
     In,
 }
 
-const renderFunctionsAbove = new Set<Function>();
+const componentsAbove = new Set<ComponentType>();
-const renderFunctionsIn = new Set<Function>();
+const componentsBelow = new Set<ComponentType>();
 
 function getRenderFunctions(position: ServerListRenderPosition) {
-    return position === ServerListRenderPosition.Above ? renderFunctionsAbove : renderFunctionsIn;
+    return position === ServerListRenderPosition.Above ? componentsAbove : componentsBelow;
 }
 
-export function addServerListElement(position: ServerListRenderPosition, renderFunction: Function) {
+export function addServerListElement(position: ServerListRenderPosition, renderFunction: ComponentType) {
     getRenderFunctions(position).add(renderFunction);
 }
 
-export function removeServerListElement(position: ServerListRenderPosition, renderFunction: Function) {
+export function removeServerListElement(position: ServerListRenderPosition, renderFunction: ComponentType) {
     getRenderFunctions(position).delete(renderFunction);
 }
 
 export const renderAll = (position: ServerListRenderPosition) => {
-    const ret: Array<JSX.Element> = [];
+    return Array.from(
-
+        getRenderFunctions(position),
-    for (const renderFunction of getRenderFunctions(position)) {
+        (Component, i) => (
-        try {
+            <ErrorBoundary noop key={i}>
-            ret.unshift(renderFunction());
+                <Component />
-        } catch (e) {
+            </ErrorBoundary>
-            logger.error("Failed to render server list element:", e);
+        )
-        }
+    );
-    }
-
-    return ret;
 };

src/components/ErrorBoundary.tsx

@@ -70,8 +70,7 @@ const ErrorBoundary = LazyComponent(() => {
 
         componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
             this.props.onError?.({ error, errorInfo, props: this.props.wrappedProps });
-            logger.error("A component threw an Error\n", error);
+            logger.error(`${this.props.message || "A component threw an Error"}\n`, error, errorInfo.componentStack);
-            logger.error("Component Stack", errorInfo.componentStack);
         }
 
         render() {

src/plugins/_api/badges/index.tsx

@@ -102,8 +102,9 @@ export default definePlugin({
         }
     },
 
+    userProfileBadge: ContributorBadge,
+
     async start() {
-        Vencord.Api.Badges.addBadge(ContributorBadge);
         await loadBadges();
     },
 

src/plugins/_core/supportHelper.tsx

@@ -16,7 +16,6 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addAccessory } from "@api/MessageAccessories";
 import { definePluginSettings } from "@api/Settings";
 import { getUserSettingLazy } from "@api/UserSettings";
 import ErrorBoundary from "@components/ErrorBoundary";
@@ -143,7 +142,7 @@ export default definePlugin({
     required: true,
     description: "Helps us provide support to you",
     authors: [Devs.Ven],
-    dependencies: ["UserSettingsAPI", "MessageAccessoriesAPI"],
+    dependencies: ["UserSettingsAPI"],
 
     settings,
 
@@ -236,23 +235,7 @@ export default definePlugin({
         }
     },
 
-    renderContributorDmWarningCard: ErrorBoundary.wrap(({ channel }) => {
+    renderMessageAccessory(props) {
-        const userId = channel.getRecipientId();
-        if (!isPluginDev(userId)) return null;
-        if (RelationshipStore.isFriend(userId) || isPluginDev(UserStore.getCurrentUser()?.id)) return null;
-
-        return (
-            <Card className={`vc-plugins-restart-card ${Margins.top8}`}>
-                Please do not private message Vencord plugin developers for support!
-                <br />
-                Instead, use the Vencord support channel: {Parser.parse("https://discord.com/channels/1015060230222131221/1026515880080842772")}
-                {!ChannelStore.getChannel(SUPPORT_CHANNEL_ID) && " (Click the link to join)"}
-            </Card>
-        );
-    }, { noop: true }),
-
-    start() {
-        addAccessory("vencord-debug", props => {
         const buttons = [] as JSX.Element[];
 
         const shouldAddUpdateButton =
@@ -329,6 +312,20 @@ export default definePlugin({
         return buttons.length
             ? <Flex>{buttons}</Flex>
             : null;
-        });
     },
+
+    renderContributorDmWarningCard: ErrorBoundary.wrap(({ channel }) => {
+        const userId = channel.getRecipientId();
+        if (!isPluginDev(userId)) return null;
+        if (RelationshipStore.isFriend(userId) || isPluginDev(UserStore.getCurrentUser()?.id)) return null;
+
+        return (
+            <Card className={`vc-plugins-restart-card ${Margins.top8}`}>
+                Please do not private message Vencord plugin developers for support!
+                <br />
+                Instead, use the Vencord support channel: {Parser.parse("https://discord.com/channels/1015060230222131221/1026515880080842772")}
+                {!ChannelStore.getChannel(SUPPORT_CHANNEL_ID) && " (Click the link to join)"}
+            </Card>
+        );
+    }, { noop: true }),
 });

src/plugins/accountPanelServerProfile/index.tsx

@@ -23,7 +23,7 @@ const UserProfile = findComponentByCodeLazy("UserProfilePopoutWrapper: user cann
 const styles = findByPropsLazy("accountProfilePopoutWrapper");
 
 let openAlternatePopout = false;
-let accountPanelRef: React.MutableRefObject<Record<PropertyKey, any> | null> = { current: null };
+let accountPanelRef: React.RefObject<Record<PropertyKey, any> | null> = { current: null };
 
 const AccountPanelContextMenu = ErrorBoundary.wrap(() => {
     const { prioritizeServerProfile } = settings.use(["prioritizeServerProfile"]);

src/plugins/clearURLs/index.ts

@@ -17,11 +17,7 @@
 */
 
 import {
-    addPreEditListener,
+    MessageObject
-    addPreSendListener,
-    MessageObject,
-    removePreEditListener,
-    removePreSendListener
 } from "@api/MessageEvents";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
@@ -36,7 +32,18 @@ export default definePlugin({
     name: "ClearURLs",
     description: "Removes tracking garbage from URLs",
     authors: [Devs.adryd],
-    dependencies: ["MessageEventsAPI"],
+
+    start() {
+        this.createRules();
+    },
+
+    onBeforeMessageSend(_, msg) {
+        return this.onSend(msg);
+    },
+
+    onBeforeMessageEdit(_cid, _mid, msg) {
+        return this.onSend(msg);
+    },
 
     escapeRegExp(str: string) {
         return (str && reHasRegExpChar.test(str))
@@ -133,17 +140,4 @@ export default definePlugin({
             );
         }
     },
-
-    start() {
-        this.createRules();
-        this.preSend = addPreSendListener((_, msg) => this.onSend(msg));
-        this.preEdit = addPreEditListener((_cid, _mid, msg) =>
-            this.onSend(msg)
-        );
-    },
-
-    stop() {
-        removePreSendListener(this.preSend);
-        removePreEditListener(this.preEdit);
-    },
 });

src/plugins/fakeNitro/index.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addPreEditListener, addPreSendListener, removePreEditListener, removePreSendListener } from "@api/MessageEvents";
+import { addMessagePreEditListener, addMessagePreSendListener, removeMessagePreEditListener, removeMessagePreSendListener } from "@api/MessageEvents";
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import { ApngBlendOp, ApngDisposeOp, importApngJs } from "@utils/dependencies";
@@ -853,7 +853,7 @@ export default definePlugin({
             });
         }
 
-        this.preSend = addPreSendListener(async (channelId, messageObj, extra) => {
+        this.preSend = addMessagePreSendListener(async (channelId, messageObj, extra) => {
             const { guildId } = this;
 
             let hasBypass = false;
@@ -941,7 +941,7 @@ export default definePlugin({
             return { cancel: false };
         });
 
-        this.preEdit = addPreEditListener(async (channelId, __, messageObj) => {
+        this.preEdit = addMessagePreEditListener(async (channelId, __, messageObj) => {
             if (!s.enableEmojiBypass) return;
 
             let hasBypass = false;
@@ -973,7 +973,7 @@ export default definePlugin({
     },
 
     stop() {
-        removePreSendListener(this.preSend);
+        removeMessagePreSendListener(this.preSend);
-        removePreEditListener(this.preEdit);
+        removeMessagePreEditListener(this.preEdit);
     }
 });

src/plugins/hideAttachments/index.tsx

@@ -17,7 +17,6 @@
 */
 
 import { get, set } from "@api/DataStore";
-import { addButton, removeButton } from "@api/MessagePopover";
 import { ImageInvisible, ImageVisible } from "@components/Icons";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
@@ -38,17 +37,8 @@ export default definePlugin({
     name: "HideAttachments",
     description: "Hide attachments and Embeds for individual messages via hover button",
     authors: [Devs.Ven],
-    dependencies: ["MessagePopoverAPI"],
 
-    async start() {
+    renderMessagePopoverButton(msg) {
-        style = document.createElement("style");
-        style.id = "VencordHideAttachments";
-        document.head.appendChild(style);
-
-        await getHiddenMessages();
-        await this.buildCss();
-
-        addButton("HideAttachments", msg => {
         if (!msg.attachments.length && !msg.embeds.length && !msg.stickerItems.length) return null;
 
         const isHidden = hiddenMessages.has(msg.id);
@@ -60,13 +50,20 @@ export default definePlugin({
             channel: ChannelStore.getChannel(msg.channel_id),
             onClick: () => this.toggleHide(msg.id)
         };
-        });
+    },
+
+    async start() {
+        style = document.createElement("style");
+        style.id = "VencordHideAttachments";
+        document.head.appendChild(style);
+
+        await getHiddenMessages();
+        await this.buildCss();
     },
 
     stop() {
         style.remove();
         hiddenMessages.clear();
-        removeButton("HideAttachments");
     },
 
     async buildCss() {

src/plugins/index.ts

@@ -16,12 +16,19 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import { addProfileBadge, removeProfileBadge } from "@api/Badges";
+import { addChatBarButton, removeChatBarButton } from "@api/ChatButtons";
 import { registerCommand, unregisterCommand } from "@api/Commands";
 import { addContextMenuPatch, removeContextMenuPatch } from "@api/ContextMenu";
+import { addMemberListDecorator, removeMemberListDecorator } from "@api/MemberListDecorators";
+import { addMessageAccessory, removeMessageAccessory } from "@api/MessageAccessories";
+import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
+import { addMessageClickListener, addMessagePreEditListener, addMessagePreSendListener, removeMessageClickListener, removeMessagePreEditListener, removeMessagePreSendListener } from "@api/MessageEvents";
+import { addMessagePopoverButton, removeMessagePopoverButton } from "@api/MessagePopover";
 import { Settings } from "@api/Settings";
 import { Logger } from "@utils/Logger";
 import { canonicalizeFind } from "@utils/patches";
-import { Patch, Plugin, ReporterTestable, StartAt } from "@utils/types";
+import { Patch, Plugin, PluginDef, ReporterTestable, StartAt } from "@utils/types";
 import { FluxDispatcher } from "@webpack/common";
 import { FluxEvents } from "@webpack/types";
 
@@ -83,6 +90,13 @@ function isReporterTestable(p: Plugin, part: ReporterTestable) {
         : (p.reporterTestable & part) === part;
 }
 
+const pluginKeysToBind: Array<keyof PluginDef & `${"on" | "render"}${string}`> = [
+    "onBeforeMessageEdit", "onBeforeMessageSend", "onMessageClick",
+    "renderChatBarButton", "renderMemberListDecorator", "renderMessageAccessory", "renderMessageDecoration", "renderMessagePopoverButton"
+];
+
+const neededApiPlugins = new Set<string>();
+
 // First round-trip to mark and force enable dependencies
 //
 // FIXME: might need to revisit this if there's ever nested (dependencies of dependencies) dependencies since this only
@@ -106,12 +120,25 @@ for (const p of pluginsValues) if (isPluginEnabled(p.name)) {
         dep.isDependency = true;
     });
 
-    if (p.commands?.length) {
+    if (p.commands?.length) neededApiPlugins.add("CommandsAPI");
-        Plugins.CommandsAPI.isDependency = true;
+    if (p.onBeforeMessageEdit || p.onBeforeMessageSend || p.onMessageClick) neededApiPlugins.add("MessageEventsAPI");
-        settings.CommandsAPI.enabled = true;
+    if (p.renderChatBarButton) neededApiPlugins.add("ChatInputButtonAPI");
+    if (p.renderMemberListDecorator) neededApiPlugins.add("MemberListDecoratorsAPI");
+    if (p.renderMessageAccessory) neededApiPlugins.add("MessageAccessoriesAPI");
+    if (p.renderMessageDecoration) neededApiPlugins.add("MessageDecorationsAPI");
+    if (p.renderMessagePopoverButton) neededApiPlugins.add("MessagePopoverAPI");
+    if (p.userProfileBadge) neededApiPlugins.add("BadgeAPI");
+
+    for (const key of pluginKeysToBind) {
+        p[key] &&= p[key].bind(p) as any;
     }
 }
 
+for (const p of neededApiPlugins) {
+    Plugins[p].isDependency = true;
+    settings[p].enabled = true;
+}
+
 for (const p of pluginsValues) {
     if (p.settings) {
         p.settings.pluginName = p.name;
@@ -215,7 +242,11 @@ export function subscribeAllPluginsFluxEvents(fluxDispatcher: typeof FluxDispatc
 }
 
 export const startPlugin = traceFunction("startPlugin", function startPlugin(p: Plugin) {
-    const { name, commands, contextMenus } = p;
+    const {
+        name, commands, contextMenus, userProfileBadge,
+        onBeforeMessageEdit, onBeforeMessageSend, onMessageClick,
+        renderChatBarButton, renderMemberListDecorator, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
+    } = p;
 
     if (p.start) {
         logger.info("Starting plugin", name);
@@ -249,7 +280,6 @@ export const startPlugin = traceFunction("startPlugin", function startPlugin(p:
         subscribePluginFluxEvents(p, FluxDispatcher);
     }
 
-
     if (contextMenus) {
         logger.debug("Adding context menus patches of plugin", name);
         for (const navId in contextMenus) {
@@ -257,11 +287,27 @@ export const startPlugin = traceFunction("startPlugin", function startPlugin(p:
         }
     }
 
+    if (userProfileBadge) addProfileBadge(userProfileBadge);
+
+    if (onBeforeMessageEdit) addMessagePreEditListener(onBeforeMessageEdit);
+    if (onBeforeMessageSend) addMessagePreSendListener(onBeforeMessageSend);
+    if (onMessageClick) addMessageClickListener(onMessageClick);
+
+    if (renderChatBarButton) addChatBarButton(name, renderChatBarButton);
+    if (renderMemberListDecorator) addMemberListDecorator(name, renderMemberListDecorator);
+    if (renderMessageDecoration) addMessageDecoration(name, renderMessageDecoration);
+    if (renderMessageAccessory) addMessageAccessory(name, renderMessageAccessory);
+    if (renderMessagePopoverButton) addMessagePopoverButton(name, renderMessagePopoverButton);
+
     return true;
 }, p => `startPlugin ${p.name}`);
 
 export const stopPlugin = traceFunction("stopPlugin", function stopPlugin(p: Plugin) {
-    const { name, commands, contextMenus } = p;
+    const {
+        name, commands, contextMenus, userProfileBadge,
+        onBeforeMessageEdit, onBeforeMessageSend, onMessageClick,
+        renderChatBarButton, renderMemberListDecorator, renderMessageAccessory, renderMessageDecoration, renderMessagePopoverButton
+    } = p;
 
     if (p.stop) {
         logger.info("Stopping plugin", name);
@@ -300,5 +346,17 @@ export const stopPlugin = traceFunction("stopPlugin", function stopPlugin(p: Plu
         }
     }
 
+    if (userProfileBadge) removeProfileBadge(userProfileBadge);
+
+    if (onBeforeMessageEdit) removeMessagePreEditListener(onBeforeMessageEdit);
+    if (onBeforeMessageSend) removeMessagePreSendListener(onBeforeMessageSend);
+    if (onMessageClick) removeMessageClickListener(onMessageClick);
+
+    if (renderChatBarButton) removeChatBarButton(name);
+    if (renderMemberListDecorator) removeMemberListDecorator(name);
+    if (renderMessageDecoration) removeMessageDecoration(name);
+    if (renderMessageAccessory) removeMessageAccessory(name);
+    if (renderMessagePopoverButton) removeMessagePopoverButton(name);
+
     return true;
 }, p => `stopPlugin ${p.name}`);

src/plugins/invisibleChat.desktop/index.tsx

@@ -16,8 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addChatBarButton, ChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
-import { addButton, removeButton } from "@api/MessagePopover";
 import { updateMessage } from "@api/MessageUpdater";
 import { definePluginSettings } from "@api/Settings";
 import ErrorBoundary from "@components/ErrorBoundary";
@@ -66,7 +65,7 @@ function Indicator() {
 
 }
 
-const ChatBarIcon: ChatBarButton = ({ isMainChat }) => {
+const ChatBarIcon: ChatBarButtonFactory = ({ isMainChat }) => {
     if (!isMainChat) return null;
 
     return (
@@ -104,7 +103,7 @@ export default definePlugin({
     name: "InvisibleChat",
     description: "Encrypt your Messages in a non-suspicious way!",
     authors: [Devs.SammCheese],
-    dependencies: ["MessagePopoverAPI", "ChatInputButtonAPI", "MessageUpdaterAPI"],
+    dependencies: ["MessageUpdaterAPI"],
     reporterTestable: ReporterTestable.Patches,
     settings,
 
@@ -125,7 +124,11 @@ export default definePlugin({
         /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/,
     ),
     async start() {
-        addButton("InvisibleChat", message => {
+        const { default: StegCloak } = await getStegCloak();
+        steggo = new StegCloak(true, false);
+    },
+
+    renderMessagePopoverButton(message) {
         return this.INV_REGEX.test(message?.content)
             ? {
                 label: "Decrypt Message",
@@ -142,18 +145,9 @@ export default definePlugin({
                 }
             }
             : null;
-        });
-
-        addChatBarButton("InvisibleChat", ChatBarIcon);
-
-        const { default: StegCloak } = await getStegCloak();
-        steggo = new StegCloak(true, false);
     },
 
-    stop() {
+    renderChatBarButton: ChatBarIcon,
-        removeButton("InvisibleChat");
-        removeButton("InvisibleChat");
-    },
 
     // Gets the Embed of a Link
     async getEmbed(url: URL): Promise<Object | {}> {

src/plugins/messageClickActions/index.ts

@@ -16,7 +16,6 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addClickListener, removeClickListener } from "@api/MessageEvents";
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
@@ -57,15 +56,20 @@ export default definePlugin({
     name: "MessageClickActions",
     description: "Hold Backspace and click to delete, double click to edit/reply",
     authors: [Devs.Ven],
-    dependencies: ["MessageEventsAPI"],
 
     settings,
 
     start() {
         document.addEventListener("keydown", keydown);
         document.addEventListener("keyup", keyup);
+    },
 
-        this.onClick = addClickListener((msg: any, channel, event) => {
+    stop() {
+        document.removeEventListener("keydown", keydown);
+        document.removeEventListener("keyup", keyup);
+    },
+
+    onMessageClick(msg: any, channel, event) {
         const isMe = msg.author.id === UserStore.getCurrentUser().id;
         if (!isDeletePressed) {
             if (event.detail < 2) return;
@@ -111,12 +115,5 @@ export default definePlugin({
             }
             event.preventDefault();
         }
-        });
     },
-
-    stop() {
-        removeClickListener(this.onClick);
-        document.removeEventListener("keydown", keydown);
-        document.removeEventListener("keyup", keyup);
-    }
 });

src/plugins/messageLinkEmbeds/index.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addAccessory, removeAccessory } from "@api/MessageAccessories";
+import { addMessageAccessory, removeMessageAccessory } from "@api/MessageAccessories";
 import { updateMessage } from "@api/MessageUpdater";
 import { definePluginSettings } from "@api/Settings";
 import { getUserSettingLazy } from "@api/UserSettings";
@@ -373,7 +373,7 @@ export default definePlugin({
     settings,
 
     start() {
-        addAccessory("messageLinkEmbed", props => {
+        addMessageAccessory("messageLinkEmbed", props => {
             if (!messageLinkRegex.test(props.message.content))
                 return null;
 
@@ -391,6 +391,6 @@ export default definePlugin({
     },
 
     stop() {
-        removeAccessory("messageLinkEmbed");
+        removeMessageAccessory("messageLinkEmbed");
     }
 });

src/plugins/platformIndicators/index.tsx

@@ -18,9 +18,9 @@
 
 import "./style.css";
 
-import { addBadge, BadgePosition, BadgeUserArgs, ProfileBadge, removeBadge } from "@api/Badges";
+import { addProfileBadge, BadgePosition, BadgeUserArgs, ProfileBadge, removeProfileBadge } from "@api/Badges";
-import { addDecorator, removeDecorator } from "@api/MemberListDecorators";
+import { addMemberListDecorator, removeMemberListDecorator } from "@api/MemberListDecorators";
-import { addDecoration, removeDecoration } from "@api/MessageDecorations";
+import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
 import { Settings } from "@api/Settings";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
@@ -172,26 +172,26 @@ const badge: ProfileBadge = {
 const indicatorLocations = {
     list: {
         description: "In the member list",
-        onEnable: () => addDecorator("platform-indicator", props =>
+        onEnable: () => addMemberListDecorator("platform-indicator", props =>
             <ErrorBoundary noop>
                 <PlatformIndicator user={props.user} small={true} />
             </ErrorBoundary>
         ),
-        onDisable: () => removeDecorator("platform-indicator")
+        onDisable: () => removeMemberListDecorator("platform-indicator")
     },
     badges: {
         description: "In user profiles, as badges",
-        onEnable: () => addBadge(badge),
+        onEnable: () => addProfileBadge(badge),
-        onDisable: () => removeBadge(badge)
+        onDisable: () => removeProfileBadge(badge)
     },
     messages: {
         description: "Inside messages",
-        onEnable: () => addDecoration("platform-indicator", props =>
+        onEnable: () => addMessageDecoration("platform-indicator", props =>
             <ErrorBoundary noop>
                 <PlatformIndicator user={props.message?.author} wantTopMargin={true} />
             </ErrorBoundary>
         ),
-        onDisable: () => removeDecoration("platform-indicator")
+        onDisable: () => removeMessageDecoration("platform-indicator")
     }
 };
 

src/plugins/previewMessage/index.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addChatBarButton, ChatBarButton, removeChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
 import { generateId, sendBotMessage } from "@api/Commands";
 import { Devs } from "@utils/constants";
 import definePlugin, { StartAt } from "@utils/types";
@@ -73,7 +73,7 @@ const getAttachments = async (channelId: string) =>
     );
 
 
-const PreviewButton: ChatBarButton = ({ isMainChat, isEmpty, type: { attachments } }) => {
+const PreviewButton: ChatBarButtonFactory = ({ isMainChat, isEmpty, type: { attachments } }) => {
     const channelId = SelectedChannelStore.getChannelId();
     const draft = useStateFromStores([DraftStore], () => getDraft(channelId));
 
@@ -121,11 +121,9 @@ export default definePlugin({
     name: "PreviewMessage",
     description: "Lets you preview your message before sending it.",
     authors: [Devs.Aria],
-    dependencies: ["ChatInputButtonAPI"],
     // start early to ensure we're the first plugin to add our button
     // This makes the popping in less awkward
     startAt: StartAt.Init,
 
-    start: () => addChatBarButton("previewMessage", PreviewButton),
+    renderChatBarButton: PreviewButton,
-    stop: () => removeChatBarButton("previewMessage"),
 });

src/plugins/quickMention/index.tsx

@@ -16,7 +16,6 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addButton, removeButton } from "@api/MessagePopover";
 import { Devs } from "@utils/constants";
 import { insertTextIntoChatInputBox } from "@utils/discord";
 import definePlugin from "@utils/types";
@@ -26,10 +25,8 @@ export default definePlugin({
     name: "QuickMention",
     authors: [Devs.kemo],
     description: "Adds a quick mention button to the message actions bar",
-    dependencies: ["MessagePopoverAPI"],
 
-    start() {
+    renderMessagePopoverButton(msg) {
-        addButton("QuickMention", msg => {
         const channel = ChannelStore.getChannel(msg.channel_id);
         if (channel.guild_id && !PermissionStore.can(PermissionsBits.SEND_MESSAGES, channel)) return null;
 
@@ -40,10 +37,6 @@ export default definePlugin({
             channel,
             onClick: () => insertTextIntoChatInputBox(`<@${msg.author.id}> `)
         };
-        });
-    },
-    stop() {
-        removeButton("QuickMention");
     },
 
     Icon: () => (

src/plugins/sendTimestamps/index.tsx

@@ -18,8 +18,7 @@
 
 import "./styles.css";
 
-import { addChatBarButton, ChatBarButton, removeChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
-import { addPreSendListener, removePreSendListener } from "@api/MessageEvents";
 import { definePluginSettings } from "@api/Settings";
 import { classNameFactory } from "@api/Styles";
 import { Devs } from "@utils/constants";
@@ -123,7 +122,7 @@ function PickerModal({ rootProps, close }: { rootProps: ModalProps, close(): voi
     );
 }
 
-const ChatBarIcon: ChatBarButton = ({ isMainChat }) => {
+const ChatBarIcon: ChatBarButtonFactory = ({ isMainChat }) => {
     if (!isMainChat) return null;
 
     return (
@@ -160,22 +159,14 @@ export default definePlugin({
     name: "SendTimestamps",
     description: "Send timestamps easily via chat box button & text shortcuts. Read the extended description!",
     authors: [Devs.Ven, Devs.Tyler, Devs.Grzesiek11],
-    dependencies: ["MessageEventsAPI", "ChatInputButtonAPI"],
-
     settings,
 
-    start() {
+    renderChatBarButton: ChatBarIcon,
-        addChatBarButton("SendTimestamps", ChatBarIcon);
+
-        this.listener = addPreSendListener((_, msg) => {
+    onBeforeMessageSend(_, msg) {
         if (settings.store.replaceMessageContents) {
             msg.content = msg.content.replace(/`\d{1,2}:\d{2} ?(?:AM|PM)?`/gi, parseTime);
         }
-        });
-    },
-
-    stop() {
-        removeChatBarButton("SendTimestamps");
-        removePreSendListener(this.listener);
     },
 
     settingsAboutComponent() {

src/plugins/silentMessageToggle/index.tsx

@@ -16,8 +16,8 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addChatBarButton, ChatBarButton, removeChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
-import { addPreSendListener, removePreSendListener, SendListener } from "@api/MessageEvents";
+import { addMessagePreSendListener, MessageSendListener, removeMessagePreSendListener } from "@api/MessageEvents";
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
@@ -41,7 +41,7 @@ const settings = definePluginSettings({
     }
 });
 
-const SilentMessageToggle: ChatBarButton = ({ isMainChat }) => {
+const SilentMessageToggle: ChatBarButtonFactory = ({ isMainChat }) => {
     const [enabled, setEnabled] = useState(lastState);
 
     function setEnabledValue(value: boolean) {
@@ -50,15 +50,15 @@ const SilentMessageToggle: ChatBarButton = ({ isMainChat }) => {
     }
 
     useEffect(() => {
-        const listener: SendListener = (_, message) => {
+        const listener: MessageSendListener = (_, message) => {
             if (enabled) {
                 if (settings.store.autoDisable) setEnabledValue(false);
                 if (!message.content.startsWith("@silent ")) message.content = "@silent " + message.content;
             }
         };
 
-        addPreSendListener(listener);
+        addMessagePreSendListener(listener);
-        return () => void removePreSendListener(listener);
+        return () => void removeMessagePreSendListener(listener);
     }, [enabled]);
 
     if (!isMainChat) return null;
@@ -91,9 +91,7 @@ export default definePlugin({
     name: "SilentMessageToggle",
     authors: [Devs.Nuckyz, Devs.CatNoir],
     description: "Adds a button to the chat bar to toggle sending a silent message.",
-    dependencies: ["MessageEventsAPI", "ChatInputButtonAPI"],
     settings,
 
-    start: () => addChatBarButton("SilentMessageToggle", SilentMessageToggle),
+    renderChatBarButton: SilentMessageToggle,
-    stop: () => removeChatBarButton("SilentMessageToggle")
 });

src/plugins/silentTyping/index.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addChatBarButton, ChatBarButton, removeChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
 import { ApplicationCommandInputType, ApplicationCommandOptionType, findOption, sendBotMessage } from "@api/Commands";
 import { findGroupChildrenByChildId, NavContextMenuPatchCallback } from "@api/ContextMenu";
 import { definePluginSettings } from "@api/Settings";
@@ -43,7 +43,7 @@ const settings = definePluginSettings({
     }
 });
 
-const SilentTypingToggle: ChatBarButton = ({ isMainChat }) => {
+const SilentTypingToggle: ChatBarButtonFactory = ({ isMainChat }) => {
     const { isEnabled, showIcon } = settings.use(["isEnabled", "showIcon"]);
     const toggle = () => settings.store.isEnabled = !settings.store.isEnabled;
 
@@ -96,11 +96,12 @@ export default definePlugin({
     name: "SilentTyping",
     authors: [Devs.Ven, Devs.Rini, Devs.ImBanana],
     description: "Hide that you are typing",
-    dependencies: ["ChatInputButtonAPI"],
     settings,
+
     contextMenus: {
         "textarea-context": ChatBarContextCheckbox
     },
+
     patches: [
         {
             find: '.dispatch({type:"TYPING_START_LOCAL"',
@@ -136,6 +137,5 @@ export default definePlugin({
         FluxDispatcher.dispatch({ type: "TYPING_START_LOCAL", channelId });
     },
 
-    start: () => addChatBarButton("SilentTyping", SilentTypingToggle),
+    renderChatBarButton: SilentTypingToggle,
-    stop: () => removeChatBarButton("SilentTyping"),
 });

src/plugins/textReplace/index.tsx

@@ -17,7 +17,6 @@
 */
 
 import { DataStore } from "@api/index";
-import { addPreSendListener, removePreSendListener } from "@api/MessageEvents";
 import { definePluginSettings } from "@api/Settings";
 import { Flex } from "@components/Flex";
 import { DeleteIcon } from "@components/Icons";
@@ -244,22 +243,17 @@ export default definePlugin({
     name: "TextReplace",
     description: "Replace text in your messages. You can find pre-made rules in the #textreplace-rules channel in Vencord's Server",
     authors: [Devs.AutumnVN, Devs.TheKodeToad],
-    dependencies: ["MessageEventsAPI"],
 
     settings,
 
+    onBeforeMessageSend(channelId, msg) {
+        // Channel used for sharing rules, applying rules here would be messy
+        if (channelId === TEXT_REPLACE_RULES_CHANNEL_ID) return;
+        msg.content = applyRules(msg.content);
+    },
+
     async start() {
         stringRules = await DataStore.get(STRING_RULES_KEY) ?? makeEmptyRuleArray();
         regexRules = await DataStore.get(REGEX_RULES_KEY) ?? makeEmptyRuleArray();
-
-        this.preSend = addPreSendListener((channelId, msg) => {
-            // Channel used for sharing rules, applying rules here would be messy
-            if (channelId === TEXT_REPLACE_RULES_CHANNEL_ID) return;
-            msg.content = applyRules(msg.content);
-        });
-    },
-
-    stop() {
-        removePreSendListener(this.preSend);
     }
 });

src/plugins/translate/TranslateIcon.tsx

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { ChatBarButton } from "@api/ChatButtons";
+import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
 import { classes } from "@utils/misc";
 import { openModal } from "@utils/modal";
 import { Alerts, Forms, Tooltip, useEffect, useState } from "@webpack/common";
@@ -40,7 +40,7 @@ export function TranslateIcon({ height = 24, width = 24, className }: { height?:
 
 export let setShouldShowTranslateEnabledTooltip: undefined | ((show: boolean) => void);
 
-export const TranslateChatBarIcon: ChatBarButton = ({ isMainChat }) => {
+export const TranslateChatBarIcon: ChatBarButtonFactory = ({ isMainChat }) => {
     const { autoTranslate, showChatBarButton } = settings.use(["autoTranslate", "showChatBarButton"]);
 
     const [shouldShowTranslateEnabledTooltip, setter] = useState(false);

src/plugins/translate/index.tsx

@@ -18,11 +18,7 @@
 
 import "./styles.css";
 
-import { addChatBarButton, removeChatBarButton } from "@api/ChatButtons";
 import { findGroupChildrenByChildId, NavContextMenuPatchCallback } from "@api/ContextMenu";
-import { addAccessory, removeAccessory } from "@api/MessageAccessories";
-import { addPreSendListener, removePreSendListener } from "@api/MessageEvents";
-import { addButton, removeButton } from "@api/MessagePopover";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
 import { ChannelStore, Menu } from "@webpack/common";
@@ -51,11 +47,12 @@ const messageCtxPatch: NavContextMenuPatchCallback = (children, { message }) =>
     ));
 };
 
+let tooltipTimeout: any;
+
 export default definePlugin({
     name: "Translate",
     description: "Translate messages with Google Translate or DeepL",
     authors: [Devs.Ven, Devs.AshtonMemer],
-    dependencies: ["MessageAccessoriesAPI", "MessagePopoverAPI", "MessageEventsAPI", "ChatInputButtonAPI"],
     settings,
     contextMenus: {
         "message": messageCtxPatch
@@ -63,12 +60,11 @@ export default definePlugin({
     // not used, just here in case some other plugin wants it or w/e
     translate,
 
-    start() {
+    renderMessageAccessory: props => <TranslationAccessory message={props.message} />,
-        addAccessory("vc-translation", props => <TranslationAccessory message={props.message} />);
 
-        addChatBarButton("vc-translate", TranslateChatBarIcon);
+    renderChatBarButton: TranslateChatBarIcon,
 
-        addButton("vc-translate", message => {
+    renderMessagePopoverButton(message) {
         if (!message.content) return null;
 
         return {
@@ -81,10 +77,9 @@ export default definePlugin({
                 handleTranslate(message.id, trans);
             }
         };
-        });
+    },
 
-        let tooltipTimeout: any;
+    async onBeforeMessageSend(_, message) {
-        this.preSend = addPreSendListener(async (_, message) => {
         if (!settings.store.autoTranslate) return;
         if (!message.content) return;
 
@@ -94,14 +89,5 @@ export default definePlugin({
 
         const trans = await translate("sent", message.content);
         message.content = trans.text;
-
+    }
-        });
-    },
-
-    stop() {
-        removePreSendListener(this.preSend);
-        removeChatBarButton("vc-translate");
-        removeButton("vc-translate");
-        removeAccessory("vc-translation");
-    },
 });

src/plugins/unindent/index.ts

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { addPreEditListener, addPreSendListener, MessageObject, removePreEditListener, removePreSendListener } from "@api/MessageEvents";
+import { MessageObject } from "@api/MessageEvents";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
 
@@ -24,7 +24,7 @@ export default definePlugin({
     name: "Unindent",
     description: "Trims leading indentation from codeblocks",
     authors: [Devs.Ven],
-    dependencies: ["MessageEventsAPI"],
+
     patches: [
         {
             find: "inQuote:",
@@ -55,13 +55,11 @@ export default definePlugin({
         });
     },
 
-    start() {
+    onBeforeMessageSend(_, msg) {
-        this.preSend = addPreSendListener((_, msg) => this.unindentMsg(msg));
+        return this.unindentMsg(msg);
-        this.preEdit = addPreEditListener((_cid, _mid, msg) => this.unindentMsg(msg));
     },
 
-    stop() {
+    onBeforeMessageEdit(_cid, _mid, msg) {
-        removePreSendListener(this.preSend);
+        return this.unindentMsg(msg);
-        removePreEditListener(this.preEdit);
     }
 });

src/plugins/userVoiceShow/index.tsx

@@ -18,8 +18,8 @@
 
 import "./style.css";
 
-import { addDecorator, removeDecorator } from "@api/MemberListDecorators";
+import { addMemberListDecorator, removeMemberListDecorator } from "@api/MemberListDecorators";
-import { addDecoration, removeDecoration } from "@api/MessageDecorations";
+import { addMessageDecoration, removeMessageDecoration } from "@api/MessageDecorations";
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
@@ -96,16 +96,16 @@ export default definePlugin({
 
     start() {
         if (settings.store.showInMemberList) {
-            addDecorator("UserVoiceShow", ({ user }) => user == null ? null : <VoiceChannelIndicator userId={user.id} />);
+            addMemberListDecorator("UserVoiceShow", ({ user }) => user == null ? null : <VoiceChannelIndicator userId={user.id} />);
         }
         if (settings.store.showInMessages) {
-            addDecoration("UserVoiceShow", ({ message }) => message?.author == null ? null : <VoiceChannelIndicator userId={message.author.id} isMessageIndicator />);
+            addMessageDecoration("UserVoiceShow", ({ message }) => message?.author == null ? null : <VoiceChannelIndicator userId={message.author.id} isMessageIndicator />);
         }
     },
 
     stop() {
-        removeDecorator("UserVoiceShow");
+        removeMemberListDecorator("UserVoiceShow");
-        removeDecoration("UserVoiceShow");
+        removeMessageDecoration("UserVoiceShow");
     },
 
     VoiceChannelIndicator

src/plugins/viewRaw/index.tsx

@@ -17,7 +17,6 @@
 */
 
 import { NavContextMenuPatchCallback } from "@api/ContextMenu";
-import { addButton, removeButton } from "@api/MessagePopover";
 import { definePluginSettings } from "@api/Settings";
 import { CodeBlock } from "@components/CodeBlock";
 import ErrorBoundary from "@components/ErrorBoundary";
@@ -149,8 +148,8 @@ export default definePlugin({
     name: "ViewRaw",
     description: "Copy and view the raw content/data of any message, channel or guild",
     authors: [Devs.KingFish, Devs.Ven, Devs.rad, Devs.ImLvna],
-    dependencies: ["MessagePopoverAPI"],
     settings,
+
     contextMenus: {
         "guild-context": MakeContextCallback("Guild"),
         "channel-context": MakeContextCallback("Channel"),
@@ -159,8 +158,7 @@ export default definePlugin({
         "user-context": MakeContextCallback("User")
     },
 
-    start() {
+    renderMessagePopoverButton(msg) {
-        addButton("ViewRaw", msg => {
         const handleClick = () => {
             if (settings.store.clickMethod === "Right") {
                 copyWithToast(msg.content);
@@ -193,10 +191,5 @@ export default definePlugin({
             onClick: handleClick,
             onContextMenu: handleContextMenu
         };
-        });
-    },
-
-    stop() {
-        removeButton("ViewRaw");
     }
 });

src/utils/types.ts

@@ -16,8 +16,15 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import { ProfileBadge } from "@api/Badges";
+import { ChatBarButtonFactory } from "@api/ChatButtons";
 import { Command } from "@api/Commands";
 import { NavContextMenuPatchCallback } from "@api/ContextMenu";
+import { MemberListDecoratorFactory } from "@api/MemberListDecorators";
+import { MessageAccessoryFactory } from "@api/MessageAccessories";
+import { MessageDecorationFactory } from "@api/MessageDecorations";
+import { MessageClickListener, MessageEditListener, MessageSendListener } from "@api/MessageEvents";
+import { MessagePopoverButtonFactory } from "@api/MessagePopover";
 import { FluxEvents } from "@webpack/types";
 import { JSX } from "react";
 import { Promisable } from "type-fest";
@@ -142,6 +149,20 @@ export interface PluginDef {
     toolboxActions?: Record<string, () => void>;
 
     tags?: string[];
+
+    userProfileBadge?: ProfileBadge;
+
+    onMessageClick?: MessageClickListener;
+    onBeforeMessageSend?: MessageSendListener;
+    onBeforeMessageEdit?: MessageEditListener;
+
+    renderMessagePopoverButton?: MessagePopoverButtonFactory;
+    renderMessageAccessory?: MessageAccessoryFactory;
+    renderMessageDecoration?: MessageDecorationFactory;
+
+    renderMemberListDecorator?: MemberListDecoratorFactory;
+
+    renderChatBarButton?: ChatBarButtonFactory;
 }
 
 export const enum StartAt {