/* eslint-disable  @typescript-eslint/no-explicit-any */
import {
  ProfileTypes,
  PROFILE_NAMES,
  SportTypes,
  URL_AWS,
} from 'config'

import {
  ScWrapper,
  ScLogo,
  ScName,
} from './styled'

type ItemInfoType = {
  active?: boolean,
  id: number,
  name: string,
  onClick: (val: any) => void,
  sportId: SportTypes,
  type: ProfileTypes,
}
export const ItemInfo = ({
  active,
  id,
  name,
  onClick,
  sportId,
  type,
}: ItemInfoType) => (
  <ScWrapper onClick={onClick}>
    <ScLogo src={`${URL_AWS}media/${PROFILE_NAMES[type]}/${SportTypes[sportId]}/${id}/logo.jpg`} />
    <ScName active={active}>{name}</ScName>
  </ScWrapper>
)
