import React, {FC} from 'react';
import {icons} from './Icons';
import SearchIcon from '../../assets/search.svg';
import BackIcon from '../../assets/back.svg';
import MicrophoneIcon from '../../assets/microphone.svg';
import LeftArrow from '../../assets/leftArrow.svg';
import RightArrow from '../../assets/rightArrow.svg';
import {useTheme} from '../../theme/ThemeContext';
import Online from '../../assets/online.svg';
import DownArrow from '../../assets/downArrow.svg';
import Checkmark from '../../assets/checkmark.svg';
import Info from '../../assets/info.svg';
import Symbol from '../../assets/symbol.svg';
import Notification from '../../assets/notification.svg';
import Chat from '../../assets/chat.svg';
import Menu from '../../assets/menu.svg';
import Snapshot from '../../assets/snapshot.svg';
import SelectIcon from '../../assets/SelectIcon.svg';
import Auto from '../../assets/auto.svg';
import InActiveAuto from '../../assets/inActiveAuto.svg';
import Brightness from '../../assets/brightness.svg';
import InActiveBrightness from '../../assets/inActiveBrightness.svg';
import Contrast from '../../assets/contrast.svg';
import InActiveContrast from '../../assets/inActiveContrast.svg';
import Warmth from '../../assets/warmth.svg';
import InActiveWarmth from '../../assets/inActiveWarmth.svg';
import Saturation from '../../assets/saturation.svg';
import InActiveSaturation from '../../assets/inActiveSaturation.svg';
import Highlight from '../../assets/highlight.svg';
import InActiveHighlight from '../../assets/inActiveHighlight.svg';
import Shadows from '../../assets/shadow.svg';
import InActiveShadows from '../../assets/inActiveShadow.svg';
import Sharpen from '../../assets/sharpness.svg';
import InActiveSharpen from '../../assets/inActiveSharpness.svg';
import Remove from '../../assets/remove.svg';
import Add from '../../assets/add.svg';
import Filter from '../../assets/filter.svg';
import EditFilter from '../../assets/editFilter.svg';
import Vignette from '../../assets/vignette.svg';
import InActiveVignette from '../../assets/inActiveVignette.svg';
import BlackPoint from '../../assets/blackpoint.svg';
import InActiveBlackpoint from '../../assets/inActiveBlackpoint.svg';
import Tint from '../../assets/tint.svg';
import InActiveTint from '../../assets/inActiveTint.svg';
import Denoise from '../../assets/denoise.svg';
import InActiveDenoise from '../../assets/inActiveDenoise.svg';
import Unselected from '../../assets/unselected.svg';
import Selected from '../../assets/selected.svg';
interface IconProps {
  name: string;
  size?: number;
  width?: number;
  height?: number;
  color?: string;
}

const IconComponent: FC<IconProps> = props => {
  const {name, size, width, height, color} = props;
  const {colors} = useTheme();

  const iconProps = {
    width: width || size || 24,
    height: height || size || 24,
    color: color || colors.labels_primary,
  };

  switch (name) {
    case icons.search:
      return <SearchIcon {...iconProps} />;
    case icons.back:
      return <BackIcon {...iconProps} />;
    case icons.microphone:
      return <MicrophoneIcon {...iconProps} />;
    case icons.leftArrow:
      return <LeftArrow {...iconProps} />;
    case icons.rightArrow:
      return <RightArrow {...iconProps} />;
    case icons.online:
      return <Online {...iconProps} />;
    case icons.downArrow:
      return <DownArrow {...iconProps} />;
    case icons.showCheckmark:
      return <Checkmark {...iconProps} />;
    case icons.info:
      return <Info {...iconProps} />;
    case icons.symbol:
      return <Symbol {...iconProps} />;
    case icons.notification:
      return <Notification {...iconProps} />;
    case icons.chat:
      return <Chat {...iconProps} />;
    case icons.menu:
      return <Menu {...iconProps} />;
    case icons.snapshot:
      return <Snapshot {...iconProps} />;
    case icons.selectIcon:
      return <SelectIcon {...iconProps} />;
    case icons.auto:
      return <Auto />;
    case icons.inActiveAuto:
      return <InActiveAuto />;
    case icons.brightness:
      return <Brightness />;
    case icons.inActiveBrightness:
      return <InActiveBrightness />;
    case icons.contrast:
      return <Contrast />;
    case icons.inActiveContrast:
      return <InActiveContrast />;
    case icons.warmth:
      return <Warmth />;
    case icons.inActiveWarmth:
      return <InActiveWarmth />;
    case icons.saturation:
      return <Saturation />;
    case icons.inActiveSaturation:
      return <InActiveSaturation />;
    case icons.highlight:
      return <Highlight />;
    case icons.inActiveHighlight:
      return <InActiveHighlight />;
    case icons.shadows:
      return <Shadows />;
    case icons.inActiveShadows:
      return <InActiveShadows />;
    case icons.vignette:
      return <Vignette />;
    case icons.inActiveVignette:
      return <InActiveVignette />;
    case icons.blackpoint:
      return <BlackPoint />;
    case icons.inActiveBlackpoint:
      return <InActiveBlackpoint />;
    case icons.tint:
      return <Tint />;
    case icons.inActiveTint:
      return <InActiveTint />;
    case icons.sharpeness:
      return <Sharpen />;
    case icons.inActiveSharpeness:
      return <InActiveSharpen />;
    case icons.denoise:
      return <Denoise />;
    case icons.inActiveDenoise:
      return <InActiveDenoise />;
    case icons.unselected:
      return <Unselected />;
    case icons.selected:
      return <Selected />;
    case icons.remove:
      return <Remove {...iconProps} />;
    case icons.add:
      return <Add {...iconProps} />;
    case icons.filter:
      return <Filter {...iconProps} />;
    case icons.editFilter:
      return <EditFilter {...iconProps} />;
    default:
      return null;
  }
};

export default IconComponent;