diff --git a/src/components/SelectionList/Search/ActionCell.tsx b/src/components/SelectionList/Search/ActionCell.tsx
index db5077beca9a..c7e7f587769c 100644
--- a/src/components/SelectionList/Search/ActionCell.tsx
+++ b/src/components/SelectionList/Search/ActionCell.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useCallback} from 'react';
import {View} from 'react-native';
import Badge from '@components/Badge';
import Button from '@components/Button';
@@ -36,7 +36,7 @@ type ActionCellProps = {
function ActionCell({
action = CONST.SEARCH.ACTION_TYPES.VIEW,
- shouldUseSuccessStyle = true,
+ shouldUseSuccessStyle: shouldUseSuccessStyleProp = true,
isLargeScreenWidth = true,
isSelected = false,
goToItem,
@@ -52,6 +52,16 @@ function ActionCell({
const text = translate(actionTranslationsMap[action]);
+ const getButtonInnerStyles = useCallback(
+ (shouldUseSuccessStyle: boolean) => {
+ if (!isSelected) {
+ return {};
+ }
+ return shouldUseSuccessStyle ? styles.buttonSuccessHovered : styles.buttonDefaultHovered;
+ },
+ [isSelected, styles],
+ );
+
const shouldUseViewAction = action === CONST.SEARCH.ACTION_TYPES.VIEW || (parentAction === CONST.SEARCH.ACTION_TYPES.PAID && action === CONST.SEARCH.ACTION_TYPES.PAID);
if ((parentAction !== CONST.SEARCH.ACTION_TYPES.PAID && action === CONST.SEARCH.ACTION_TYPES.PAID) || action === CONST.SEARCH.ACTION_TYPES.DONE) {
@@ -78,30 +88,28 @@ function ActionCell({
}
if (action === CONST.SEARCH.ACTION_TYPES.VIEW || shouldUseViewAction) {
- const buttonInnerStyles = isSelected ? styles.buttonDefaultHovered : {};
return isLargeScreenWidth ? (
) : null;
}
- const buttonInnerStyles = isSelected ? styles.buttonSuccessHovered : {};
return (
);