new plugin MentionAvatars: Shows user avatars inside mentions (#2691)
This commit is contained in:
parent
0057ab42e8
commit
92ae62602b
6 changed files with 75 additions and 33 deletions
5
src/plugins/mentionAvatars/README.md
Normal file
5
src/plugins/mentionAvatars/README.md
Normal file
|
@ -0,0 +1,5 @@
|
|||
# MentionAvatars
|
||||
|
||||
Shows user avatars inside mentions
|
||||
|
||||
![](https://github.com/user-attachments/assets/fc76ea47-5e19-4063-a592-c57785a75cc7)
|
44
src/plugins/mentionAvatars/index.tsx
Normal file
44
src/plugins/mentionAvatars/index.tsx
Normal file
|
@ -0,0 +1,44 @@
|
|||
/*
|
||||
* Vencord, a Discord client mod
|
||||
* Copyright (c) 2024 Vendicated and contributors
|
||||
* SPDX-License-Identifier: GPL-3.0-or-later
|
||||
*/
|
||||
|
||||
import "./styles.css";
|
||||
|
||||
import ErrorBoundary from "@components/ErrorBoundary";
|
||||
import { Devs } from "@utils/constants";
|
||||
import definePlugin from "@utils/types";
|
||||
import { SelectedGuildStore, useState } from "@webpack/common";
|
||||
import { User } from "discord-types/general";
|
||||
|
||||
export default definePlugin({
|
||||
name: "MentionAvatars",
|
||||
description: "Shows user avatars inside mentions",
|
||||
authors: [Devs.Ven],
|
||||
|
||||
patches: [{
|
||||
find: ".USER_MENTION)",
|
||||
replacement: {
|
||||
match: /children:"@"\.concat\((null!=\i\?\i:\i)\)(?<=\.useName\((\i)\).+?)/,
|
||||
replace: "children:$self.renderUsername({username:$1,user:$2})"
|
||||
}
|
||||
}],
|
||||
|
||||
renderUsername: ErrorBoundary.wrap((props: { user: User, username: string; }) => {
|
||||
const { user, username } = props;
|
||||
const [isHovering, setIsHovering] = useState(false);
|
||||
|
||||
if (!user) return <>@{username}</>;
|
||||
|
||||
return (
|
||||
<span
|
||||
onMouseEnter={() => setIsHovering(true)}
|
||||
onMouseLeave={() => setIsHovering(false)}
|
||||
>
|
||||
<img src={user.getAvatarURL(SelectedGuildStore.getGuildId(), 16, isHovering)} className="vc-mentionAvatars-avatar" />
|
||||
@{username}
|
||||
</span>
|
||||
);
|
||||
}, { noop: true })
|
||||
});
|
8
src/plugins/mentionAvatars/styles.css
Normal file
8
src/plugins/mentionAvatars/styles.css
Normal file
|
@ -0,0 +1,8 @@
|
|||
.vc-mentionAvatars-avatar {
|
||||
vertical-align: middle;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin: 0 4px 0.2rem 2px;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
}
|
|
@ -60,7 +60,7 @@ export default definePlugin({
|
|||
find: 'location:"UserMention',
|
||||
replacement: [
|
||||
{
|
||||
match: /user:(\i),channel:(\i).{0,400}?"@"\.concat\(.+?\)/,
|
||||
match: /onContextMenu:\i,color:\i,\.\.\.\i(?=,children:)(?<=user:(\i),channel:(\i).{0,500}?)/,
|
||||
replace: "$&,color:$self.getUserColor($1?.id,{channelId:$2?.id})"
|
||||
}
|
||||
],
|
||||
|
|
|
@ -18,34 +18,21 @@
|
|||
|
||||
import { definePluginSettings, migratePluginSettings } from "@api/Settings";
|
||||
import { Devs } from "@utils/constants";
|
||||
import definePlugin, { OptionType } from "@utils/types";
|
||||
import definePlugin, { OptionType, PluginSettingDef } from "@utils/types";
|
||||
|
||||
const opt = (description: string) => ({
|
||||
type: OptionType.BOOLEAN,
|
||||
description,
|
||||
default: true,
|
||||
restartNeeded: true
|
||||
} satisfies PluginSettingDef);
|
||||
|
||||
const settings = definePluginSettings({
|
||||
showTimeouts: {
|
||||
type: OptionType.BOOLEAN,
|
||||
description: "Show member timeout icons in chat.",
|
||||
default: true,
|
||||
},
|
||||
showInvitesPaused: {
|
||||
type: OptionType.BOOLEAN,
|
||||
description: "Show the invites paused tooltip in the server list.",
|
||||
default: true,
|
||||
},
|
||||
showModView: {
|
||||
type: OptionType.BOOLEAN,
|
||||
description: "Show the member mod view context menu item in all servers.",
|
||||
default: true,
|
||||
},
|
||||
disableDiscoveryFilters: {
|
||||
type: OptionType.BOOLEAN,
|
||||
description: "Disable filters in Server Discovery search that hide servers that don't meet discovery criteria.",
|
||||
default: true,
|
||||
},
|
||||
disableDisallowedDiscoveryFilters: {
|
||||
type: OptionType.BOOLEAN,
|
||||
description: "Disable filters in Server Discovery search that hide NSFW & disallowed servers.",
|
||||
default: true,
|
||||
},
|
||||
showTimeouts: opt("Show member timeout icons in chat."),
|
||||
showInvitesPaused: opt("Show the invites paused tooltip in the server list."),
|
||||
showModView: opt("Show the member mod view context menu item in all servers."),
|
||||
disableDiscoveryFilters: opt("Disable filters in Server Discovery search that hide servers that don't meet discovery criteria."),
|
||||
disableDisallowedDiscoveryFilters: opt("Disable filters in Server Discovery search that hide NSFW & disallowed servers."),
|
||||
});
|
||||
|
||||
migratePluginSettings("ShowHiddenThings", "ShowTimeouts");
|
||||
|
|
|
@ -186,12 +186,10 @@ export default definePlugin({
|
|||
// Avatar component used in User DMs "User Profile" popup in the right and Profiles Modal pfp
|
||||
{
|
||||
find: ".overlay:void 0,status:",
|
||||
replacement: [
|
||||
...[/"PRESS_VIEW_PROFILE".+?(?=children:)(?<=avatarSrc:(\i).+?)/, /avatarSrc:(\i),eventHandlers:(\i).+?"div",{...\2,/].map(match => ({
|
||||
match,
|
||||
replace: "$&style:{cursor:\"pointer\"},onClick:()=>{$self.openImage($1)},"
|
||||
}))
|
||||
]
|
||||
replacement: {
|
||||
match: /avatarSrc:(\i),eventHandlers:(\i).+?"div",{...\2,/,
|
||||
replace: "$&style:{cursor:\"pointer\"},onClick:()=>{$self.openImage($1)},"
|
||||
}
|
||||
},
|
||||
// Old Profiles Modal pfp
|
||||
{
|
||||
|
|
Loading…
Reference in a new issue