Fixes

src/equicordplugins/betterActivities/index.tsx

@@ -18,6 +18,7 @@
 
 import "./styles.css";
 
+import { migratePluginSettings } from "@api/Settings";
 import { classNameFactory } from "@api/Styles";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
@@ -43,6 +44,8 @@ const ActivityView = findComponentByCodeLazy<ActivityViewProps>("onOpenGameProfi
 // if discord one day decides to change their icon this needs to be updated
 const DefaultActivityIcon = findComponentByCodeLazy("M6,7 L2,7 L2,6 L6,6 L6,7 Z M8,5 L2,5 L2,4 L8,4 L8,5 Z M8,3 L2,3 L2,2 L8,2 L8,3 Z M8.88888889,0 L1.11111111,0 C0.494444444,0 0,0.494444444 0,1.11111111 L0,8.88888889 C0,9.50253861 0.497461389,10 1.11111111,10 L8.88888889,10 C9.50253861,10 10,9.50253861 10,8.88888889 L10,1.11111111 C10,0.494444444 9.5,0 8.88888889,0 Z");
 
+
+migratePluginSettings("MemberListActivites", "BetterActivities");
 export default definePlugin({
     name: "BetterActivities",
     description: "Shows activity icons in the member list and allows showing all activities",

src/plugins/memberListActivites/components/SpotifyIcon.tsx

@@ -1,11 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import type { SVGProps } from "react";
-
-export function SpotifyIcon(props: SVGProps<SVGSVGElement>) {
-    return (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" {...props}><path fill="#1ed760" d="M128 0C57.308 0 0 57.309 0 128c0 70.696 57.309 128 128 128c70.697 0 128-57.304 128-128C256 57.314 198.697.007 127.998.007zm58.699 184.614c-2.293 3.76-7.215 4.952-10.975 2.644c-30.053-18.357-67.885-22.515-112.44-12.335a7.981 7.981 0 0 1-9.552-6.007a7.968 7.968 0 0 1 6-9.553c48.76-11.14 90.583-6.344 124.323 14.276c3.76 2.308 4.952 7.215 2.644 10.975m15.667-34.853c-2.89 4.695-9.034 6.178-13.726 3.289c-34.406-21.148-86.853-27.273-127.548-14.92c-5.278 1.594-10.852-1.38-12.454-6.649c-1.59-5.278 1.386-10.842 6.655-12.446c46.485-14.106 104.275-7.273 143.787 17.007c4.692 2.89 6.175 9.034 3.286 13.72zm1.345-36.293C162.457 88.964 94.394 86.71 55.007 98.666c-6.325 1.918-13.014-1.653-14.93-7.978c-1.917-6.328 1.65-13.012 7.98-14.935C93.27 62.027 168.434 64.68 215.929 92.876c5.702 3.376 7.566 10.724 4.188 16.405c-3.362 5.69-10.73 7.565-16.4 4.187z"></path></svg>);
-}

src/plugins/memberListActivites/components/TwitchIcon.tsx

@@ -1,11 +0,0 @@
-/*
- * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-import type { SVGProps } from "react";
-
-export function TwitchIcon(props: SVGProps<SVGSVGElement>) {
-    return (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 268" {...props}><path fill="#5a3e85" d="M17.458 0L0 46.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256 162.954V0zm23.259 23.263H232.73v128.029l-40.739 40.741H128L93.113 226.92v-34.886H40.717zm64.008 116.405H128V69.844h-23.275zm63.997 0h23.27V69.844h-23.27z"></path></svg>);
-}

src/plugins/memberListActivites/index.tsx

@@ -1,290 +0,0 @@
-/*
- * Vencord, a modification for Discord's desktop app
- * Copyright (c) 2023 Vendicated and contributors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <https://www.gnu.org/licenses/>.
-*/
-
-import "./styles.css";
-
-import { definePluginSettings } from "@api/Settings";
-import { classNameFactory } from "@api/Styles";
-import ErrorBoundary from "@components/ErrorBoundary";
-import { Devs } from "@utils/constants";
-import definePlugin, { OptionType } from "@utils/types";
-import { findByPropsLazy, findComponentByCodeLazy, findStoreLazy } from "@webpack";
-import { Tooltip } from "@webpack/common";
-import type { ImgHTMLAttributes } from "react";
-
-import { SpotifyIcon } from "./components/SpotifyIcon";
-import { TwitchIcon } from "./components/TwitchIcon";
-
-const settings = definePluginSettings({
-    iconSize: {
-        type: OptionType.SLIDER,
-        description: "Size of the activity icons",
-        markers: [10, 15, 20],
-        default: 20,
-        stickToMarkers: false,
-    },
-    renderGifs: {
-        type: OptionType.BOOLEAN,
-        description: "Allow rendering GIFs",
-        default: true,
-        restartNeeded: false,
-    },
-});
-
-interface Activity {
-    created_at: number;
-    id: string;
-    name: string;
-    type: number;
-    emoji?: {
-        animated: boolean;
-        id: string;
-        name: string;
-    };
-    state?: string;
-    flags?: number;
-    sync_id?: string;
-    details?: string;
-    application_id?: string;
-    assets?: {
-        large_text?: string;
-        large_image?: string;
-        small_text?: string;
-        small_image?: string;
-    };
-    platform?: string;
-}
-
-const cl = classNameFactory("vc-mla-");
-
-interface Application {
-    id: string;
-    name: string;
-    icon: string;
-    description: string;
-    summary: string;
-    type: number;
-    hook: boolean;
-    guild_id: string;
-    executables: Executable[];
-    verify_key: string;
-    publishers: Developer[];
-    developers: Developer[];
-    flags: number;
-}
-
-interface Developer {
-    id: string;
-    name: string;
-}
-
-interface Executable {
-    os: string;
-    name: string;
-    is_launcher: boolean;
-}
-
-interface ApplicationIcon {
-    image: ImgHTMLAttributes<HTMLImageElement> & {
-        src: string;
-        alt: string;
-    };
-    activity: Activity;
-}
-
-interface ActivityListIcon {
-    iconElement: JSX.Element;
-    tooltip?: JSX.Element | string;
-}
-
-const ApplicationStore: {
-    getApplication: (id: string) => Application | null;
-} = findStoreLazy("ApplicationStore");
-
-const { fetchApplication }: {
-    fetchApplication: (id: string) => Promise<Application | null>;
-} = findByPropsLazy("fetchApplication");
-
-// if discord one day decides changes their icon this needs to be updated
-const DefaultActivityIcon = findComponentByCodeLazy("M6,7 L2,7 L2,6 L6,6 L6,7 Z M8,5 L2,5 L2,4 L8,4 L8,5 Z M8,3 L2,3 L2,2 L8,2 L8,3 Z M8.88888889,0 L1.11111111,0 C0.494444444,0 0,0.494444444 0,1.11111111 L0,8.88888889 C0,9.50253861 0.497461389,10 1.11111111,10 L8.88888889,10 C9.50253861,10 10,9.50253861 10,8.88888889 L10,1.11111111 C10,0.494444444 9.5,0 8.88888889,0 Z");
-
-const fetchedApplications = new Map<string, Application | null>();
-
-const xboxUrl = "https://discord.com/assets/9a15d086141be29d9fcd.png";
-
-function getApplicationIcons(activities: Activity[]) {
-    const applicationIcons: ApplicationIcon[] = [];
-    const applications = activities.filter(activity => activity.application_id || activity.platform);
-
-    for (const activity of applications) {
-        const { assets, application_id, platform } = activity;
-        if (!application_id && !platform) {
-            continue;
-        }
-        if (assets) {
-
-            const addImage = (image: string, alt: string) => {
-                if (image.startsWith("mp:")) {
-                    const discordMediaLink = `https://media.discordapp.net/${image.replace(/mp:/, "")}`;
-                    if (settings.store.renderGifs || !discordMediaLink.endsWith(".gif")) {
-                        applicationIcons.push({
-                            image: { src: discordMediaLink, alt },
-                            activity
-                        });
-                    }
-                } else {
-                    const src = `https://cdn.discordapp.com/app-assets/${application_id}/${image}.png`;
-                    applicationIcons.push({
-                        image: { src, alt },
-                        activity
-                    });
-                }
-            };
-
-            // Prefer large image
-            const largeImage = assets.large_image;
-            if (largeImage) {
-                addImage(largeImage, assets.large_text ?? "Large Text");
-            } else {
-                const smallImage = assets.small_image;
-                if (smallImage) {
-                    addImage(smallImage, assets.small_text ?? "Small Text");
-                }
-            }
-        } else if (application_id) {
-            let application = ApplicationStore.getApplication(application_id);
-            if (!application) {
-                if (fetchedApplications.has(application_id)) {
-                    application = fetchedApplications.get(application_id) as Application | null;
-                } else {
-                    fetchedApplications.set(application_id, null);
-                    fetchApplication(application_id).then(app => {
-                        fetchedApplications.set(application_id, app);
-                    });
-                }
-            }
-
-            if (application) {
-                if (application.icon) {
-                    const src = `https://cdn.discordapp.com/app-icons/${application.id}/${application.icon}.png`;
-                    applicationIcons.push({
-                        image: { src, alt: application.name },
-                        activity
-                    });
-                } else if (platform === "xbox") {
-                    applicationIcons.push({
-                        image: { src: xboxUrl, alt: "Xbox" },
-                        activity
-                    });
-                }
-            }
-        } else {
-            if (platform === "xbox") {
-                applicationIcons.push({
-                    image: { src: xboxUrl, alt: "Xbox" },
-                    activity
-                });
-            }
-        }
-    }
-
-    return applicationIcons;
-}
-
-export default definePlugin({
-    name: "MemberListActivities",
-    description: "Shows activity icons in the member list",
-    authors: [Devs.D3SOX],
-    tags: ["activity"],
-
-    settings,
-
-    patchActivityList: (activities: Activity[]): JSX.Element | null => {
-        const icons: ActivityListIcon[] = [];
-
-        const spotifyActivity = activities.find(({ name }) => name === "Spotify");
-        if (spotifyActivity) {
-            icons.push({ iconElement: <SpotifyIcon />, tooltip: spotifyActivity.details ?? spotifyActivity.name });
-        }
-        const twitchActivity = activities.find(({ name }) => name === "Twitch");
-        if (twitchActivity) {
-            icons.push({ iconElement: <TwitchIcon />, tooltip: twitchActivity.details ?? twitchActivity.name });
-        }
-
-        const applicationIcons = getApplicationIcons(activities);
-        if (applicationIcons.length) {
-            const compareImageSource = (a: ApplicationIcon, b: ApplicationIcon) => {
-                return a.image.src === b.image.src;
-            };
-            const uniqueIcons = applicationIcons.filter((element, index, array) => {
-                return array.findIndex(el => compareImageSource(el, element)) === index;
-            });
-            for (const appIcon of uniqueIcons) {
-                icons.push({
-                    iconElement: <img {...appIcon.image} />,
-                    tooltip: appIcon.activity.details ?? appIcon.activity.name
-                });
-            }
-        }
-
-        if (icons.length) {
-            return <ErrorBoundary noop>
-                <div className={cl("row")}>
-                    {icons.map(({ iconElement, tooltip }, i) => {
-                        return (
-                            <div key={i} className={cl("icon")} style={{
-                                width: `${settings.store.iconSize}px`,
-                                height: `${settings.store.iconSize}px`
-                            }}>
-                                {tooltip ? <Tooltip text={tooltip}>
-                                    {({ onMouseEnter, onMouseLeave }) => (
-                                        <div
-                                            onMouseEnter={onMouseEnter}
-                                            onMouseLeave={onMouseLeave}>
-                                            {iconElement}
-                                        </div>
-                                    )}
-                                </Tooltip> : iconElement}
-                            </div>
-                        );
-                    })}
-                </div>
-            </ErrorBoundary>;
-        } else {
-            // Show default icon when there are no custom icons
-            // We need to filter out custom statuses
-            const shouldShow = activities.filter(a => a.type !== 4).length !== icons.length;
-            if (shouldShow) {
-                return <DefaultActivityIcon />;
-            }
-        }
-
-        return null;
-    },
-
-    patches: [
-        {
-            // Patch activity icons
-            find: "default.getHangStatusActivity():null!",
-            replacement: {
-                match: /null!=(\i)&&\i.some\(\i=>\(0,\i.default\)\(\i,\i\)\)\?/,
-                replace: "$self.patchActivityList($1),false?"
-            }
-        },
-    ],
-});

src/plugins/memberListActivites/styles.css

@@ -1,20 +0,0 @@
-.vc-mla-row {
-    display: flex;
-    flex-wrap: nowrap;
-    align-items: center;
-    margin-left: 5px;
-    text-align: center;
-    gap: 3px;
-}
-
-.vc-mla-icon {
-    height: 20px;
-    width: 20px;
-}
-
-.vc-mla-icon img {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-    border-radius: 50%;
-}