fix(betterActivities): use newer activity view

Discord removed the old ones now

src/plugins/betterActivities/index.tsx

@@ -31,14 +31,21 @@ import { Caret } from "./components/Caret";
 import { SpotifyIcon } from "./components/SpotifyIcon";
 import { TwitchIcon } from "./components/TwitchIcon";
 import settings from "./settings";
-import { Activity, ActivityListIcon, ActivityViewProps, ApplicationIcon, IconCSSProperties } from "./types";
+import {
+    Activity,
+    ActivityListIcon,
+    ActivityViewProps,
+    ActivityViewType,
+    ApplicationIcon,
+    IconCSSProperties
+} from "./types";
 import {
     getApplicationIcons
 } from "./utils";
 
 const cl = classNameFactory("vc-bactivities-");
 
-const ActivityView = findComponentByCodeLazy<ActivityViewProps>("onOpenGameProfile:", "USER_POPOUT_V2");
+const ActivityView = findComponentByCodeLazy<ActivityViewProps>(",onOpenGameProfileModal:");
 
 // 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");
@@ -128,7 +135,7 @@ export default definePlugin({
         return null;
     },
 
-    showAllActivitiesComponent({ activity, user, guild, channelId, onClose }: ActivityViewProps) {
+    showAllActivitiesComponent({ activity, user, activityGuild }: ActivityViewProps) {
         const [currentActivity, setCurrentActivity] = React.useState<Activity | null>(
             activity?.type !== 4 ? activity! : null
         );
@@ -145,7 +152,6 @@ export default definePlugin({
 
             if (!currentActivity || !activities.includes(currentActivity))
                 setCurrentActivity(activities[0]);
-
         }, [activities]);
 
         if (!activities.length) return null;
@@ -154,11 +160,11 @@ export default definePlugin({
             return (
                 <div style={{ display: "flex", flexDirection: "column" }}>
                     <ActivityView
+                        type={ActivityViewType.USER_POPOUT_V2}
                         activity={currentActivity}
                         user={user}
-                        guild={guild}
-                        channelId={channelId}
-                        onClose={onClose}/>
+                        activityGuild={activityGuild}
+                        showChannelDetails={true}/>
                     <div
                         className={cl("controls")}
                         style={{
@@ -228,11 +234,11 @@ export default definePlugin({
                     {activities.map((activity, index) => (
                         <ActivityView
                             key={index}
+                            type={ActivityViewType.USER_POPOUT_V2}
                             activity={activity}
                             user={user}
-                            guild={guild}
-                            channelId={channelId}
-                            onClose={onClose}
+                            activityGuild={activityGuild}
+                            showChannelDetails={true}
                         />
                     ))}
                 </div>
@@ -252,7 +258,7 @@ export default definePlugin({
         },
         {
             // Show all activities in the user popout/sidebar
-            find: "\"BiteSizeProfileActivitySection\"",
+            find: '"BiteSizeProfileActivitySection"',
             replacement: {
                 match: /(?<=\(0,\i\.jsx\)\()\i\.\i(?=,{type:\i.\i.BITE_SIZE_POPOUT,activity:\i,className:\i\.activity,source:\i,user:\i)/,
                 replace: "$self.showAllActivitiesComponent"

src/plugins/betterActivities/types.ts

@@ -82,10 +82,22 @@ export interface IconCSSProperties extends CSSProperties {
     "--icon-size": string;
 }
 
+export enum ActivityViewType {
+    USER_POPOUT = "UserPopout",
+    USER_POPOUT_V2 = "UserPopoutV2",
+    ACTIVITY_FEED = "ActivityFeed",
+    PROFILE = "Profile",
+    PROFILE_V2 = "ProfileV2",
+    STREAM_PREVIEW = "StreamPreview",
+    VOICE_CHANNEL = "VoiceChannel",
+    SIMPLIFIED_PROFILE = "SimplifiedProfile",
+    BITE_SIZE_POPOUT = "BiteSizePopout"
+}
+
 export interface ActivityViewProps {
     activity: Activity | null;
     user: User;
-    guild: Guild;
-    channelId: string;
-    onClose: () => void;
+    activityGuild: Guild;
+    type: ActivityViewType;
+    showChannelDetails: boolean;
 }

src/plugins/betterActivities/utils.ts

@@ -32,7 +32,7 @@ export function getActivityImage(activity: Activity, application?: Application):
         const image = activity.assets?.large_image;
         // image needs to replace 'twitch:'
         if (image?.startsWith("twitch:")) {
-            // twitch images are always https://static-cdn.jtvnw.net/previews-ttv/live_user_USERNAME-RESOLTUON.jpg
+            // twitch images are always https://static-cdn.jtvnw.net/previews-ttv/live_user_USERNAME-RESOLUTION.jpg
             return `${image.replace("twitch:", "https://static-cdn.jtvnw.net/previews-ttv/live_user_")}-108x60.jpg`;
         }
     }
@@ -54,7 +54,6 @@ export function getApplicationIcons(activities: Activity[], preferSmall = false)
             continue;
         }
         if (assets) {
-
             const addImage = (image: string, alt: string) => {
                 if (image.startsWith("mp:")) {
                     const discordMediaLink = `https://media.discordapp.net/${image.replace(/mp:/, "")}`;