fix(#402): fix tolltip for matchcard and filter same tournaments to id and sporttype

pull/106/head
Andrei Dekterev 3 years ago
parent 633e729cce
commit 7b3e3b521d
  1. 2
      src/features/MatchCard/styled.tsx
  2. 3
      src/features/MatchesGrid/index.tsx
  3. 2
      src/features/TournamentList/components/CollapseTournament/index.tsx
  4. 28
      src/features/TournamentList/hooks.tsx
  5. 18
      src/features/TournamentList/index.tsx

@ -188,7 +188,7 @@ export const Info = styled.div<CardProps>`
flex-direction: column; flex-direction: column;
padding: ${({ isMatchPage }) => (isMatchPage ? '0 5px 5px 0' : '0.85rem 0.472rem 0 0.519rem')}; padding: ${({ isMatchPage }) => (isMatchPage ? '0 5px 5px 0' : '0.85rem 0.472rem 0 0.519rem')};
color: #fff; color: #fff;
z-index: 1; z-index: 2;
${isMobileDevice ${isMobileDevice
? css` ? css`

@ -44,7 +44,7 @@ export const MatchesGrid = memo(({ matches }: MatchesGridProps) => {
) )
} }
if (isHomePage && selectedLeague.length && !isShowTournament) { if (isHomePage && selectedLeague.length && !isShowTournament) {
return matches.filter((match) => ((selectedLeague.indexOf(match.tournament.id) >= 0 return matches.filter((match) => ((selectedLeague.indexOf(`${match.sportType}_${match.tournament.id}`) >= 0
|| selectedLeague[0] === 'all_competitions'))) || selectedLeague[0] === 'all_competitions')))
} }
@ -73,6 +73,7 @@ export const MatchesGrid = memo(({ matches }: MatchesGridProps) => {
updateSportIds(matches) updateSportIds(matches)
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [selectedDate, matches]) }, [selectedDate, matches])
return ( return (
<Wrapper> <Wrapper>
{isHomePage && isShowTournament ? ( {isHomePage && isShowTournament ? (

@ -46,7 +46,7 @@ export const CollapseTournament = ({
const handleClick = () => { const handleClick = () => {
setIsShowTournament(false) setIsShowTournament(false)
setSelectedLeague([tournament.id]) setSelectedLeague([`${tournament.sportType}_${tournament.id}`])
setSelectTournament(tournament) setSelectTournament(tournament)
} }

@ -2,7 +2,7 @@ import { useMemo } from 'react'
import orderBy from 'lodash/orderBy' import orderBy from 'lodash/orderBy'
import { ProfileTypes } from 'config' import { ProfileTypes, SportTypes } from 'config'
import { TournamentListProps } from 'features/TournamentList' import { TournamentListProps } from 'features/TournamentList'
import type { Match } from 'features/Matches' import type { Match } from 'features/Matches'
import { useHeaderFiltersStore } from 'features/HeaderFilters' import { useHeaderFiltersStore } from 'features/HeaderFilters'
@ -13,6 +13,7 @@ interface TournamentsSortProps {
isFavorite: boolean, isFavorite: boolean,
isLive: boolean, isLive: boolean,
isSuperTournament: boolean, isSuperTournament: boolean,
sportType: SportTypes,
} }
export const useTournaments = (matches: Array<Match>) => { export const useTournaments = (matches: Array<Match>) => {
@ -23,7 +24,7 @@ export const useTournaments = (matches: Array<Match>) => {
} = useHeaderFiltersStore() } = useHeaderFiltersStore()
const { isInFavorites } = useUserFavoritesStore() const { isInFavorites } = useUserFavoritesStore()
const compareLeague = (id: number) => { const compareLeague = (id: number| string) => {
if (selectedLeague[0] === 'all_competitions') { if (selectedLeague[0] === 'all_competitions') {
return true return true
} }
@ -36,14 +37,16 @@ export const useTournaments = (matches: Array<Match>) => {
const tournaments = matches.reduce((acc: TournamentListProps, match: Match) => { const tournaments = matches.reduce((acc: TournamentListProps, match: Match) => {
if (matches.length === 0) return {} if (matches.length === 0) return {}
const uniqTournamentId = `${match.sportType}_${match.tournament.id}`
const tournamentInFavorites = isInFavorites( const tournamentInFavorites = isInFavorites(
ProfileTypes.TOURNAMENTS, ProfileTypes.TOURNAMENTS,
// в избранном могут быть только обычные турниры // в избранном могут быть только обычные турниры
match.tournament.is_super_tournament ? match.group.id : match.tournament.id, match.tournament.is_super_tournament ? match.group.id : match.tournament.id,
) )
if (!acc[match.tournament.id] && compareSport(match, selectedSport) if (!acc[`${match.sportType}_${match.tournament.id}`] && compareSport(match, selectedSport)
&& compareLeague(match.tournament.id)) { && compareLeague(uniqTournamentId)) {
const tournament = { const tournament = {
...match.tournament, ...match.tournament,
countryId: match.countryId, countryId: match.countryId,
@ -52,7 +55,7 @@ export const useTournaments = (matches: Array<Match>) => {
matches: [match], matches: [match],
sportType: match.sportType, sportType: match.sportType,
} }
acc[match.tournament.id] = { acc[uniqTournamentId] = {
tournament: { tournament: {
...tournament, ...tournament,
}, },
@ -63,17 +66,18 @@ export const useTournaments = (matches: Array<Match>) => {
isFavorite: tournamentInFavorites, isFavorite: tournamentInFavorites,
isLive: match.live, isLive: match.live,
isSuperTournament: Boolean(match.tournament.is_super_tournament), isSuperTournament: Boolean(match.tournament.is_super_tournament),
sportType: match.sportType,
}) })
} else if (compareSport(match, selectedSport) && compareLeague(match.tournament.id)) { } else if (compareSport(match, selectedSport) && compareLeague(uniqTournamentId)) {
acc[match.tournament.id] = { acc[uniqTournamentId] = {
...acc[match.tournament.id], ...acc[uniqTournamentId],
tournament: { tournament: {
...acc[match.tournament.id].tournament, ...acc[uniqTournamentId].tournament,
live: acc[match.tournament.id]?.tournament.live live: acc[uniqTournamentId]?.tournament.live
? acc[match.tournament.id]?.tournament.live ? acc[uniqTournamentId]?.tournament.live
: match.live, : match.live,
}, },
tournamentMatches: [...acc[match.tournament.id].tournamentMatches, match], tournamentMatches: [...acc[uniqTournamentId].tournamentMatches, match],
} }
} }
return acc return acc

@ -27,7 +27,7 @@ export type TournamentProps = {
} }
export type TournamentListProps = { export type TournamentListProps = {
[key: number]: TournamentProps, [key: string]: TournamentProps,
} }
export const TournamentList = ({ matches }: TournamentTypeProps) => { export const TournamentList = ({ matches }: TournamentTypeProps) => {
@ -38,11 +38,11 @@ export const TournamentList = ({ matches }: TournamentTypeProps) => {
case isMobileDevice && isHomePage: case isMobileDevice && isHomePage:
return ( return (
<> <>
{tournamentSort?.map(({ id }) => ( {tournamentSort?.map(({ id, sportType }) => (
<TournamentMobile <TournamentMobile
key={id} key={`${sportType}_${id}`}
tournament={tournaments[id].tournament} tournament={tournaments[`${sportType}_${id}`].tournament}
tournamentMatches={tournaments[id].tournamentMatches} tournamentMatches={tournaments[`${sportType}_${id}`].tournamentMatches}
/> />
))} ))}
</> </>
@ -50,11 +50,11 @@ export const TournamentList = ({ matches }: TournamentTypeProps) => {
case isHomePage && matches.length >= 12: case isHomePage && matches.length >= 12:
return ( return (
<> <>
{tournamentSort?.map(({ id }) => ( {tournamentSort?.map(({ id, sportType }) => (
<CollapseTournament <CollapseTournament
key={id} key={`${sportType}_${id}`}
tournament={tournaments[id].tournament} tournament={tournaments[`${sportType}_${id}`].tournament}
tournamentMatches={tournaments[id].tournamentMatches} tournamentMatches={tournaments[`${sportType}_${id}`].tournamentMatches}
/> />
))} ))}
</> </>

Loading…
Cancel
Save