diff --git a/src/plugins/mentionAvatars/index.tsx b/src/plugins/mentionAvatars/index.tsx index 549693142c..311303ab92 100644 --- a/src/plugins/mentionAvatars/index.tsx +++ b/src/plugins/mentionAvatars/index.tsx @@ -6,12 +6,21 @@ import "./styles.css"; +import { definePluginSettings } from "@api/Settings"; import ErrorBoundary from "@components/ErrorBoundary"; import { Devs } from "@utils/constants"; -import definePlugin from "@utils/types"; +import definePlugin, { OptionType } from "@utils/types"; import { SelectedGuildStore, useState } from "@webpack/common"; import { User } from "discord-types/general"; +const settings = definePluginSettings({ + showAtSymbol: { + type: OptionType.BOOLEAN, + description: "Whether the the @ symbol should be displayed", + default: true + } +}); + export default definePlugin({ name: "MentionAvatars", description: "Shows user avatars inside mentions", @@ -25,11 +34,13 @@ export default definePlugin({ } }], + settings, + renderUsername: ErrorBoundary.wrap((props: { user: User, username: string; }) => { const { user, username } = props; const [isHovering, setIsHovering] = useState(false); - if (!user) return <>@{username}; + if (!user) return <>{getUsernameString(username)}; return ( setIsHovering(false)} > - @{username} + {getUsernameString(username)} ); }, { noop: true }) + }); + +function getUsernameString(username: string) { + return settings.store.showAtSymbol + ? `@${username}` + : username; +}