import {
  useEffect,
  useState,
  useMemo,
} from 'react'

import map from 'lodash/map'

import {
  LOGOS_URLS,
  FAV_SPORT_URLS,
} from 'config'
import {
  SPORT_TYPES,
  DATA_TYPES,
} from 'helpers'
import {
  modifyUserSportFavs,
  ModifyUserSportFavsArgs,
  getUserSportFavs,
  UserSportFavItem,
} from 'requests'
import { useLexicsStore } from 'features/LexicsStore'

type TNames = 'name_eng' | 'name_rus'
type TShortNames = 'short_name_eng' | 'short_name_rus'
type TFirstNames = 'firstname_eng' | 'firstname_rus'
type TLastNames = 'lastname_eng' | 'firstname_rus'
type TNickNames = 'nickname_eng' | 'nickname_rus'

export type TMemoizedUserSportFavItem = {
  countryName?: string,
  firstname?: string,
  id: number,
  lastname?: string,
  name?: string,
  nickname?: string,
  shortName?: string,
  sport: number,
  teamName?: string,
  type: number,
}

type TMakeUrlArgs = {
  id: number,
  sport: number,
  type: number,
}

export const useUserSportFavs = () => {
  const { suffix } = useLexicsStore()
  const [userSportFavItems, setUserSportFavItems] = useState<Array<UserSportFavItem>>([])

  const nameField = `name_${suffix}` as TNames
  const shortNameField = `short_name_${suffix}` as TShortNames
  const firtsNameField = `firstname_${suffix}` as TFirstNames
  const lastNameField = `lastname_${suffix}` as TLastNames
  const nickNameField = `nickname_${suffix}` as TNickNames

  useEffect(() => {
    getUserSportFavs().then(setUserSportFavItems)
  }, [])

  const addRemoveSportFav = ({
    action,
    id,
    sport,
    type,
  }: ModifyUserSportFavsArgs) => {
    // при добавлении дубликата userSportFavItem back возвращает {}
    modifyUserSportFavs({
      action,
      id,
      sport,
      type,
    }).then((userSportFavs) => Array.isArray(userSportFavs) && setUserSportFavItems(userSportFavs))
  }

  const memoizedUserSportFavItems = useMemo(() => map(userSportFavItems, (item) => ({
    countryName: item.info.country?.[nameField],
    firstname: item.info[firtsNameField],
    id: item.id,
    lastname: item.info[lastNameField],
    name: item.info[nameField],
    nickname: item.info[nickNameField],
    shortName: item.info[shortNameField],
    sport: item.sport,
    teamName: item.info.team?.[nameField],
    type: item.type,
  })),
  [
    firtsNameField,
    lastNameField,
    userSportFavItems,
    nameField,
    nickNameField,
    shortNameField,
  ])

  return {
    addRemoveSportFav,
    userSportFavItems: memoizedUserSportFavItems,
  }
}

export const makePicUrl = (arg: TMakeUrlArgs) => (
  // @ts-expect-error
  `${LOGOS_URLS[SPORT_TYPES[arg.sport]][DATA_TYPES[arg.type]]}/${arg.id}.png`
)

export const makeProfileUrl = (arg: TMakeUrlArgs) => (
  // @ts-expect-error
  `${FAV_SPORT_URLS[SPORT_TYPES[arg.sport]][DATA_TYPES[arg.type]]}/${arg.id}`
)

export const userSportFavs = (
  userSportFavItems: Array<TMemoizedUserSportFavItem>,
) => userSportFavItems?.length > 0 && map(
  userSportFavItems, (fav) => ({
    ...fav,
    pic_url: makePicUrl({
      id: fav.id,
      sport: fav.sport,
      type: fav.type,
    }),
    profile_url: makeProfileUrl({
      id: fav.id,
      sport: fav.sport,
      type: fav.type,
    }),
  }),
)