From 298ea3fe2d0e3caf42eed73c8e8ffca891770b1f Mon Sep 17 00:00:00 2001
From: Carlos Martins <cmartins@expensify.com>
Date: Wed, 14 Aug 2024 15:48:51 -0600
Subject: [PATCH] fix styles

---
 src/components/Search/SearchStatusBar.tsx | 30 ++++++++++++++---------
 src/styles/index.ts                       |  2 +-
 2 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/components/Search/SearchStatusBar.tsx b/src/components/Search/SearchStatusBar.tsx
index c8ffcdad6ac9..2d92e796e95e 100644
--- a/src/components/Search/SearchStatusBar.tsx
+++ b/src/components/Search/SearchStatusBar.tsx
@@ -1,5 +1,7 @@
 import React from 'react';
+import {View} from 'react-native';
 import Button from '@components/Button';
+import Hoverable from '@components/Hoverable';
 import * as Expensicons from '@components/Icon/Expensicons';
 import ScrollView from '@components/ScrollView';
 import useLocalize from '@hooks/useLocalize';
@@ -138,17 +140,23 @@ function SearchStatusBar({type, status}: SearchStatusBarProps) {
                 const isActive = status === item.key;
 
                 return (
-                    <Button
-                        key={item.key}
-                        text={translate(item.text)}
-                        onPress={onPress}
-                        icon={item.icon}
-                        iconFill={isActive ? theme.success : undefined}
-                        innerStyles={!isActive && styles.bgTransparent}
-                        textStyles={!isActive ? StyleUtils.getTextColorStyle(theme.textSupporting) : undefined}
-                        hoverStyles={StyleUtils.getBackgroundColorStyle(!isActive ? theme.highlightBG : theme.border)}
-                        medium
-                    />
+                    <Hoverable>
+                        {(isHovered) => (
+                            <View>
+                                <Button
+                                    key={item.key}
+                                    text={translate(item.text)}
+                                    onPress={onPress}
+                                    icon={item.icon}
+                                    iconFill={isActive || isHovered ? theme.success : undefined}
+                                    innerStyles={!isActive && styles.bgTransparent}
+                                    hoverStyles={StyleUtils.getBackgroundColorStyle(!isActive ? theme.highlightBG : theme.border)}
+                                    textStyles={!isActive && !isHovered && StyleUtils.getTextColorStyle(theme.textSupporting)}
+                                    medium
+                                />
+                            </View>
+                        )}
+                    </Hoverable>
                 );
             })}
         </ScrollView>
diff --git a/src/styles/index.ts b/src/styles/index.ts
index aaff81f1325a..31d4c030991d 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4253,7 +4253,7 @@ const styles = (theme: ThemeColors) =>
         tabText: (isSelected: boolean) =>
             ({
                 marginLeft: 8,
-                ...(isSelected ? FontUtils.fontFamily.platform.EXP_NEUE_BOLD : FontUtils.fontFamily.platform.EXP_NEUE),
+                ...FontUtils.fontFamily.platform.EXP_NEUE_BOLD,
                 color: isSelected ? theme.text : theme.textSupporting,
                 lineHeight: variables.lineHeightNormal,
                 fontSize: variables.fontSizeNormal,