From 4fc7f6e45338766bfd7b007e34d63200a8e8104d Mon Sep 17 00:00:00 2001
From: programminglaboratorys <programming.laboratorys@gmail.com>
Date: Tue, 1 Oct 2024 18:01:18 +0300
Subject: [PATCH] fix click issues

---
 src/plugins/statusPresets/index.tsx      | 11 ++++++-----
 src/webpack/common/types/components.d.ts |  2 +-
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/plugins/statusPresets/index.tsx b/src/plugins/statusPresets/index.tsx
index edb830661..4dfcaaf73 100644
--- a/src/plugins/statusPresets/index.tsx
+++ b/src/plugins/statusPresets/index.tsx
@@ -54,15 +54,15 @@ const EmojiComponent = findComponentByCodeLazy(".translateSurrogatesToInlineEmoj
 
 const customStatusSettings = getUserSettingLazy("status", "customStatus");
 
-const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={() => customStatusSettings?.updateSetting(null)}><Icons.CircleXIcon size="sm" style={{ pointerEvents: "none" }} /></Clickable>;
+const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={e => { e.stopPropagation(); customStatusSettings?.updateSetting(null); }}><Icons.CircleXIcon size="sm" /></Clickable>;
 
 function StatusIcon({ isHovering, status }: { isHovering: boolean; status: DiscordStatus; }) {
     return <div className={StatusStyles.status}>{isHovering ?
-        <Icons.CircleXIcon size="sm" style={{ pointerEvents: "none" }} />
+        <Icons.CircleXIcon size="sm" />
         : (status.emojiInfo != null ? <EmojiComponent emoji={status.emojiInfo} animate={false} hideTooltip={false} /> : <div className={StatusStyles.customEmojiPlaceholder} />)}</div>;
 }
 
-const RenderStatusMenuItem = ({ status, forceRerender }: { status: DiscordStatus; forceRerender: ()=>void}) => {
+const RenderStatusMenuItem = ({ status, forceRerender }: { status: DiscordStatus; forceRerender: () => void; }) => {
     const [isHovering, setIsHovering] = useState(false);
     const handleMouseOver = () => {
         setIsHovering(true);
@@ -80,7 +80,8 @@ const RenderStatusMenuItem = ({ status, forceRerender }: { status: DiscordStatus
         onMouseOver={handleMouseOver}
         onMouseOut={handleMouseOut}>
         <Clickable
-            onClick={() => {
+            onClick={e => {
+                e.stopPropagation();
                 delete settings.store.StatusPresets[status.text];
                 forceRerender();
                 Toasts.show({
@@ -157,7 +158,7 @@ export default definePlugin({
             look={Button.Looks.LINK}
             color={Button.Colors.WHITE}
             size={Button.Sizes.MEDIUM}
-            onClick={() => {
+            onClick={e => {
                 settings.store.StatusPresets[statue.text] = statue;
                 Toasts.show({
                     message: "Successfully Saved Status",
diff --git a/src/webpack/common/types/components.d.ts b/src/webpack/common/types/components.d.ts
index 260a763a7..2f933046a 100644
--- a/src/webpack/common/types/components.d.ts
+++ b/src/webpack/common/types/components.d.ts
@@ -477,7 +477,7 @@ export type Clickable = ComponentType<PropsWithChildren<{
     href?: string;
     ignoreKeyPress?: boolean;
 
-    onClick?(): void;
+    onClick?(e: React.MouseEvent<any>): void;
     onKeyPress?(): void;
 }>>;