diff options
| -rw-r--r-- | src/plugins/mutualGroupDMs.tsx | 104 | ||||
| -rw-r--r-- | src/webpack/common/components.ts | 5 | ||||
| -rw-r--r-- | src/webpack/common/types/components.d.ts | 43 |
3 files changed, 151 insertions, 1 deletions
diff --git a/src/plugins/mutualGroupDMs.tsx b/src/plugins/mutualGroupDMs.tsx new file mode 100644 index 0000000..6d6dc52 --- /dev/null +++ b/src/plugins/mutualGroupDMs.tsx @@ -0,0 +1,104 @@ +/* + * Vencord, a modification for Discord's desktop app + * Copyright (c) 2023 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 <https://www.gnu.org/licenses/>. +*/ + + +import { Devs } from "@utils/constants"; +import { isNonNullish } from "@utils/guards"; +import definePlugin from "@utils/types"; +import { findByPropsLazy } from "@webpack"; +import { Avatar, ChannelStore, Clickable, RelationshipStore, ScrollerThin, UserStore } from "@webpack/common"; +import { Channel, User } from "discord-types/general"; + +const SelectedChannelActionCreators = findByPropsLazy("selectPrivateChannel"); +const AvatarUtils = findByPropsLazy("getChannelIconURL"); +const UserUtils = findByPropsLazy("getGlobalName"); + +const ProfileListClasses = findByPropsLazy("emptyIconFriends", "emptyIconGuilds"); +const GuildLabelClasses = findByPropsLazy("guildNick", "guildAvatarWithoutIcon"); + +function getGroupDMName(channel: Channel) { + return channel.name || + channel.recipients + .map(UserStore.getUser) + .filter(isNonNullish) + .map(c => RelationshipStore.getNickname(c.id) || UserUtils.getName(c)) + .join(", "); +} + +export default definePlugin({ + name: "MutualGroupDMs", + description: "Shows mutual group dms in profiles", + authors: [Devs.amia], + + patches: [ + { + find: ".Messages.USER_PROFILE_MODAL", // Note: the module is lazy-loaded + replacement: [ + { + match: /(?<=\.MUTUAL_GUILDS\}\),)(?=(\i\.bot).{0,20}(\(0,\i\.jsx\)\(.{0,100}id:))/, + replace: '$1?null:$2"MUTUAL_GDMS",children:"Mutual Groups"}),' + }, + { + match: /(?<={user:(\i),onClose:(\i)}\);)(?=case \i\.\i\.MUTUAL_FRIENDS)/, + replace: "case \"MUTUAL_GDMS\":return $self.renderMutualGDMs($1,$2);" + } + ] + } + ], + + renderMutualGDMs(user: User, onClose: () => void) { + const entries = ChannelStore.getSortedPrivateChannels().filter(c => c.isGroupDM() && c.recipients.includes(user.id)).map(c => ( + <Clickable + className={ProfileListClasses.listRow} + onClick={() => { + onClose(); + SelectedChannelActionCreators.selectPrivateChannel(c.id); + }} + > + <Avatar + src={AvatarUtils.getChannelIconURL({ id: c.id, icon: c.icon, size: 32 })} + size="SIZE_40" + className={ProfileListClasses.listAvatar} + > + </Avatar> + <div className={ProfileListClasses.listRowContent}> + <div className={ProfileListClasses.listName}>{getGroupDMName(c)}</div> + <div className={GuildLabelClasses.guildNick}>{c.recipients.length} Members</div> + </div> + </Clickable> + )); + + return ( + <ScrollerThin + className={ProfileListClasses.listScroller} + fade={true} + onClose={onClose} + > + {entries.length > 0 + ? entries + : ( + <div className={ProfileListClasses.empty}> + <div className={ProfileListClasses.emptyIconFriends}></div> + <div className={ProfileListClasses.emptyText}>No group dms in common</div> + </div> + ) + } + </ScrollerThin> + ); + } +}); diff --git a/src/webpack/common/components.ts b/src/webpack/common/components.ts index 8b07b6c..f308cff 100644 --- a/src/webpack/common/components.ts +++ b/src/webpack/common/components.ts @@ -44,6 +44,9 @@ export let Popout: t.Popout; export let Dialog: t.Dialog; export let TabBar: any; export let Paginator: t.Paginator; +export let ScrollerThin: t.ScrollerThin; +export let Clickable: t.Clickable; +export let Avatar: t.Avatar; // token lagger real /** css colour resolver stuff, no clue what exactly this does, just copied usage from Discord */ export let useToken: t.useToken; @@ -54,6 +57,6 @@ export const Flex = waitForComponent<t.Flex>("Flex", ["Justify", "Align", "Wrap" export const ButtonWrapperClasses = findByPropsLazy("buttonWrapper", "buttonContent") as Record<string, string>; waitFor("FormItem", m => { - ({ useToken, Card, Button, FormSwitch: Switch, Tooltip, TextInput, TextArea, Text, Select, SearchableSelect, Slider, ButtonLooks, TabBar, Popout, Dialog, Paginator } = m); + ({ useToken, Card, Button, FormSwitch: Switch, Tooltip, TextInput, TextArea, Text, Select, SearchableSelect, Slider, ButtonLooks, TabBar, Popout, Dialog, Paginator, ScrollerThin, Clickable, Avatar } = m); Forms = m; }); diff --git a/src/webpack/common/types/components.d.ts b/src/webpack/common/types/components.d.ts index 161e068..7bc313c 100644 --- a/src/webpack/common/types/components.d.ts +++ b/src/webpack/common/types/components.d.ts @@ -397,3 +397,46 @@ export type Paginator = ComponentType<{ onPageChange?(page: number): void; hideMaxPage?: boolean; }>; + +export type ScrollerThin = ComponentType<PropsWithChildren<{ + className?: string; + style?: CSSProperties; + + dir?: "ltr"; + orientation?: "horizontal" | "vertical"; + paddingFix?: boolean; + fade?: boolean; + + onClose?(): void; + onScroll?(): void; +}>>; + +export type Clickable = ComponentType<PropsWithChildren<{ + className?: string; + + href?: string; + ignoreKeyPress?: boolean; + + onClick?(): void; + onKeyPress?(): void; +}>>; + +export type Avatar = ComponentType<PropsWithChildren<{ + className?: string; + + src?: string; + size?: "SIZE_16" | "SIZE_20" | "SIZE_24" | "SIZE_32" | "SIZE_40" | "SIZE_48" | "SIZE_56" | "SIZE_80" | "SIZE_120"; + + statusColor?: string; + statusTooltip?: string; + statusBackdropColor?: string; + + isMobile?: boolean; + isTyping?: boolean; + isSpeaking?: boolean; + + typingIndicatorRef?: unknown; + + "aria-hidden"?: boolean; + "aria-label"?: string; +}>>; |