/* * Vencord, a modification for Discord's desktop app * Copyright (c) 2022 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 . */ import ErrorBoundary from "@components/ErrorBoundary"; import { Devs } from "@utils/constants"; import { sleep } from "@utils/misc"; import { Queue } from "@utils/Queue"; import { LazyComponent, useForceUpdater } from "@utils/react"; import definePlugin from "@utils/types"; import { findByCode, findByPropsLazy } from "@webpack"; import { ChannelStore, FluxDispatcher, React, RestAPI, Tooltip } from "@webpack/common"; import { CustomEmoji } from "@webpack/types"; import { Message, ReactionEmoji, User } from "discord-types/general"; const UserSummaryItem = LazyComponent(() => findByCode("defaultRenderUser", "showDefaultAvatarsForNullUsers")); const AvatarStyles = findByPropsLazy("moreUsers", "emptyUser", "avatarContainer", "clickableAvatar"); const queue = new Queue(); let reactions: Record; function fetchReactions(msg: Message, emoji: ReactionEmoji, type: number) { const key = emoji.name + (emoji.id ? `:${emoji.id}` : ""); return RestAPI.get({ url: `/channels/${msg.channel_id}/messages/${msg.id}/reactions/${key}`, query: { limit: 100, type }, oldFormErrors: true }) .then(res => FluxDispatcher.dispatch({ type: "MESSAGE_REACTION_ADD_USERS", channelId: msg.channel_id, messageId: msg.id, users: res.body, emoji, reactionType: type })) .catch(console.error) .finally(() => sleep(250)); } function getReactionsWithQueue(msg: Message, e: ReactionEmoji, type: number) { const key = `${msg.id}:${e.name}:${e.id ?? ""}:${type}`; const cache = reactions[key] ??= { fetched: false, users: {} }; if (!cache.fetched) { queue.unshift(() => fetchReactions(msg, e, type)); cache.fetched = true; } return cache.users; } function makeRenderMoreUsers(users: User[]) { return function renderMoreUsers(_label: string, _count: number) { return ( u.username).join(", ")} > {({ onMouseEnter, onMouseLeave }) => (
+{users.length - 5}
)}
); }; } function handleClickAvatar(event: React.MouseEvent) { event.stopPropagation(); } export default definePlugin({ name: "WhoReacted", description: "Renders the avatars of users who reacted to a message", authors: [Devs.Ven, Devs.KannaDev], patches: [{ find: ",reactionRef:", replacement: { match: /(?<=(\i)=(\i)\.hideCount,)(.+?reactionCount.+?\}\))/, replace: (_, hideCount, props, rest) => `whoReactedProps=${props},${rest},${hideCount}?null:$self.renderUsers(whoReactedProps)` } }, { find: '.displayName="MessageReactionsStore";', replacement: { match: /(?<=CONNECTION_OPEN:function\(\){)(\i)={}/, replace: "$&;$self.reactions=$1" } }], renderUsers(props: RootObject) { return props.message.reactions.length > 10 ? null : ( ); }, _renderUsers({ message, emoji, type }: RootObject) { const forceUpdate = useForceUpdater(); React.useEffect(() => { const cb = (e: any) => { if (e.messageId === message.id) forceUpdate(); }; FluxDispatcher.subscribe("MESSAGE_REACTION_ADD_USERS", cb); return () => FluxDispatcher.unsubscribe("MESSAGE_REACTION_ADD_USERS", cb); }, [message.id]); const reactions = getReactionsWithQueue(message, emoji, type); const users = Object.values(reactions).filter(Boolean) as User[]; for (const user of users) { FluxDispatcher.dispatch({ type: "USER_UPDATE", user }); } return (
); }, set reactions(value: any) { reactions = value; } }); interface ReactionCacheEntry { fetched: boolean; users: Record; } interface RootObject { message: Message; readOnly: boolean; isLurking: boolean; isPendingMember: boolean; useChatFontScaling: boolean; emoji: CustomEmoji; count: number; burst_user_ids: any[]; burst_count: number; burst_colors: any[]; burst_me: boolean; me: boolean; type: number; hideEmoji: boolean; remainingBurstCurrency: number; }