mirrors/Vencord
1
0
Fork 1
mirror of https://github.com/Vendicated/Vencord.git synced 2025-01-10 18:06:22 +00:00
Code Activity

force re-render on removing a custom status

Browse source
This commit is contained in:
programminglaboratorys 2024-10-01 17:17:19 +03:00
parent 65bf6d45d2
commit f1aba76502
1 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/plugins/statusPresets/index.tsx
View file

@ -54,15 +54,15 @@ const EmojiComponent = findComponentByCodeLazy(".translateSurrogatesToInlineEmoj
const customStatusSettings = getUserSettingLazy("status", "customStatus"); const customStatusSettings = getUserSettingLazy("status", "customStatus");
const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={() => customStatusSettings?.updateSetting(null)}><Icons.CircleXIcon size="sm" /></Clickable>; const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={() => customStatusSettings?.updateSetting(null)}><Icons.CircleXIcon size="sm" style={{ pointerEvents: "none" }} /></Clickable>;
function StatusIcon({ isHovering, status }: { isHovering: boolean; status: DiscordStatus; }) { function StatusIcon({ isHovering, status }: { isHovering: boolean; status: DiscordStatus; }) {
return <div className={StatusStyles.status}>{isHovering ? return <div className={StatusStyles.status}>{isHovering ?
<Icons.CircleXIcon size="sm" /> <Icons.CircleXIcon size="sm" style={{ pointerEvents: "none" }} />
: (status.emojiInfo != null ? <EmojiComponent emoji={status.emojiInfo} animate={false} hideTooltip={false} /> : <div className={StatusStyles.customEmojiPlaceholder} />)}</div>; : (status.emojiInfo != null ? <EmojiComponent emoji={status.emojiInfo} animate={false} hideTooltip={false} /> : <div className={StatusStyles.customEmojiPlaceholder} />)}</div>;
} }
const RenderStatusMenuItem = ({ status }: { status: DiscordStatus; }) => { const RenderStatusMenuItem = ({ status, forceRerender }: { status: DiscordStatus; forceRerender: ()=>void}) => {
const [isHovering, setIsHovering] = useState(false); const [isHovering, setIsHovering] = useState(false);
const handleMouseOver = () => { const handleMouseOver = () => {
setIsHovering(true); setIsHovering(true);
@ -75,13 +75,14 @@ const RenderStatusMenuItem = ({ status }: { status: DiscordStatus; }) => {
return <div className={StatusStyles.statusItem} return <div className={StatusStyles.statusItem}
style={isHovering ? { style={isHovering ? {
backgroundColor: "var(--menu-item-default-hover-bg)", backgroundColor: "var(--menu-item-default-hover-bg)",
color: "var(--white)" color: "var(--white)",
} : {}} } : {}}
onMouseOver={handleMouseOver} onMouseOver={handleMouseOver}
onMouseOut={handleMouseOut}> onMouseOut={handleMouseOut}>
<Clickable <Clickable
onClick={() => { onClick={() => {
delete settings.store.StatusPresets[status.text]; delete settings.store.StatusPresets[status.text];
forceRerender();
Toasts.show({ Toasts.show({
message: "Successfully removed Status", message: "Successfully removed Status",
type: Toasts.Type.SUCCESS, type: Toasts.Type.SUCCESS,
@ -94,12 +95,14 @@ const RenderStatusMenuItem = ({ status }: { status: DiscordStatus; }) => {
const StatusSubMenuComponent = () => { const StatusSubMenuComponent = () => {
const [, forceUpdate] = useState(0);
const forceRerender = () => forceUpdate(v => v + 1);
return <Menu.Menu navId="sp-custom-status-submenu" onClose={() => { }}> return <Menu.Menu navId="sp-custom-status-submenu" onClose={() => { }}>
{Object.entries((settings.store.StatusPresets as { [k: string]: DiscordStatus; })).map(([index, status]) => <Menu.MenuItem {Object.entries((settings.store.StatusPresets as { [k: string]: DiscordStatus; })).map(([index, status]) => <Menu.MenuItem
id={"status-presets-" + index} id={"status-presets-" + index}
label={status.status} label={status.status}
action={() => setStatus(status.text, status.emojiInfo, status.clearAfter, { "location": { "section": "Account Panel", "object": "Avatar" } })} action={() => setStatus(status.text, status.emojiInfo, status.clearAfter, { "location": { "section": "Account Panel", "object": "Avatar" } })}
render={() => <RenderStatusMenuItem status={status} />} render={() => <RenderStatusMenuItem status={status} forceRerender={forceRerender} />}
/>)} />)}
</Menu.Menu>; </Menu.Menu>;
}; };