import {COLORS} from '@shared/colors';

import {
  ButtonVariantType,
  DynamicButtonStyles,
  GetButtonStylesParams,
} from './interfaces';
import {BUTTON_COLOR_MAPPER, BUTTON_SIZE_MAPPER} from './constants';

export const getButtonStyles = ({
  variant,
  color,
  size,
  disabled,
}: GetButtonStylesParams): DynamicButtonStyles => {
  const sizeStyles = BUTTON_SIZE_MAPPER[size];
  const mainColor = BUTTON_COLOR_MAPPER[color];
  let variantStyles: DynamicButtonStyles = {};
  const textColor = disabled ? COLORS.DISABLED : mainColor;

  switch (variant) {
    case ButtonVariantType.contained:
    default:
      variantStyles = {
        containerStyle: {
          backgroundColor: disabled ? COLORS.DISABLED_BACKGROUND : mainColor,
        },
        textStyle: {
          color: disabled ? COLORS.DISABLED : COLORS.WHITE,
        },
        iconProps: {
          color: disabled ? COLORS.DISABLED : COLORS.WHITE,
        },
      };
      break;
    case ButtonVariantType.outlined:
      variantStyles = {
        containerStyle: {
          borderWidth: 1,
          borderColor: disabled ? COLORS.DISABLED_BACKGROUND : mainColor,
        },
        textStyle: {
          color: textColor,
        },
        iconProps: {
          color: textColor,
        },
      };
      break;
    case ButtonVariantType.text:
      variantStyles = {
        containerStyle: {
          width: 'auto',
          alignSelf: 'flex-start',
          paddingHorizontal: 0,
        },
        textStyle: {
          color: textColor,
        },
        iconProps: {
          color: textColor,
        },
      };
      break;
  }
  return {
    containerStyle: {
      ...sizeStyles.containerStyle,
      ...variantStyles.containerStyle,
    },
    textStyle: {
      ...sizeStyles.textStyle,
      ...variantStyles.textStyle,
    },
    iconProps: {
      ...sizeStyles.iconProps,
      ...variantStyles.iconProps,
    },
  };
};
