PluginCard: Modified Icon, Tooltips, Update Icon Paths

2025-10-12 23:39:43 -04:00 · 2025-10-12 23:39:43 -04:00 · 3a8a9d9260
commit 3a8a9d9260
parent 0f2662b5aa
10 changed files with 79 additions and 39 deletions
--- a/scripts/generateEquicordPluginList.ts
+++ b/scripts/generateEquicordPluginList.ts
@ -48,6 +48,7 @@ interface PluginData {
    target: "discordDesktop" | "vesktop" | "equibop" | "desktop" | "web" | "dev";
    filePath: string;
    dirName: string;
+    isModified: boolean;
 }

 const devs = {} as Record<string, Dev>;
@ -150,6 +151,7 @@ async function parseFile(fileName: string) {
            hasCommands: false,
            enabledByDefault: false,
            required: false,
+            isModified: false,
            tags: [] as string[]
        } as PluginData;

@ -219,6 +221,7 @@ async function parseFile(fileName: string) {
                    data.dependencies = (elements as NodeArray<StringLiteral>).map(e => e.text);
                    break;
                case "required":
+                case "isModified":
                case "enabledByDefault":
                    data[key] = value.kind === SyntaxKind.TrueKeyword;
                    break;
--- a/scripts/generatePluginList.ts
+++ b/scripts/generatePluginList.ts
@ -48,6 +48,7 @@ interface PluginData {
    target: "discordDesktop" | "vesktop" | "equibop" | "desktop" | "web" | "dev";
    filePath: string;
    dirName: string;
+    isModified: boolean;
 }

 const devs = {} as Record<string, Dev>;
@ -150,6 +151,7 @@ async function parseFile(fileName: string) {
            hasCommands: false,
            enabledByDefault: false,
            required: false,
+            isModified: false,
            tags: [] as string[]
        } as PluginData;

@ -219,6 +221,7 @@ async function parseFile(fileName: string) {
                    data.dependencies = (elements as NodeArray<StringLiteral>).map(e => e.text);
                    break;
                case "required":
+                case "isModified":
                case "enabledByDefault":
                    data[key] = value.kind === SyntaxKind.TrueKeyword;
                    break;
--- a/scripts/generateVencordPluginList.ts
+++ b/scripts/generateVencordPluginList.ts
@ -48,6 +48,7 @@ interface PluginData {
    target: "discordDesktop" | "vesktop" | "equibop" | "desktop" | "web" | "dev";
    filePath: string;
    dirName: string;
+    isModified: boolean;
 }
 const devs = {} as Record<string, Dev>;
 const equicordDevs = {} as Record<string, Dev>;
@ -149,6 +150,7 @@ async function parseFile(fileName: string) {
            hasCommands: false,
            enabledByDefault: false,
            required: false,
+            isModified: false,
            tags: [] as string[]
        } as PluginData;

@ -218,6 +220,7 @@ async function parseFile(fileName: string) {
                    data.dependencies = (elements as NodeArray<StringLiteral>).map(e => e.text);
                    break;
                case "required":
+                case "isModified":
                case "enabledByDefault":
                    data[key] = value.kind === SyntaxKind.TrueKeyword;
                    break;
--- a/src/components/settings/AddonCard.tsx
+++ b/src/components/settings/AddonCard.tsx
@ -22,7 +22,7 @@ import { classNameFactory } from "@api/Styles";
 import { BaseText } from "@components/BaseText";
 import { AddonBadge } from "@components/settings/PluginBadge";
 import { Switch } from "@components/Switch";
-import { useRef } from "@webpack/common";
+import { Tooltip, useRef } from "@webpack/common";
 import type { MouseEventHandler, ReactNode } from "react";

 import { useTruncatedText } from "./tabs/plugins/components/truncateText";
@ -37,6 +37,7 @@ interface Props {
    disabled?: boolean;
    isNew?: boolean;
    sourceBadge?: ReactNode;
+    tooltip?: string;
    onMouseEnter?: MouseEventHandler<HTMLDivElement>;
    onMouseLeave?: MouseEventHandler<HTMLDivElement>;

@ -45,7 +46,7 @@ interface Props {
    author?: ReactNode;
 }

-export function AddonCard({ disabled, isNew, sourceBadge, name, infoButton, footer, author, enabled, setEnabled, description, onMouseEnter, onMouseLeave }: Props) {
+export function AddonCard({ disabled, isNew, sourceBadge, tooltip, name, infoButton, footer, author, enabled, setEnabled, description, onMouseEnter, onMouseLeave }: Props) {
    const titleRef = useRef<HTMLDivElement>(null);
    const titleContainerRef = useRef<HTMLDivElement>(null);
    const { truncated, containerRef } = useTruncatedText(description ? description.toString() : "");
@ -75,7 +76,6 @@ export function AddonCard({ disabled, isNew, sourceBadge, name, infoButton, foot
                            </div>
                        </div>
                        {isNew && <AddonBadge text="NEW" color="#ED4245" />}
-                        {sourceBadge}
                    </BaseText>

                    {!!author && (
@ -85,6 +85,18 @@ export function AddonCard({ disabled, isNew, sourceBadge, name, infoButton, foot
                    )}
                </div>

+                <Tooltip text={tooltip}>
+                    {({ onMouseEnter, onMouseLeave }) => (
+                        <div
+                            className={cl("source")}
+                            onMouseEnter={onMouseEnter}
+                            onMouseLeave={onMouseLeave}
+                        >
+                            {sourceBadge}
+                        </div>
+                    )}
+                </Tooltip>
+
                {infoButton}

                <Switch
--- a/src/components/settings/tabs/plugins/PluginCard.tsx
+++ b/src/components/settings/tabs/plugins/PluginCard.tsx
@ -38,7 +38,9 @@ export function PluginCard({ plugin, disabled, onRestartNeeded, onMouseEnter, on
    const settings = Settings.plugins[plugin.name];
    const pluginMeta = PluginMeta[plugin.name];
    const isEquicordPlugin = pluginMeta.folderName.startsWith("src/equicordplugins/") ?? false;
-    const isUserplugin = pluginMeta.userPlugin ?? false;
+    const isVencordPlugin = pluginMeta.folderName.startsWith("src/plugins/") ?? false;
+    const isUserPlugin = pluginMeta.userPlugin ?? false;
+    const isModifiedPlugin = plugin?.isModified ?? false;

    const isEnabled = () => isPluginEnabled(plugin.name);

@ -92,48 +94,50 @@ export function PluginCard({ plugin, disabled, onRestartNeeded, onMouseEnter, on
        settings.enabled = !wasEnabled;
    }

-    const sourceBadge = isEquicordPlugin ? (
+    const pluginInfo = [
+        {
+            condition: isModifiedPlugin,
+            src: "https://equicord.org/assets/icons/equicord/modified.png",
+            alt: "Modified",
+            title: "Modified Vencord Plugin"
+        },
+        {
+            condition: isEquicordPlugin,
+            src: "https://equicord.org/assets/icons/equicord/icon.png",
+            alt: "Equicord",
+            title: "Equicord Plugin"
+        },
+        {
+            condition: isVencordPlugin,
+            src: "https://equicord.org/assets/icons/vencord/icon-light.png",
+            alt: "Vencord",
+            title: "Vencord Plugin"
+        },
+        {
+            condition: isUserPlugin,
+            src: "https://equicord.org/assets/icons/misc/userplugin.png",
+            alt: "User",
+            title: "User Plugin"
+        }
+    ];
+
+    const pluginDetails = pluginInfo.find(p => p.condition);
+
+    const sourceBadge = pluginDetails ? (
        <img
-            src="https://equicord.org/assets/favicon.png"
-            alt="Equicord"
-            title="Equicord Plugin"
-            style={{
-                width: "20px",
-                height: "20px",
-                marginLeft: "8px",
-                borderRadius: "2px"
-            }}
+            src={pluginDetails.src}
+            alt={pluginDetails.alt}
+            className={cl("source")}
        />
-    ) : isUserplugin ? (
-        <img
-            src="https://equicord.org/assets/icons/userplugin.png"
-            alt="Userplugin"
-            title="Userplugin"
-            style={{
-                width: "20px",
-                height: "20px",
-                marginLeft: "8px",
-                borderRadius: "2px"
-            }}
-        />
-    ) : (
-        <img
-            src="https://vencord.dev/assets/favicon-dark.png"
-            alt="Vencord"
-            title="Vencord Plugin"
-            style={{
-                width: "20px",
-                height: "20px",
-                marginLeft: "8px",
-                borderRadius: "2px"
-            }}
-        />
-    );
+    ) : null;
+
+    const tooltip = pluginDetails?.title || "Unknown Plugin";

    return (
        <AddonCard
            name={plugin.name}
            sourceBadge={sourceBadge}
+            tooltip={tooltip}
            description={plugin.description}
            isNew={isNew}
            enabled={isEnabled()}
--- a/src/components/settings/tabs/plugins/styles.css
+++ b/src/components/settings/tabs/plugins/styles.css
@ -278,4 +278,11 @@
    align-items: center;
    justify-content: center;
    gap: 8px;
+}
+
+.vc-plugins-source {
+    width: 22px;
+    height: 22px;
+    margin-top: 2px;
+    margin-right: 8px;
 }
--- a/src/plugins/noBlockedMessages/index.ts
+++ b/src/plugins/noBlockedMessages/index.ts
@ -90,6 +90,7 @@ export default definePlugin({
    name: "NoBlockedMessages",
    description: "Hide all blocked/ignored messages from chat completely.",
    authors: [Devs.rushii, Devs.Samu, Devs.jamesbt365, Devs.Elvyra, EquicordDevs.Etorix],
+    isModified: true,
    settings,
    patches: [
        ...[
--- a/src/plugins/showMeYourName/index.tsx
+++ b/src/plugins/showMeYourName/index.tsx
@ -780,6 +780,7 @@ export default definePlugin({
    name: "ShowMeYourName",
    description: "Display any permutation of nicknames, display names, and usernames in chat.",
    authors: [Devs.Rini, Devs.TheKodeToad, EquicordDevs.Etorix, Devs.sadan],
+    isModified: true,
    settings,

    patches: [
--- a/src/plugins/silentTyping/index.tsx
+++ b/src/plugins/silentTyping/index.tsx
@ -289,6 +289,7 @@ export default definePlugin({
    authors: [Devs.Ven, Devs.Rini, Devs.ImBanana, EquicordDevs.Etorix],
    description: "Hide your typing indicator from chat.",
    dependencies: ["ChatInputButtonAPI"],
+    isModified: true,
    settings,

    shouldHideChatBarTypingIndicators,
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@ -187,6 +187,11 @@ export interface PluginDef {
    renderNicknameIcon?: NicknameIconFactory;

    renderChatBarButton?: ChatBarButtonFactory;
+
+    /**
+     * A Vencord plugin that is modified for extra features in Equicord
+     */
+    isModified?: boolean;
 }

 export const enum StartAt {