import {StyleSheet} from 'react-native';
import {
  IconAlertTriangle,
  IconCircleCheck,
  IconCircleX,
  IconInfoCircle,
  IconInfoSquareRounded,
  IconSearch,
  IconWifiOff,
} from '@tabler/icons-react-native';
import {SPACING} from '@shared/theme';

import {StateCardVariant} from './interfaces';
import {AvatarProps} from '../Avatar';

export const getAvatarPropsByVariant = (
  variant: StateCardVariant,
): AvatarProps => {
  switch (variant) {
    case 'empty':
      return {
        variant: 'primary',
        Icon: IconInfoCircle,
      };
    case 'success':
      return {
        variant: 'success',
        Icon: IconCircleCheck,
      };
    case 'wifi-off':
      return {
        variant: 'warning',
        Icon: IconWifiOff,
      };
    case 'error':
      return {
        variant: 'error',
        Icon: IconCircleX,
      };
    case 'system-failure':
      return {
        variant: 'warning',
        Icon: IconAlertTriangle,
      };
    case 'no-results':
      return {
        variant: 'primary',
        Icon: IconSearch,
      };
    case 'empty-neutral':
      return {
        variant: 'default',
        Icon: IconInfoSquareRounded,
      };
  }
};

export const styles = StyleSheet.create({
  container: {
    alignItems: 'center',
    gap: SPACING.x2,
  },
  footer: {
    flexDirection: 'row',
    gap: SPACING.x2,
  },
});
