fix(betterActivities): avoid passing specific props to all activities

Now only the general props are used and the application is fetched for other activities

src/plugins/betterActivities/index.tsx

@@ -23,7 +23,7 @@ import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
 import { findComponentByCodeLazy } from "@webpack";
-import { PresenceStore, React, Tooltip, useEffect, useState, useStateFromStores } from "@webpack/common";
+import { PresenceStore, React, Tooltip, useEffect, useMemo, useState, useStateFromStores } from "@webpack/common";
 import { User } from "discord-types/general";
 
 import ActivityTooltip from "./components/ActivityTooltip";
@@ -39,6 +39,7 @@ import {
     IconCSSProperties
 } from "./types";
 import {
+    getActivityApplication,
     getApplicationIcons
 } from "./utils";
 
@@ -155,14 +156,31 @@ export default definePlugin({
 
         if (!activities.length) return null;
 
+        // we use these for other activities, it would be better to somehow get the corresponding activity props
+        const generalProps = useMemo(() => Object.keys(props).reduce((acc, key) => {
+            // exclude activity specific props to prevent copying them to all activities (e.g. buttons)
+            if (key !== "renderActions" && key !== "application") acc[key] = props[key];
+            return acc;
+        }, {} as Omit<typeof props, "renderActions" | "application">), [props]);
+
         if (settings.store.allActivitiesStyle === "carousel") {
             return (
                 <div style={{ display: "flex", flexDirection: "column" }}>
+                    {currentActivity?.id === activity?.id ? (
                         <ActivityView
                             activity={currentActivity}
                             user={user}
                             {...props}
                         />
+                    ) : (
+                        <ActivityView
+                            activity={currentActivity}
+                            user={user}
+                            // fetch optional application
+                            application={getActivityApplication(currentActivity!)}
+                            {...generalProps}
+                        />
+                    )}
                     <div
                         className={cl("controls")}
                         style={{
@@ -229,12 +247,20 @@ export default definePlugin({
                         gap: "5px",
                     }}
                 >
-                    {activities.map((activity, index) => (
+                    {activities.map((activity, index) =>
+                        index === 0 ? (
                             <ActivityView
                                 key={index}
                                 activity={activity}
                                 user={user}
                                 {...props}
+                            />) : (
+                            <ActivityView
+                                key={index}
+                                activity={activity}
+                                user={user}
+                                application={getActivityApplication(activity)}
+                                {...generalProps}
                             />
                         ))}
                 </div>

src/plugins/betterActivities/types.ts

@@ -86,5 +86,6 @@ export interface ActivityViewProps {
     activity: Activity | null;
     user: User;
     application?: Application;
+    renderActions?: () => JSX.Element;
     type: string;
 }

src/plugins/betterActivities/utils.ts

@@ -19,6 +19,15 @@ const { fetchApplication }: {
 
 const fetchedApplications = new Map<string, Application | null>();
 
+export function getActivityApplication({ application_id }: Activity) {
+    if (!application_id) return undefined;
+    let application = ApplicationStore.getApplication(application_id);
+    if (!application && fetchedApplications.has(application_id)) {
+        application = fetchedApplications.get(application_id) ?? null;
+    }
+    return application ?? undefined;
+}
+
 // TODO: replace with "renderXboxImage"?
 const xboxUrl = "https://discord.com/assets/9a15d086141be29d9fcd.png";