import {
  getAppearanceSource,
  NewThemeColors,
  ThemeAppearance,
  ThemeColors,
} from '@shared/theme';
import {COLORS} from '@shared/colors';

import {ButtonVariant} from './interfaces';

export const getColorsByVariant = ({
  variant,
  disabled,
  isLoading,
  appearance,
  theme,
}: {
  variant: ButtonVariant;
  disabled?: boolean;
  isLoading?: boolean;
  appearance?: ThemeAppearance;
  theme: ThemeColors & NewThemeColors;
}) => {
  const source =
    appearance === 'auto' ? theme : getAppearanceSource(appearance);

  switch (variant) {
    case 'tertiary':
      return {
        backgroundColor: isLoading
          ? source.button.background.tertiary.hover
          : COLORS.TRANSPARENT_WHITE, // Transparent white color. This is necessary for a smooth animation
        textColor: disabled
          ? source.text.neutral.disabled
          : source.text.neutral.brand,
        underlayColor: source.button.background.tertiary.hover,
      };
    case 'secondary':
      return {
        backgroundColor: isLoading
          ? source.button.background.secondary.hover
          : source.button.background.secondary.default,
        textColor: disabled
          ? source.text.neutral.disabled
          : source.text.neutral.brand,
        borderColor: disabled
          ? source.border.neutral.default
          : source.border.neutral.brand,
        underlayColor: source.button.background.secondary.hover,
      };
    case 'secondaryActive':
      return {
        backgroundColor: source.background.layout.brand,
        textColor: disabled
          ? source.text.neutral.disabled
          : source.text.neutral.brand,
        borderColor: disabled
          ? source.button.background.secondary.hover
          : source.border.neutral.brand,
      };
    case 'flat':
      return {
        backgroundColor: 'transparent',
        textColor: disabled
          ? source.text.neutral.disabled
          : source.text.neutral.brand,
        borderColor: 'transparent',
        underlayColor: source.button.background.tertiary.hover,
      };
    case 'error':
      return {
        backgroundColor: disabled
          ? source.button.background.error.disabled
          : isLoading
          ? source.button.background.error.focus
          : source.button.background.error.default,
        textColor: source.text.neutral.inverted,
        underlayColor: source.button.background.error.hover,
      };
    case 'success':
      return {
        backgroundColor: disabled
          ? source.button.background.success.disabled
          : isLoading
          ? source.button.background.success.hover
          : source.button.background.success.default,
        textColor: source.text.neutral.inverted,
        underlayColor: source.button.background.success.hover,
      };
    case 'primary':
    default:
      return {
        backgroundColor: disabled
          ? source.button.background.primary.disabled
          : isLoading
          ? source.button.background.primary.hover
          : source.button.background.primary.default,
        textColor: disabled
          ? source.text.neutral.disabled
          : source.text.neutral.inverted,
        underlayColor: source.button.background.primary.hover,
      };
  }
};
