Merge 9494c07562 into 8afd79dd50

Co-authored-by: lewisakura <lewi@lewisakura.moe>
Co-authored-by: Vendicated <vendicated@riseup.net>

src/components/PluginSettings/index.tsx

@@ -292,10 +292,10 @@ export default function PluginSettings() {
 
         if (!pluginFilter(p)) continue;
 
-        const isRequired = p.required || depMap[p.name]?.some(d => settings.plugins[d].enabled);
+        const isRequired = p.required || p.isDependency || depMap[p.name]?.some(d => settings.plugins[d].enabled);
 
         if (isRequired) {
-            const tooltipText = p.required
+            const tooltipText = p.required || !depMap[p.name]
                 ? "This plugin is required for Vencord to function."
                 : makeDependencyList(depMap[p.name]?.filter(d => settings.plugins[d].enabled));
 

src/plugins/_core/supportHelper.tsx

@@ -142,7 +142,7 @@ export default definePlugin({
     required: true,
     description: "Helps us provide support to you",
     authors: [Devs.Ven],
-    dependencies: ["CommandsAPI", "UserSettingsAPI", "MessageAccessoriesAPI"],
+    dependencies: ["UserSettingsAPI", "MessageAccessoriesAPI"],
 
     settings,
 

src/plugins/bannersEverywhere/README.md

@@ -0,0 +1,5 @@
+# BannersEverywhere
+
+Displays nitro and USRBG banners as a background in the member list
+
+![](https://github.com/Vendicated/Vencord/assets/44179559/d8a3a2f2-8491-4a4f-b43e-22fdf46622e5)

src/plugins/bannersEverywhere/index.css

@@ -0,0 +1,13 @@
+/* stylelint-disable property-no-vendor-prefix */
+.vc-banners-everywhere-memberlist {
+    opacity: 0.8;
+    -webkit-mask-image: linear-gradient(to right, transparent 20%, #fff);
+    mask-image: linear-gradient(to right, transparent 20%, #fff);
+    height: 100%;
+    width: 100%;
+    background-size: cover;
+    background-position: center;
+    position: absolute;
+    border-radius: 4px;
+    cursor: pointer;
+}

src/plugins/bannersEverywhere/index.tsx

@@ -0,0 +1,117 @@
+/*
+ * Vencord, a Discord client mod
+ * Copyright (c) 2023 Vendicated and contributors
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ */
+
+import "./index.css";
+
+import { definePluginSettings } from "@api/Settings";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Devs } from "@utils/constants";
+import { fetchUserProfile } from "@utils/discord";
+import { Queue } from "@utils/Queue";
+import { useAwaiter } from "@utils/react";
+import definePlugin, { OptionType } from "@utils/types";
+import { useEffect, UserProfileStore, useStateFromStores } from "@webpack/common";
+import { User } from "discord-types/general";
+
+const settings = definePluginSettings({
+    animate: {
+        description: "Animate banners",
+        type: OptionType.BOOLEAN,
+        default: false
+    },
+});
+
+const discordQueue = new Queue();
+const usrbgQueue = new Queue();
+
+
+const useFetchMemberProfile = (userId: string): string => {
+    const profile = useStateFromStores([UserProfileStore], () => UserProfileStore.getUserProfile(userId));
+
+    const usrbgUrl = (Vencord.Plugins.plugins.USRBG as any)?.getImageUrl(userId);
+
+    useEffect(() => {
+        if (usrbgUrl) return;
+        let cancel = false;
+
+        discordQueue.push(() => {
+            if (cancel) return Promise.resolve(void 0);
+            return fetchUserProfile(userId).finally(async () => {
+                await new Promise<void>(resolve => setTimeout(resolve, 1000));
+            });
+        });
+
+        return () => { cancel = true; };
+    }, []);
+
+    if (usrbgUrl) return usrbgUrl;
+
+    if (!profile?.banner) return "";
+    const extension = settings.store.animate && profile.banner.startsWith("a_")
+        ? ".gif"
+        : ".png";
+    return `https://cdn.discordapp.com/banners/${userId}/${profile.banner}${extension}`;
+};
+export default definePlugin({
+    name: "BannersEverywhere",
+    description: "Displays banners in the member list ",
+    authors: [Devs.ImLvna, Devs.AutumnVN],
+    settings,
+    patches: [
+        {
+            find: ".Messages.GUILD_OWNER,",
+            replacement:
+            {
+                // We add the banner as a property while we can still access the user id
+                match: /verified:(\i).isVerifiedBot.*?name:null.*?(?=avatar:)/,
+                replace: "$&banner:$self.memberListBanner({user: $1}),",
+            },
+        },
+        {
+            find: "role:\"listitem\",innerRef",
+            replacement:
+            {
+                // We cant access the user id here, so we take the banner property we set earlier
+                match: /let{avatar:\i.*?focusProps:\i.*?=(\i).*?children:\[/,
+                replace: "$&$1.banner,"
+            }
+        }
+
+    ],
+
+    memberListBanner: ErrorBoundary.wrap(({ user }: { user: User; }) => {
+        const url = useFetchMemberProfile(user.id);
+
+        const [shouldShow] = useAwaiter(async () => {
+            // This will get re-run when the url changes
+            if (!url || url === "") return false;
+            if (!settings.store.animate) {
+                // Discord cdn can return both png and gif, useFetchMemberProfile gives it respectively
+                if (url!.includes("cdn.discordapp.com")) return true;
+
+                // HEAD request to check if the image is a png
+                return await new Promise(resolve => {
+                    usrbgQueue.push(() => fetch(url!.replace(".gif", ".png"), { method: "HEAD" }).then(async res => {
+                        console.log(res);
+                        await new Promise<void>(resolve => setTimeout(resolve, 1000));
+                        resolve(res.ok && res.headers.get("content-type")?.startsWith("image/png"));
+                        return;
+                    }));
+                });
+            }
+            return true;
+        }, { fallbackValue: false, deps: [url] });
+
+        if (!shouldShow) return null;
+        return (
+            <img src={url} className="vc-banners-everywhere-memberlist"></img>
+        );
+    }, { noop: true }),
+
+
+
+
+});

src/plugins/friendInvites/index.ts

@@ -27,7 +27,6 @@ export default definePlugin({
     name: "FriendInvites",
     description: "Create and manage friend invite links via slash commands (/create friend invite, /view friend invites, /revoke friend invites).",
     authors: [Devs.afn, Devs.Dziurwa],
-    dependencies: ["CommandsAPI"],
     commands: [
         {
             name: "create friend invite",

src/plugins/index.ts

@@ -105,6 +105,11 @@ for (const p of pluginsValues) if (isPluginEnabled(p.name)) {
         settings[d].enabled = true;
         dep.isDependency = true;
     });
+
+    if (p.commands?.length) {
+        Plugins.CommandsAPI.isDependency = true;
+        settings.CommandsAPI.enabled = true;
+    }
 }
 
 for (const p of pluginsValues) {

src/plugins/messageTags/index.ts

@@ -82,7 +82,6 @@ export default definePlugin({
             default: true
         }
     },
-    dependencies: ["CommandsAPI"],
 
     async start() {
         for (const tag of await getTags()) createTagCommand(tag);

src/plugins/moreCommands/index.ts

@@ -33,7 +33,6 @@ export default definePlugin({
     name: "MoreCommands",
     description: "echo, lenny, mock",
     authors: [Devs.Arjix, Devs.echo, Devs.Samu],
-    dependencies: ["CommandsAPI"],
     commands: [
         {
             name: "echo",

src/plugins/moreKaomoji/index.ts

@@ -24,7 +24,6 @@ export default definePlugin({
     name: "MoreKaomoji",
     description: "Adds more Kaomoji to discord. ヽ(´▽`)/",
     authors: [Devs.JacobTm],
-    dependencies: ["CommandsAPI"],
     commands: [
         { name: "dissatisfaction", description: " ＞﹏＜" },
         { name: "smug", description: "ಠ_ಠ" },

src/plugins/petpet/index.ts

@@ -88,7 +88,6 @@ export default definePlugin({
     name: "petpet",
     description: "Adds a /petpet slash command to create headpet gifs from any image",
     authors: [Devs.Ven],
-    dependencies: ["CommandsAPI"],
     commands: [
         {
             inputType: ApplicationCommandInputType.BUILT_IN,

src/plugins/silentTyping/index.tsx

@@ -88,7 +88,7 @@ export default definePlugin({
     name: "SilentTyping",
     authors: [Devs.Ven, Devs.Rini, Devs.ImBanana],
     description: "Hide that you are typing",
-    dependencies: ["CommandsAPI", "ChatInputButtonAPI"],
+    dependencies: ["ChatInputButtonAPI"],
     settings,
     contextMenus: {
         "textarea-context": ChatBarContextCheckbox

src/plugins/spotifyShareCommands/index.ts

@@ -76,7 +76,6 @@ export default definePlugin({
     name: "SpotifyShareCommands",
     description: "Share your current Spotify track, album or artist via slash command (/track, /album, /artist)",
     authors: [Devs.katlyn],
-    dependencies: ["CommandsAPI"],
     commands: [
         {
             name: "track",

src/utils/types.ts

@@ -72,13 +72,13 @@ export interface PluginDef {
     stop?(): void;
     patches?: Omit<Patch, "plugin">[];
     /**
-     * List of commands. If you specify these, you must add CommandsAPI to dependencies
+     * List of commands that your plugin wants to register
      */
     commands?: Command[];
     /**
      * A list of other plugins that your plugin depends on.
      * These will automatically be enabled and loaded before your plugin
-     * Common examples are CommandsAPI, MessageEventsAPI...
+     * Generally these will be API plugins
      */
     dependencies?: string[],
     /**

src/webpack/common/components.ts

@@ -28,6 +28,8 @@ export let Forms = {} as {
     FormText: t.FormText,
 };
 
+export let Icons = {} as t.Icons;
+
 export let Card: t.Card;
 export let Button: t.Button;
 export let Switch: t.Switch;
@@ -85,4 +87,5 @@ waitFor(["FormItem", "Button"], m => {
         Heading
     } = m);
     Forms = m;
+    Icons = m;
 });

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

@@ -18,6 +18,8 @@
 
 import type { ComponentType, CSSProperties, FunctionComponent, HtmlHTMLAttributes, HTMLProps, KeyboardEvent, MouseEvent, PropsWithChildren, PropsWithRef, ReactNode, Ref } from "react";
 
+import { IconNames } from "./iconNames";
+
 export type TextVariant = "heading-sm/normal" | "heading-sm/medium" | "heading-sm/semibold" | "heading-sm/bold" | "heading-md/normal" | "heading-md/medium" | "heading-md/semibold" | "heading-md/bold" | "heading-lg/normal" | "heading-lg/medium" | "heading-lg/semibold" | "heading-lg/bold" | "heading-xl/normal" | "heading-xl/medium" | "heading-xl/bold" | "heading-xxl/normal" | "heading-xxl/medium" | "heading-xxl/bold" | "eyebrow" | "heading-deprecated-14/normal" | "heading-deprecated-14/medium" | "heading-deprecated-14/bold" | "text-xxs/normal" | "text-xxs/medium" | "text-xxs/semibold" | "text-xxs/bold" | "text-xs/normal" | "text-xs/medium" | "text-xs/semibold" | "text-xs/bold" | "text-sm/normal" | "text-sm/medium" | "text-sm/semibold" | "text-sm/bold" | "text-md/normal" | "text-md/medium" | "text-md/semibold" | "text-md/bold" | "text-lg/normal" | "text-lg/medium" | "text-lg/semibold" | "text-lg/bold" | "display-sm" | "display-md" | "display-lg" | "code";
 export type FormTextTypes = Record<"DEFAULT" | "INPUT_PLACEHOLDER" | "DESCRIPTION" | "LABEL_BOLD" | "LABEL_SELECTED" | "LABEL_DESCRIPTOR" | "ERROR" | "SUCCESS", string>;
 export type HeadingTag = `h${1 | 2 | 3 | 4 | 5 | 6}`;
@@ -69,7 +71,7 @@ export type FormText = ComponentType<PropsWithChildren<{
 }> & TextProps> & { Types: FormTextTypes; };
 
 export type Tooltip = ComponentType<{
-    text: ReactNode;
+    text: ReactNode | ComponentType;
     children: FunctionComponent<{
         onClick(): void;
         onMouseEnter(): void;
@@ -502,3 +504,10 @@ export type Avatar = ComponentType<PropsWithChildren<{
 type FocusLock = ComponentType<PropsWithChildren<{
     containerRef: RefObject<HTMLElement>;
 }>>;
+
+export type Icon = ComponentType<JSX.IntrinsicElements["svg"] & {
+    size?: string;
+    colorClass?: string;
+} & Record<string, any>>;
+
+export type Icons = Record<IconNames, Icon>;