chore: code improvements

Author: ignaciosantise

packages/ui/src/composites/wui-button/styles.ts

@@ -38,9 +38,7 @@ export const getThemedTextStyle = (
   disabled?: boolean
 ): StyleProp<any> => {
   if (disabled) {
-    return variant === 'fill'
-      ? { color: theme['gray-glass-020'] }
-      : { color: theme['gray-glass-020'] };
+    return { color: theme['gray-glass-020'] };
   }
 
   return variant === 'fill'

packages/ui/src/composites/wui-network-button/index.tsx

@@ -47,24 +47,52 @@ export function NetworkButton({
       onPressOut={setStartValue}
       disabled={disabled}
     >
-      {loading ? (
-        <LoadingSpinner size="md" style={styles.loader} />
-      ) : imageSrc ? (
-        <Image
-          style={[
-            styles.image,
-            { borderColor: Theme['gray-glass-005'] },
-            disabled && styles.imageDisabled
-          ]}
-          source={imageSrc}
-          headers={imageHeaders}
-        />
-      ) : (
-        <IconBox icon="networkPlaceholder" background iconColor={textColor} size="sm" />
-      )}
+      <LoaderComponent loading={loading} />
+      <ImageComponent
+        loading={loading}
+        disabled={disabled}
+        imageSrc={imageSrc}
+        imageHeaders={imageHeaders}
+        borderColor={Theme['gray-glass-005']}
+      />
       <Text style={styles.text} variant="paragraph-600" color={textColor}>
         {children}
       </Text>
     </AnimatedPressable>
   );
 }
+
+function LoaderComponent({ loading }: { loading?: boolean }) {
+  if (!loading) return null;
+
+  return <LoadingSpinner size="md" style={styles.loader} />;
+}
+
+function ImageComponent({
+  loading,
+  disabled,
+  imageSrc,
+  imageHeaders,
+  borderColor
+}: {
+  loading?: boolean;
+  disabled?: boolean;
+  imageSrc?: string;
+  imageHeaders?: Record<string, string>;
+  borderColor: string;
+}) {
+  if (loading) return null;
+
+  const textColor = disabled ? 'fg-300' : 'fg-100';
+  if (!imageSrc) {
+    return <IconBox icon="networkPlaceholder" background iconColor={textColor} size="sm" />;
+  }
+
+  return (
+    <Image
+      style={[styles.image, { borderColor }, disabled && styles.imageDisabled]}
+      source={imageSrc}
+      headers={imageHeaders}
+    />
+  );
+}