refactor(memberListActivities): don't spread activity into img element

This commit is contained in:
D3SOX 2024-04-02 19:56:33 +02:00
parent 99420e2cbe
commit 96175671b1
No known key found for this signature in database
GPG key ID: 39EC1673FC37B048

View file

@ -98,12 +98,13 @@ interface Executable {
name: string; name: string;
is_launcher: boolean; is_launcher: boolean;
} }
interface ApplicationIcon {
type ImageAttributes = ImgHTMLAttributes<HTMLImageElement> & { image: ImgHTMLAttributes<HTMLImageElement> & {
src: string; src: string;
alt: string; alt: string;
};
activity: Activity; activity: Activity;
}; }
interface ActivityListIcon { interface ActivityListIcon {
iconElement: JSX.Element; iconElement: JSX.Element;
@ -126,7 +127,7 @@ const fetchedApplications = new Map<string, Application | null>();
const xboxUrl = "https://discord.com/assets/9a15d086141be29d9fcd.png"; const xboxUrl = "https://discord.com/assets/9a15d086141be29d9fcd.png";
function getApplicationIcons(activities: Activity[]) { function getApplicationIcons(activities: Activity[]) {
const applicationIcons: ImageAttributes[] = []; const applicationIcons: ApplicationIcon[] = [];
const applications = activities.filter(activity => activity.application_id || activity.platform); const applications = activities.filter(activity => activity.application_id || activity.platform);
for (const activity of applications) { for (const activity of applications) {
@ -140,11 +141,17 @@ function getApplicationIcons(activities: Activity[]) {
if (image.startsWith("mp:")) { if (image.startsWith("mp:")) {
const discordMediaLink = `https://media.discordapp.net/${image.replace(/mp:/, "")}`; const discordMediaLink = `https://media.discordapp.net/${image.replace(/mp:/, "")}`;
if (settings.store.renderGifs || !discordMediaLink.endsWith(".gif")) { if (settings.store.renderGifs || !discordMediaLink.endsWith(".gif")) {
applicationIcons.push({ src: discordMediaLink, alt, activity }); applicationIcons.push({
image: { src: discordMediaLink, alt },
activity
});
} }
} else { } else {
const src = `https://cdn.discordapp.com/app-assets/${application_id}/${image}.png`; const src = `https://cdn.discordapp.com/app-assets/${application_id}/${image}.png`;
applicationIcons.push({ src, alt, activity }); applicationIcons.push({
image: { src, alt },
activity
});
} }
}; };
@ -174,14 +181,23 @@ function getApplicationIcons(activities: Activity[]) {
if (application) { if (application) {
if (application.icon) { if (application.icon) {
const src = `https://cdn.discordapp.com/app-icons/${application.id}/${application.icon}.png`; const src = `https://cdn.discordapp.com/app-icons/${application.id}/${application.icon}.png`;
applicationIcons.push({ src, alt: application.name, activity }); applicationIcons.push({
image: { src, alt: application.name },
activity
});
} else if (platform === "xbox") { } else if (platform === "xbox") {
applicationIcons.push({ src: xboxUrl, alt: "Xbox", activity }); applicationIcons.push({
image: { src: xboxUrl, alt: "Xbox" },
activity
});
} }
} }
} else { } else {
if (platform === "xbox") { if (platform === "xbox") {
applicationIcons.push({ src: xboxUrl, alt: "Xbox", activity }); applicationIcons.push({
image: { src: xboxUrl, alt: "Xbox" },
activity
});
} }
} }
} }
@ -211,16 +227,16 @@ export default definePlugin({
} }
const applicationIcons = getApplicationIcons(activities); const applicationIcons = getApplicationIcons(activities);
if (applicationIcons.length) { if (applicationIcons.length) {
const compareImageSource = (a: ImageAttributes, b: ImageAttributes) => { const compareImageSource = (a: ApplicationIcon, b: ApplicationIcon) => {
return a.src === b.src; return a.image.src === b.image.src;
}; };
const uniqueIcons = applicationIcons.filter((element, index, array) => { const uniqueIcons = applicationIcons.filter((element, index, array) => {
return array.findIndex(el => compareImageSource(el, element)) === index; return array.findIndex(el => compareImageSource(el, element)) === index;
}); });
for (const iconAttrs of uniqueIcons) { for (const appIcon of uniqueIcons) {
icons.push({ icons.push({
iconElement: <img {...iconAttrs} />, iconElement: <img {...appIcon.image} />,
tooltip: iconAttrs.activity.details ?? iconAttrs.activity.name tooltip: appIcon.activity.details ?? appIcon.activity.name
}); });
} }
} }