import React from 'react';
import type { AccessibilityProps, StyleProp, TextStyle } from 'react-native';
import IconList from './IconList';
import HeroIcon from './HeroIcon';
import AnimatedIcon from './AnimatedIcon';
import GradientIcon from './GradientIcon';
import SpinWrapper from './SpinWrapper';
import { useDeprecation } from '../../utils/hooks';

export type IconName = typeof IconList[number];

export interface IconProps extends AccessibilityProps {
  /**
   * Name of the Icon.
   *
   * icon['carat-*'] - @deprecated Icons starting with 'carat' are deprecated and will be removed in the next major release, please use 'caret' instead.
   */
  icon: IconName;
  /**
   * Intent of the Icon.
   */
  intent?:
    | 'text'
    | 'primary'
    | 'secondary'
    | 'info'
    | 'danger'
    | 'success'
    | 'warning'
    | 'disabled-text'
    | 'text-inverted'
    | 'muted'
    | 'inactive'
    | 'ai';
  /**
   * Size of the Icon.
   */
  size?: 'xxxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
  /**
   * Rotate icon with animation.
   */
  spin?: boolean;
  /**
   * Additional style.
   */
  style?: StyleProp<TextStyle>;
  /**
   * Testing id of the component.
   */
  testID?: string;
}

const Icon = ({
  icon,
  style,
  size = 'medium',
  intent = 'text',
  testID,
  spin = false,
  accessibilityLabel,
  accessibilityHint,
  accessibilityRole,
  accessibilityState,
  accessibilityValue,
  accessibilityLiveRegion,
  accessibilityElementsHidden,
  accessible,
  accessibilityIgnoresInvertColors,
  accessibilityViewIsModal,
  accessibilityActions,
}: IconProps) => {
  useDeprecation(
    `${icon} icon is deprecated and will be removed in the next major release, please use ${icon.replace(
      'carat',
      'caret'
    )} instead.`,
    icon.startsWith('carat')
  );
  const accessibilityProps = {
    accessibilityLabel,
    accessibilityHint,
    accessibilityRole,
    accessibilityState,
    accessibilityValue,
    accessibilityLiveRegion,
    accessibilityElementsHidden,
    accessible,
    accessibilityIgnoresInvertColors,
    accessibilityViewIsModal,
    accessibilityActions,
  };

  if (intent === 'ai') {
    const gradientIcon = (
      <GradientIcon
        name={icon}
        themeSize={size}
        testID={testID}
        style={spin ? undefined : style}
        {...accessibilityProps}
      />
    );

    if (spin) {
      return <SpinWrapper style={style}>{gradientIcon}</SpinWrapper>;
    }

    return gradientIcon;
  }

  return spin ? (
    <AnimatedIcon
      name={icon}
      themeIntent={intent}
      themeSize={size}
      style={style}
      testID={testID}
      {...accessibilityProps}
    />
  ) : (
    <HeroIcon
      name={icon}
      themeIntent={intent}
      themeSize={size}
      style={style}
      testID={testID}
      {...accessibilityProps}
    />
  );
};

Icon.List = IconList;
export default Icon;