MutualGroupDMs: Add Mutual Groups to DM Sidebar (#2817)
This commit is contained in:
parent
0c71d6c3fa
commit
d0ad4e6c1d
|
@ -20,7 +20,7 @@ import ErrorBoundary from "@components/ErrorBoundary";
|
|||
import { Devs } from "@utils/constants";
|
||||
import { isNonNullish } from "@utils/guards";
|
||||
import definePlugin from "@utils/types";
|
||||
import { findByPropsLazy } from "@webpack";
|
||||
import { findByPropsLazy, findComponentByCodeLazy } from "@webpack";
|
||||
import { Avatar, ChannelStore, Clickable, IconUtils, RelationshipStore, ScrollerThin, useMemo, UserStore } from "@webpack/common";
|
||||
import { Channel, User } from "discord-types/general";
|
||||
|
||||
|
@ -28,6 +28,7 @@ const SelectedChannelActionCreators = findByPropsLazy("selectPrivateChannel");
|
|||
const UserUtils = findByPropsLazy("getGlobalName");
|
||||
|
||||
const ProfileListClasses = findByPropsLazy("emptyIconFriends", "emptyIconGuilds");
|
||||
const ExpandableList = findComponentByCodeLazy(".mutualFriendItem]");
|
||||
const GuildLabelClasses = findByPropsLazy("guildNick", "guildAvatarWithoutIcon");
|
||||
|
||||
function getGroupDMName(channel: Channel) {
|
||||
|
@ -50,6 +51,29 @@ function getMutualGDMCountText(user: User) {
|
|||
return `${count === 0 ? "No" : count} Mutual Group${count !== 1 ? "s" : ""}`;
|
||||
}
|
||||
|
||||
function renderClickableGDMs(mutualDms: Channel[], onClose: () => void) {
|
||||
return mutualDms.map(c => (
|
||||
<Clickable
|
||||
className={ProfileListClasses.listRow}
|
||||
onClick={() => {
|
||||
onClose();
|
||||
SelectedChannelActionCreators.selectPrivateChannel(c.id);
|
||||
}}
|
||||
>
|
||||
<Avatar
|
||||
src={IconUtils.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 + 1} Members</div>
|
||||
</div>
|
||||
</Clickable>
|
||||
));
|
||||
}
|
||||
|
||||
const IS_PATCHED = Symbol("MutualGroupDMs.Patched");
|
||||
|
||||
export default definePlugin({
|
||||
|
@ -70,6 +94,13 @@ export default definePlugin({
|
|||
replace: "$1==='MUTUAL_GDMS'?$self.renderMutualGDMs(arguments[0]):$&"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
find: 'section:"MUTUAL_FRIENDS"',
|
||||
replacement: {
|
||||
match: /\.openUserProfileModal.+?\)}\)}\)(?<=(\(0,\i\.jsxs?\)\(\i\.\i,{className:(\i)\.divider}\)).+?)/,
|
||||
replace: "$&,$self.renderDMPageList({user: arguments[0].user, Divider: $1, listStyle: $2.list})"
|
||||
}
|
||||
}
|
||||
],
|
||||
|
||||
|
@ -84,28 +115,9 @@ export default definePlugin({
|
|||
},
|
||||
|
||||
renderMutualGDMs: ErrorBoundary.wrap(({ user, onClose }: { user: User, onClose: () => void; }) => {
|
||||
const mutualDms = useMemo(() => getMutualGroupDms(user.id), [user.id]);
|
||||
const mutualGDms = useMemo(() => getMutualGroupDms(user.id), [user.id]);
|
||||
|
||||
const entries = mutualDms.map(c => (
|
||||
<Clickable
|
||||
className={ProfileListClasses.listRow}
|
||||
onClick={() => {
|
||||
onClose();
|
||||
SelectedChannelActionCreators.selectPrivateChannel(c.id);
|
||||
}}
|
||||
>
|
||||
<Avatar
|
||||
src={IconUtils.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 + 1} Members</div>
|
||||
</div>
|
||||
</Clickable>
|
||||
));
|
||||
const entries = renderClickableGDMs(mutualGDms, onClose);
|
||||
|
||||
return (
|
||||
<ScrollerThin
|
||||
|
@ -124,5 +136,24 @@ export default definePlugin({
|
|||
}
|
||||
</ScrollerThin>
|
||||
);
|
||||
}),
|
||||
|
||||
renderDMPageList: ErrorBoundary.wrap(({ user, Divider, listStyle }: { user: User, Divider: JSX.Element, listStyle: string; }) => {
|
||||
const mutualGDms = getMutualGroupDms(user.id);
|
||||
if (mutualGDms.length === 0) return null;
|
||||
|
||||
const header = getMutualGDMCountText(user);
|
||||
|
||||
return (
|
||||
<>
|
||||
{Divider}
|
||||
<ExpandableList
|
||||
className={listStyle}
|
||||
header={header}
|
||||
isLoadingHeader={false}
|
||||
children={renderClickableGDMs(mutualGDms, () => { })}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
})
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue