import type { IconAliases, IconProps, IconSet } from 'vuetify'
import { h } from 'vue'
import { Icon } from '@iconify/vue'

const aliases: Partial<IconAliases> = {
  collapse: 'tabler-chevron-up',
  complete: 'tabler-check',
  cancel: 'tabler-x',
  close: 'tabler-x',
  delete: 'tabler-circle-x-filled',
  clear: 'tabler-circle-x',
  success: 'tabler-circle-check',
  info: 'tabler-info-circle',
  warning: 'tabler-alert-triangle',
  error: 'tabler-alert-circle',
  prev: 'tabler-chevron-left',
  next: 'tabler-chevron-right',
  expand: 'tabler-chevron-down',
  menu: 'tabler-menu-2',
  dropdown: 'tabler-chevron-down',
  sort: 'tabler-arrow-up',
  sortAsc: 'tabler-arrow-up',
  sortDesc: 'tabler-arrow-down',
  calendar: 'tabler-calendar',
  edit: 'tabler-pencil',
  ratingEmpty: 'tabler-star',
  ratingFull: 'tabler-star-filled',
  ratingHalf: 'tabler-star-half-filled',
  loading: 'tabler-refresh',
  first: 'tabler-chevrons-left',
  last: 'tabler-chevrons-right',
  unfold: 'tabler-arrows-vertical',
  file: 'tabler-paperclip',
  plus: 'tabler-plus',
  minus: 'tabler-minus',
}

const iconifyIconSet: IconSet = {
  component: (props: IconProps) => {
    return h(Icon as unknown as string, {
      icon: props.icon,
      ...props,
    })
  },
}

export const icons = {
  defaultSet: 'iconify',
  aliases,
  sets: {
    iconify: iconifyIconSet,
  },
}
