From 7b417df0c277627c27df9e5c1232b5aab7d1dfee Mon Sep 17 00:00:00 2001 From: Rakov Roman Date: Tue, 8 Nov 2022 10:53:03 +0300 Subject: [PATCH] fix(#3080): aws server for web logos --- src/config/profileTypes.tsx | 2 + src/features/Common/Image/index.tsx | 3 - .../components/HeaderFilters/index.tsx | 2 + .../CardFrontside/MatchCardMobile/index.tsx | 2 + .../MatchCard/CardFrontside/index.tsx | 2 + src/features/ProfileLink/index.tsx | 15 +++- src/features/ProfileLogo/index.tsx | 88 +++++++++++++++---- .../components/CollapseTournament/index.tsx | 8 +- src/features/UserFavorites/hooks/index.tsx | 2 +- src/features/UserFavorites/index.tsx | 1 - src/helpers/getProfileFallbackLogo/index.tsx | 1 + .../getProfileLogo/__tests__/index.tsx | 6 +- src/helpers/getProfileLogo/index.tsx | 26 ++---- src/requests/getMatches/getPlayerMatches.tsx | 27 +++--- src/requests/getMatches/getTeamMatches.tsx | 23 ++--- .../getMatches/getTournamentMatches.tsx | 23 ++--- src/requests/getMatches/types.tsx | 12 +++ src/requests/getProfileColor.tsx | 1 + src/requests/search.tsx | 1 + 19 files changed, 166 insertions(+), 79 deletions(-) diff --git a/src/config/profileTypes.tsx b/src/config/profileTypes.tsx index 629038a3..bca73afc 100644 --- a/src/config/profileTypes.tsx +++ b/src/config/profileTypes.tsx @@ -3,6 +3,7 @@ export enum ProfileTypes { TEAMS = 2, PLAYERS = 3, MATCHES = 4, + SUPERTOURNAMENTS = 5 } export const PROFILE_NAMES = { @@ -10,4 +11,5 @@ export const PROFILE_NAMES = { [ProfileTypes.TEAMS]: 'teams', [ProfileTypes.PLAYERS]: 'players', [ProfileTypes.MATCHES]: 'matches', + [ProfileTypes.SUPERTOURNAMENTS]: 'supertournaments', } as const diff --git a/src/features/Common/Image/index.tsx b/src/features/Common/Image/index.tsx index 68390aa9..310aa9a4 100644 --- a/src/features/Common/Image/index.tsx +++ b/src/features/Common/Image/index.tsx @@ -8,7 +8,6 @@ const ImageStyled = styled.img`` type Props = { alt?: string, className?: string, - dataSrc?: string, fallbackSrc?: string, onLoad?: () => void, src: string, @@ -18,7 +17,6 @@ type Props = { export const Image = ({ alt, className, - dataSrc, fallbackSrc = '', onLoad, src, @@ -35,7 +33,6 @@ export const Image = ({ { onClick={() => handleClickBack()} /> ) => void, profileType: ProfileTypes, @@ -15,9 +18,16 @@ type Props = { target?: string, } +const ScLink = styled(Link)<{disabled?: boolean}>` + ${({ disabled }) => disabled && css` + pointer-events: none; + `} +` + export const ProfileLink = ({ children, className, + disabled, id, onClick, profileType, @@ -30,13 +40,14 @@ export const ProfileLink = ({ sportType, }) return ( - {children} - + ) } diff --git a/src/features/ProfileLogo/index.tsx b/src/features/ProfileLogo/index.tsx index c3e8dfd7..05eb3175 100644 --- a/src/features/ProfileLogo/index.tsx +++ b/src/features/ProfileLogo/index.tsx @@ -1,5 +1,16 @@ +import { + Fragment, + useEffect, + useState, +} from 'react' + import { ProfileTypes, SportTypes } from 'config' -import { getProfileFallbackLogo, getProfileLogo } from 'helpers' + +import { + getProfileFallbackLogo, + getProfileLogo, + readToken, +} from 'helpers' import { Image } from 'features/Common' import type { ObjectWithName } from 'features/Name' @@ -10,8 +21,7 @@ type ProfileImageProps = { altNameObj?: ObjectWithName, className?: string, id: number, - isTournamentSuper?: boolean, - lazy?: boolean, + logoUrl?: string | null, nameAsTitle?: boolean, onLoad?: () => void, prefix?: string, @@ -21,13 +31,19 @@ type ProfileImageProps = { title?: string, } +type AwsMediaFlags = { + cover_url: 'string' | null, + landing_mobile_url: 'string' | null, + landing_url: 'string' | null, + logo_url: 'string' | null, +} + export const ProfileLogo = ({ alt, altNameObj, className, id, - isTournamentSuper, - lazy = false, + logoUrl, nameAsTitle, onLoad, prefix, @@ -36,26 +52,66 @@ export const ProfileLogo = ({ sportType, title, }: ProfileImageProps) => { + const [imageSource, setImageSource] = useState('') + const altName = useName(altNameObj || {}, prefix) const titleText = nameAsTitle ? altName : title - const src = getProfileLogo({ + const awsSrc = getProfileLogo({ + awsInError: false, + id, + profileType, + size, + sportType, + }) + const scoutSrc = getProfileLogo({ + awsInError: true, id, - isTournamentSuper, profileType, size, sportType, }) const fallbackSrc = getProfileFallbackLogo(profileType) + useEffect(() => { + (async () => { + if (!logoUrl) { + setImageSource(scoutSrc) + return + } + + if (logoUrl) { + setImageSource(logoUrl) + return + } + + try { + const { logo_url }: AwsMediaFlags = await (await fetch(awsSrc, { + headers: { Authorization: `Bearer ${readToken()}` }, + })).json() + + if (logo_url) { + setImageSource(logo_url) + return + } + setImageSource(scoutSrc) + } catch (error) { + setImageSource(scoutSrc) + } + })() + }, [awsSrc, logoUrl, scoutSrc]) + return ( - {alt + + {Boolean(imageSource) && ( + {alt + )} + ) } diff --git a/src/features/TournamentList/components/CollapseTournament/index.tsx b/src/features/TournamentList/components/CollapseTournament/index.tsx index d6b8d406..0b5abc1a 100644 --- a/src/features/TournamentList/components/CollapseTournament/index.tsx +++ b/src/features/TournamentList/components/CollapseTournament/index.tsx @@ -59,11 +59,15 @@ export const CollapseTournament = ({ {live && ( diff --git a/src/features/UserFavorites/hooks/index.tsx b/src/features/UserFavorites/hooks/index.tsx index 6e95f0fd..f276ef4d 100644 --- a/src/features/UserFavorites/hooks/index.tsx +++ b/src/features/UserFavorites/hooks/index.tsx @@ -63,7 +63,7 @@ export const useUserFavorites = () => { acc.push({ ...item.info.super_tournament, sport: item.sport, - type: item.type, + type: ProfileTypes.SUPERTOURNAMENTS, }) } return acc diff --git a/src/features/UserFavorites/index.tsx b/src/features/UserFavorites/index.tsx index f8dd62c6..4d7d4259 100644 --- a/src/features/UserFavorites/index.tsx +++ b/src/features/UserFavorites/index.tsx @@ -73,7 +73,6 @@ export const UserFavorites = ({ marginTop }: Props) => { /> { diff --git a/src/helpers/getProfileLogo/__tests__/index.tsx b/src/helpers/getProfileLogo/__tests__/index.tsx index fb5ed965..c08f2ee4 100644 --- a/src/helpers/getProfileLogo/__tests__/index.tsx +++ b/src/helpers/getProfileLogo/__tests__/index.tsx @@ -8,18 +8,18 @@ describe('getLogo helper', () => { id: 1, profileType: ProfileTypes.PLAYERS, sportType: SportTypes.FOOTBALL, - })).toBe('https://instatscout.com/images/players/180/1.png') + })).toBe('https://api.test.insports.tv/v1/players/1/1/media') expect(getProfileLogo({ id: 1, profileType: ProfileTypes.TEAMS, sportType: SportTypes.BASKETBALL, - })).toBe('https://basketball.instatscout.com/images/teams/180/1.png') + })).toBe('https://api.test.insports.tv/v1/teams/3/1/media') expect(getProfileLogo({ id: 1, profileType: ProfileTypes.TOURNAMENTS, sportType: SportTypes.HOCKEY, - })).toBe('https://hockey.instatscout.com/images/tournaments/180/1.png') + })).toBe('https://api.test.insports.tv/v1/tournaments/2/1/media') }) }) diff --git a/src/helpers/getProfileLogo/index.tsx b/src/helpers/getProfileLogo/index.tsx index fdcbee17..746c53df 100644 --- a/src/helpers/getProfileLogo/index.tsx +++ b/src/helpers/getProfileLogo/index.tsx @@ -2,13 +2,12 @@ import { SportTypes, ProfileTypes, PROFILE_NAMES, + API_ROOT, } from 'config' -import { readToken, readSelectedApi } from 'helpers' - const IMAGES_URLS = { [SportTypes.BASKETBALL]: 'https://basketball.instatscout.com/images', - [SportTypes.BOXING]: '', + [SportTypes.BOXING]: 'https://boxing.instatscout.com/images', [SportTypes.FOOTBALL]: 'https://instatscout.com/images', [SportTypes.HOCKEY]: 'https://hockey.instatscout.com/images', [SportTypes.HANDBALL]: 'https://handball.instatscout.com/images', @@ -16,34 +15,23 @@ const IMAGES_URLS = { [SportTypes.VOLLEYBALL]: 'https://volleyball.instatscout.com/images', } -enum MediaType { - cover = 'cover', - landing = 'landing', - landing_mobile = 'landing_mobile', - logo = 'logo' -} - type GetLogoArgs = { + awsInError?: boolean, id: number, - isTournamentSuper?: boolean, profileType: ProfileTypes, size?: number, sportType: SportTypes, } export const getProfileLogo = ({ + awsInError, id, - isTournamentSuper, profileType, size = 180, sportType, }: GetLogoArgs) => { - switch (true) { - case isTournamentSuper: - return `https://cf-aws${readSelectedApi() === 'staging' ? '-staging' : ''}.insports.tv/media/supertournaments/${sportType}/${id}/${MediaType.logo}.jpg?access_token=${readToken()}` - case sportType === SportTypes.BOXING: - return `https://images.insports.tv/${sportType}/${PROFILE_NAMES[profileType]}/${id}.png` - default: - return `${IMAGES_URLS[sportType]}/${PROFILE_NAMES[profileType]}/${size}/${id}.png` + if (awsInError) { + return `${IMAGES_URLS[sportType]}/${PROFILE_NAMES[profileType]}/${size}/${id}.png` } + return `${API_ROOT}/v1/${PROFILE_NAMES[profileType]}/${sportType}/${id}/media` } diff --git a/src/requests/getMatches/getPlayerMatches.tsx b/src/requests/getMatches/getPlayerMatches.tsx index b0ad4fe1..5209179b 100644 --- a/src/requests/getMatches/getPlayerMatches.tsx +++ b/src/requests/getMatches/getPlayerMatches.tsx @@ -1,4 +1,8 @@ -import { PROCEDURES, SportTypes } from 'config' +import { + API_ROOT, + PROCEDURES, + SportTypes, +} from 'config' import { client } from 'config/clients' @@ -27,22 +31,21 @@ export const getPlayerMatches = async ({ sportType, sub_only, }: Args): Promise => { + const url = `${API_ROOT}/v1/data/get-player-matches` + const config = { body: { - params: { - _p_limit: limit, - _p_match_completed: p_match_completed, - _p_offset: offset, - _p_player_id: playerId, - _p_sport: sportType, - _p_sub_only: sub_only, - ...client.requests?.[proc], - }, - proc, + limit, + match_completed: p_match_completed, + offset, + player_id: playerId, + sport: sportType, + sub_only, + ...client.requests?.[proc], }, } - return requestMatches(config) + return requestMatches(config, url) .then((matches) => addSportType(matches, sportType)) .then(getMatchesPreviews) } diff --git a/src/requests/getMatches/getTeamMatches.tsx b/src/requests/getMatches/getTeamMatches.tsx index 67b6e9cb..f199b430 100644 --- a/src/requests/getMatches/getTeamMatches.tsx +++ b/src/requests/getMatches/getTeamMatches.tsx @@ -1,4 +1,8 @@ -import { PROCEDURES, SportTypes } from 'config' +import { + API_ROOT, + PROCEDURES, + SportTypes, +} from 'config' import { client } from 'config/clients' @@ -23,20 +27,19 @@ export const getTeamMatches = async ({ sportType, teamId, }: Args): Promise => { + const url = `${API_ROOT}/v1/data/get-team-matches` + const config = { body: { - params: { - _p_limit: limit, - _p_offset: offset, - _p_sport: sportType, - _p_team_id: teamId, - ...client.requests?.[proc], - }, - proc, + limit, + offset, + sport: sportType, + team_id: teamId, + ...client.requests?.[proc], }, } - return requestMatches(config) + return requestMatches(config, url) .then((matches) => addSportType(matches, sportType)) .then(getMatchesPreviews) } diff --git a/src/requests/getMatches/getTournamentMatches.tsx b/src/requests/getMatches/getTournamentMatches.tsx index 789870eb..f5ab8770 100644 --- a/src/requests/getMatches/getTournamentMatches.tsx +++ b/src/requests/getMatches/getTournamentMatches.tsx @@ -1,4 +1,8 @@ -import { PROCEDURES, SportTypes } from 'config' +import { + API_ROOT, + PROCEDURES, + SportTypes, +} from 'config' import { client } from 'config/clients' @@ -23,20 +27,19 @@ export const getTournamentMatches = async ({ sportType, tournamentId, }: Args): Promise => { + const url = `${API_ROOT}/v1/data/get-tournament-matches` + const config = { body: { - params: { - _p_limit: limit, - _p_offset: offset, - _p_sport: sportType, - _p_tournament_id: tournamentId, - ...client.requests?.[proc], - }, - proc, + limit, + offset, + sport: sportType, + tournament_id: tournamentId, + ...client.requests?.[proc], }, } - return requestMatches(config) + return requestMatches(config, url) .then((matches) => addSportType(matches, sportType)) .then(getMatchesPreviews) } diff --git a/src/requests/getMatches/types.tsx b/src/requests/getMatches/types.tsx index 15e8e9ce..4bf9265e 100644 --- a/src/requests/getMatches/types.tsx +++ b/src/requests/getMatches/types.tsx @@ -1,8 +1,19 @@ import { SportTypes } from 'config' +type AwsTeamMedia = { + cover_url: string | null, + logo_url: string | null, +} + +type AwsTournamentMedia = AwsTeamMedia & { + landing_mobile_url: string | null, + landing_url: string | null, +} + export type TournamentType = { id: number, is_super_tournament?: boolean, + media?: AwsTournamentMedia, name_eng: string, name_rus: string, sportType: SportTypes, @@ -10,6 +21,7 @@ export type TournamentType = { type Team = { id: number, + media?: AwsTeamMedia, name_eng: string, name_rus: string, score?: number | null, diff --git a/src/requests/getProfileColor.tsx b/src/requests/getProfileColor.tsx index 2661b610..a92792e2 100644 --- a/src/requests/getProfileColor.tsx +++ b/src/requests/getProfileColor.tsx @@ -10,6 +10,7 @@ const profiles = { [ProfileTypes.TOURNAMENTS]: 'tournament', [ProfileTypes.PLAYERS]: 'team', [ProfileTypes.MATCHES]: '', + [ProfileTypes.SUPERTOURNAMENTS]: '', } type Response = { diff --git a/src/requests/search.tsx b/src/requests/search.tsx index da57396b..5460b7a1 100644 --- a/src/requests/search.tsx +++ b/src/requests/search.tsx @@ -46,6 +46,7 @@ const filterResults = ({ const filteredResults = { players: filter(results.players, filterFunc), + supertournaments: '', teams: filter(results.teams, filterFunc), tournaments: filter(results.tournaments, filterFunc), }