Merge pull request #21613 from esh-g/OptionListLHN-Hightlight

Expensify · Jun 29, 2023 · c277423 · c277423
2 parents 5756206 + 8456ddb
commit c277423
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -1,5 +1,5 @@
 import _ from 'underscore';
-import React, {useEffect} from 'react';
+import React, {useEffect, useState} from 'react';
 import PropTypes from 'prop-types';
 import {View, StyleSheet} from 'react-native';
 import lodashGet from 'lodash/get';
@@ -65,6 +65,7 @@ const defaultProps = {
 
 function OptionRowLHN(props) {
     const optionItem = SidebarUtils.getOptionData(props.reportID);
+    const [isContextMenuActive, setIsContextMenuActive] = useState(false);
 
     useEffect(() => {
         if (!optionItem || optionItem.hasDraftComment || !props.comment || props.comment.length <= 0 || props.isFocused) {
@@ -112,6 +113,7 @@ function OptionRowLHN(props) {
      * @param {Object} [event] - A press event.
      */
     const showPopover = (event) => {
+        setIsContextMenuActive(true);
         ReportActionContextMenu.showContextMenu(
             ContextMenuActions.CONTEXT_MENU_TYPES.REPORT,
             event,
@@ -121,7 +123,7 @@ function OptionRowLHN(props) {
             {},
             '',
             () => {},
-            () => {},
+            () => setIsContextMenuActive(false),
             false,
             false,
             optionItem.isPinned,
@@ -157,7 +159,7 @@ function OptionRowLHN(props) {
                             styles.sidebarLinkInner,
                             StyleUtils.getBackgroundColorStyle(themeColors.sidebar),
                             props.isFocused ? styles.sidebarLinkActive : null,
-                            hovered && !props.isFocused ? props.hoverStyle : null,
+                            (hovered || isContextMenuActive) && !props.isFocused ? props.hoverStyle : null,
                         ]}
                         accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
                         accessibilityLabel={props.translate('accessibilityHints.navigatesToChat')}