Fix/shared chat profile picture (#1099)

Co-authored-by: Excellify <[email protected]>
SevenTV · Oct 26, 2024 · 376951f · 376951f
1 parent c216fe9
commit 376951f
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 1 deletion.
diff --git a/CHANGELOG-nightly.md b/CHANGELOG-nightly.md
@@ -1,6 +1,7 @@
 ### 3.1.3.1000
 
 -   Added option hide shared chat
+-   Fixed an issue with profile picture in shared chat
 -   Fixed extension login
 -   Fixed an issue when users had multiple personal emote sets
 

diff --git a/src/app/chat/Badge.vue b/src/app/chat/Badge.vue
@@ -16,6 +16,7 @@
 
 <script setup lang="ts">
 import { ref } from "vue";
+import { TWITCH_PROFILE_IMAGE_REGEX } from "@/common/Constant";
 import { useTooltip } from "@/composable/useTooltip";
 import BadgeTooltip from "./BadgeTooltip.vue";
 
@@ -30,7 +31,8 @@ const borderRadius = ref("");
 const srcset = {
 	twitch: (badge: Twitch.ChatBadge) => `${badge.image1x} 1x, ${badge.image2x} 2x, ${badge.image4x} 4x`,
 	picture: (badge: Twitch.SharedChat) =>
-		`${badge.profileImageURL.slice(0, -9)}28x28.png 1.6x, ${badge.profileImageURL.slice(0, -9)}70x70.png 3.8x`,
+		`${badge.profileImageURL.replace(TWITCH_PROFILE_IMAGE_REGEX, "28x28")} 1.6x,
+		${badge.profileImageURL.replace(TWITCH_PROFILE_IMAGE_REGEX, "70x70")} 3.8x`,
 	app: (badge: SevenTV.Cosmetic<"BADGE">) =>
 		badge.data.host.files.map((fi, i) => `https:${badge.data.host.url}/${fi.name} ${i + 1}x`).join(", "),
 }[props.type](props.badge as SevenTV.Cosmetic<"BADGE"> & Twitch.SharedChat & Twitch.ChatBadge);

diff --git a/src/common/Constant.ts b/src/common/Constant.ts
@@ -20,6 +20,8 @@ export const SITE_ACTIVE_WINDOW: InjectionKey<Window> = Symbol("seventv-site-act
 export const UNICODE_TAG_0 = "\u{E0000}";
 export const UNICODE_TAG_0_REGEX = new RegExp(UNICODE_TAG_0, "g");
 
+export const TWITCH_PROFILE_IMAGE_REGEX = /(\d+x\d+)(?=\.\w{3,4}$)/;
+
 export const HOSTNAME_SUPPORTED_REGEXP = /([a-z0-9]+[.])*(youtube|kick)[.]com/;
 export const SEVENTV_EMOTE_LINK = new RegExp(
 	"https?:\\/\\/(?:www\\.)?7tv.app\\/emotes\\/(?<emoteID>[0-7][0-9A-HJKMNP-TV-Z]{25})",