fix lint errors

Expensify · Nov 30, 2023 · 67751ef · 67751ef
1 parent 8c9750f
commit 67751ef
Showing 1 changed file with 13 additions and 11 deletions.
diff --git a/src/components/Icon/index.tsx b/src/components/Icon/index.tsx
@@ -47,18 +47,20 @@ type IconProps = {
 const defaultProps = {
     width: variables.iconSizeNormal,
     height: variables.iconSizeNormal,
-    fill: themeColors.icon,
+    fill: undefined,
     small: false,
     inline: false,
     additionalStyles: [],
     hovered: false,
     pressed: false,
 };
 
-function Icon({src, width, height, fill, small, inline, hovered, pressed, themeStyles, additionalStyles}: IconProps) {
-    const effectiveWidth = small ? variables.iconSizeSmall : width;
-    const effectiveHeight = small ? variables.iconSizeSmall : height;
+function Icon({src, width, height, fill, small, inline, hovered, pressed, theme, themeStyles, additionalStyles}: IconProps) {
+    const iconWidth = small ? variables.iconSizeSmall : width;
+    const iconHeight = small ? variables.iconSizeSmall : height;
     const iconStyles = [StyleUtils.getWidthAndHeightStyle(width ?? 0, height), IconWrapperStyles, themeStyles.pAbsolute, additionalStyles];
+    const iconFill = fill ?? theme.icon;
+    const IconComponent = src;
 
     if (inline) {
         return (
@@ -68,9 +70,9 @@ function Icon({src, width, height, fill, small, inline, hovered, pressed, themeS
             >
                 <View style={iconStyles}>
                     <IconComponent
-                        width={effectiveWidth}
-                        height={effectiveHeight}
-                        fill={fill}
+                        width={iconWidth}
+                        height={iconHeight}
+                        fill={iconFill}
                         hovered={hovered?.toString()}
                         pressed={pressed?.toString()}
                     />
@@ -85,9 +87,9 @@ function Icon({src, width, height, fill, small, inline, hovered, pressed, themeS
             style={additionalStyles}
         >
             <IconComponent
-                width={effectiveWidth}
-                height={effectiveHeight}
-                fill={fill}
+                width={iconWidth}
+                height={iconHeight}
+                fill={iconFill}
                 hovered={hovered?.toString()}
                 pressed={pressed?.toString()}
             />
@@ -98,4 +100,4 @@ function Icon({src, width, height, fill, small, inline, hovered, pressed, themeS
 Icon.defaultProps = defaultProps;
 Icon.displayName = 'Icon';
 
-export default withThemeStyles(Icon);
+export default withTheme(withThemeStyles(Icon));