fix pr comments

Expensify · Dec 20, 2023 · dbfb60a · dbfb60a
1 parent 920efa8
commit dbfb60a
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 15 deletions.
diff --git a/src/components/TabSelector/TabIcon.tsx b/src/components/TabSelector/TabIcon.tsx
@@ -7,10 +7,10 @@ type TabIconProps = {
     /** Icon to display on tab */
     icon?: (props: SrcProps) => React.ReactNode;
 
-    /** Animated opacity value while the label is inactive state */
+    /** Animated opacity value while the icon is in inactive state */
     inactiveOpacity?: number | Animated.AnimatedInterpolation<number>;
 
-    /** Animated opacity value while the label is in active state */
+    /** Animated opacity value while the icon is in active state */
     activeOpacity?: number | Animated.AnimatedInterpolation<number>;
 };
 

diff --git a/src/components/TabSelector/TabLabel.tsx b/src/components/TabSelector/TabLabel.tsx
@@ -6,7 +6,7 @@ type TabLabelProps = {
     /** Title of the tab */
     title?: string;
 
-    /** Animated opacity value while the label is inactive state */
+    /** Animated opacity value while the label is in inactive state */
     inactiveOpacity?: number | Animated.AnimatedInterpolation<number>;
 
     /** Animated opacity value while the label is in active state */

diff --git a/src/components/TabSelector/TabSelector.tsx b/src/components/TabSelector/TabSelector.tsx
@@ -99,11 +99,11 @@ function TabSelector({state, navigation, onTabPress = () => {}, position}: TabSe
                 const activeOpacity = getOpacity(position, state.routes.length, index, true, affectedAnimatedTabs);
                 const inactiveOpacity = getOpacity(position, state.routes.length, index, false, affectedAnimatedTabs);
                 const backgroundColor = getBackgroundColor(state.routes.length, index, affectedAnimatedTabs);
-                const isFocused = index === state.index;
+                const isActive = index === state.index;
                 const {icon, title} = getIconAndTitle(route.name, translate);
 
                 const onPress = () => {
-                    if (isFocused) {
+                    if (isActive) {
                         return;
                     }
 
@@ -132,7 +132,7 @@ function TabSelector({state, navigation, onTabPress = () => {}, position}: TabSe
                         activeOpacity={activeOpacity}
                         inactiveOpacity={inactiveOpacity}
                         backgroundColor={backgroundColor}
-                        isFocused={isFocused}
+                        isActive={isActive}
                     />
                 );
             })}

diff --git a/src/components/TabSelector/TabSelectorItem.tsx b/src/components/TabSelector/TabSelectorItem.tsx
@@ -19,17 +19,17 @@ type TabSelectorItemProps = {
     /** Animated background color value for the tab button */
     backgroundColor?: string | Animated.AnimatedInterpolation<string>;
 
-    /** Animated opacity value while the label is inactive state */
+    /** Animated opacity value while the tab is in inactive state */
     inactiveOpacity?: number | Animated.AnimatedInterpolation<number>;
 
-    /** Animated opacity value while the label is in active state */
+    /** Animated opacity value while the tab is in active state */
     activeOpacity?: number | Animated.AnimatedInterpolation<number>;
 
     /** Whether this tab is active */
-    isFocused?: boolean;
+    isActive?: boolean;
 };
 
-function TabSelectorItem({icon, title = '', onPress = () => {}, backgroundColor = '', activeOpacity = 0, inactiveOpacity = 1, isFocused = false}: TabSelectorItemProps) {
+function TabSelectorItem({icon, title = '', onPress = () => {}, backgroundColor = '', activeOpacity = 0, inactiveOpacity = 1, isActive = false}: TabSelectorItemProps) {
     const styles = useThemeStyles();
     return (
         <PressableWithFeedback
@@ -39,16 +39,16 @@ function TabSelectorItem({icon, title = '', onPress = () => {}, backgroundColor
             onPress={onPress}
         >
             {({hovered}) => (
-                <Animated.View style={[styles.tabSelectorButton, StyleSheet.absoluteFill, styles.tabBackground(hovered, isFocused, backgroundColor)]}>
+                <Animated.View style={[styles.tabSelectorButton, StyleSheet.absoluteFill, styles.tabBackground(hovered, isActive, backgroundColor)]}>
                     <TabIcon
                         icon={icon}
-                        activeOpacity={styles.tabOpacity(hovered, isFocused, activeOpacity, inactiveOpacity).opacity}
-                        inactiveOpacity={styles.tabOpacity(hovered, isFocused, inactiveOpacity, activeOpacity).opacity}
+                        activeOpacity={styles.tabOpacity(hovered, isActive, activeOpacity, inactiveOpacity).opacity}
+                        inactiveOpacity={styles.tabOpacity(hovered, isActive, inactiveOpacity, activeOpacity).opacity}
                     />
                     <TabLabel
                         title={title}
-                        activeOpacity={styles.tabOpacity(hovered, isFocused, activeOpacity, inactiveOpacity).opacity}
-                        inactiveOpacity={styles.tabOpacity(hovered, isFocused, inactiveOpacity, activeOpacity).opacity}
+                        activeOpacity={styles.tabOpacity(hovered, isActive, activeOpacity, inactiveOpacity).opacity}
+                        inactiveOpacity={styles.tabOpacity(hovered, isActive, inactiveOpacity, activeOpacity).opacity}
                     />
                 </Animated.View>
             )}