spa_instat_tv/src/features/TournamentsPopup/index.tsx

import { T9n } from 'features/T9n'
import { ProfileTypes, SportTypes } from 'config'

import { Wrapper } from 'features/PreferencesPopup/styled'

import { Tournaments } from 'requests/getSportTournaments'

import {
  ScItem,
  ScBody,
  ScList,
  ScHeaderTitle,
  ScTournamentList,
  ScModalContainer,
  StyledLink,
} from './styled'

import { useTournamentPopupStore } from './store'

export const TournamentsPopup = () => {
  const { close, isOpen } = useTournamentPopupStore()

  const tournaments: Tournaments = [
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 227,
      name_eng: 'MOL Cup',
      name_rus: 'MOL CUP',
      short_name_eng: null,
      short_name_rus: null,
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 946,
      name_eng: 'ženskyfotbal',
      name_rus: 'ženskyfotbal',
      short_name_eng: null,
      short_name_rus: null,
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 3067,
      name_eng: 'Futsal',
      name_rus: 'Futsal',
      short_name_eng: null,
      short_name_rus: null,
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 5665,
      name_eng: 'FACR',
      name_rus: 'FACR',
      short_name_eng: null,
      short_name_rus: null,
      sport: 1,
      tournament_type: 1,
    },
  ]

  const teams: Tournaments = [
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 23,
      name_eng: 'Czech Republic',
      name_rus: 'Чехия',
      short_name_eng: 'Czech Republic',
      short_name_rus: 'Чехия',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 2719,
      name_eng: 'A ženy',
      name_rus: 'A ženy',
      short_name_eng: 'A ženy',
      short_name_rus: 'A ženy',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 528,
      name_eng: 'U21',
      name_rus: 'U21',
      short_name_eng: 'U21',
      short_name_rus: 'U21',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 17018,
      name_eng: 'U20',
      name_rus: 'U20',
      short_name_eng: 'U20',
      short_name_rus: 'U20',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 567,
      name_eng: 'U19',
      name_rus: 'U19',
      short_name_eng: 'U19',
      short_name_rus: 'U19',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 16306,
      name_eng: 'WU19',
      name_rus: 'WU19',
      short_name_eng: 'WU19',
      short_name_rus: 'WU19',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 1189,
      name_eng: 'U18',
      name_rus: 'U18',
      short_name_eng: 'U18',
      short_name_rus: 'U18',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 480,
      name_eng: 'U17',
      name_rus: 'U17',
      short_name_eng: 'U17',
      short_name_rus: 'U17',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 16920,
      name_eng: 'WU17',
      name_rus: 'WU17',
      short_name_eng: 'WU17',
      short_name_rus: 'WU17',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 6032,
      name_eng: 'U16',
      name_rus: 'U16',
      short_name_eng: 'U16',
      short_name_rus: 'U16',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 17624,
      name_eng: 'U15',
      name_rus: 'U15',
      short_name_eng: 'U15',
      short_name_rus: 'U15',
      sport: 1,
      tournament_type: 1,
    },
    {
      country: {
        id: 231,
        name_eng: 'Czech Republic',
        name_rus: 'Чешская Республика',
      },
      gender: null,
      id: 114440,
      name_eng: 'WU15',
      name_rus: 'WU15',
      short_name_eng: 'WU15',
      short_name_rus: 'WU15',
      sport: 1,
      tournament_type: 1,
    },
  ]

  return (
    <ScModalContainer isOpen={isOpen} close={close} withCloseButton>
      <Wrapper>
        <ScBody>
          <ScTournamentList>
            <ScHeaderTitle>
              <T9n t='my_tournaments' />
            </ScHeaderTitle>
            <ScList>
              {tournaments.map((tournament) => (
                <StyledLink
                  id={tournament.id}
                  profileType={ProfileTypes.TOURNAMENTS}
                  sportType={SportTypes.FOOTBALL}
                  onClick={close}
                >
                  <ScItem isIcon={false} tournament={tournament} />
                </StyledLink>
              ))}
            </ScList>
          </ScTournamentList>
          <ScTournamentList>
            <ScHeaderTitle>
              <T9n t='my_teams' />
            </ScHeaderTitle>
            <ScList>
              {teams.map((team) => (
                <StyledLink
                  id={team.id}
                  profileType={ProfileTypes.TEAMS}
                  sportType={SportTypes.FOOTBALL}
                  onClick={close}
                >
                  <ScItem isIcon={false} tournament={team} />
                </StyledLink>
              ))}
            </ScList>
          </ScTournamentList>
        </ScBody>
      </Wrapper>
    </ScModalContainer>
  )
}