From 8edc58d610718c525e4c882055e0027e2c6a875f Mon Sep 17 00:00:00 2001
From: nkdengineer <nkdengineer@outlook.com>
Date: Tue, 29 Oct 2024 16:31:11 +0700
Subject: [PATCH] add shouldRemoveHoverBackground prop

---
 src/components/MenuItem.tsx    | 6 +++++-
 src/components/PopoverMenu.tsx | 1 +
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx
index a40fd925cd2e..602ecca3518c 100644
--- a/src/components/MenuItem.tsx
+++ b/src/components/MenuItem.tsx
@@ -251,6 +251,9 @@ type MenuItemBaseProps = {
     /** Should we remove the background color of the menu item */
     shouldRemoveBackground?: boolean;
 
+    /** Should we remove the hover background color of the menu item */
+    shouldRemoveHoverBackground?: boolean;
+
     /** Should we use default cursor for disabled content */
     shouldUseDefaultCursorWhenDisabled?: boolean;
 
@@ -411,6 +414,7 @@ function MenuItem(
         shouldEscapeText = undefined,
         shouldGreyOutWhenDisabled = true,
         shouldRemoveBackground = false,
+        shouldRemoveHoverBackground = false,
         shouldUseDefaultCursorWhenDisabled = false,
         shouldShowLoadingSpinnerIcon = false,
         isAnonymousAction = false,
@@ -594,7 +598,7 @@ function MenuItem(
                                             StyleUtils.getButtonBackgroundColorStyle(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true),
                                         ...(Array.isArray(wrapperStyle) ? wrapperStyle : [wrapperStyle]),
                                         shouldGreyOutWhenDisabled && disabled && styles.buttonOpacityDisabled,
-                                        isHovered && interactive && !focused && !pressed && !shouldRemoveBackground && styles.hoveredComponentBG,
+                                        isHovered && interactive && !focused && !pressed && !shouldRemoveBackground && !shouldRemoveHoverBackground && styles.hoveredComponentBG,
                                     ] as StyleProp<ViewStyle>
                                 }
                                 disabledStyle={shouldUseDefaultCursorWhenDisabled && [styles.cursorDefault]}
diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx
index b1aa34bbf1fd..9aab414971de 100644
--- a/src/components/PopoverMenu.tsx
+++ b/src/components/PopoverMenu.tsx
@@ -323,6 +323,7 @@ function PopoverMenu({
                                             setFocusedIndex(menuIndex);
                                         }}
                                         wrapperStyle={StyleUtils.getItemBackgroundColorStyle(!!item.isSelected, focusedIndex === menuIndex, theme.activeComponentBG, theme.hoverComponentBG)}
+                                        shouldRemoveHoverBackground={item.isSelected}
                                         titleStyle={StyleSheet.flatten([styles.flex1, item.titleStyle])}
                                         // eslint-disable-next-line react/jsx-props-no-spreading
                                         {...menuItemProps}