Ott 511 profile link and name components (#200)
* Ott 511 profile link and name components part 1 (#195) * refactor(#511): replaced profile links to ProfileLink component * test(#511): added tests to getProfileUrl helper * Ott 511 profile link and name components part 2 (#197) * feat(#511): added Name component for displaying names * refactor(#511): added using name as alt text in ProfileLogo * refactor(#511): used Name in UserFavorites * refactor(#511): used Name in header tournaments filter * refactor(#511): used Name in search result * fix(#515): pr fix * fix(#515): renamed prop name * Ott 511 profile link and name components part 3 (#199) * refactor(#511): replaced names to Name in MatchProfile * refactor(#511): replaced names in match cards to Name * refactor(#511): replaced names in ProfileCard * refactor(#511): pr fixkeep-around/af30b88d367751c9e05a735e4a0467a96238ef47
Mirlan
5 years ago
committed by
GitHub
parent
6e63d05404
commit
8245c56b0b
@ -1,26 +0,0 @@ |
||||
import map from 'lodash/map' |
||||
|
||||
import { Tournaments } from 'requests' |
||||
|
||||
import { ProfileTypes } from 'config' |
||||
|
||||
type Name = 'name_rus' | 'name_eng' |
||||
type ShortName = 'short_name_rus' | 'short_name_eng' |
||||
|
||||
export const normalizeTournaments = (tournaments: Tournaments, suffix: string) => ( |
||||
map(tournaments, (tournament) => { |
||||
const profileType = ProfileTypes.TOURNAMENTS |
||||
const { id, sport: sportType } = tournament |
||||
const name = tournament[`name_${suffix}` as Name] |
||||
const shortName = tournament[`short_name_${suffix}` as ShortName] || name |
||||
const country = tournament.country?.[`name_${suffix}` as Name] |
||||
return { |
||||
country, |
||||
id, |
||||
name, |
||||
profileType, |
||||
shortName, |
||||
sportType, |
||||
} |
||||
}) |
||||
) |
||||
@ -0,0 +1,36 @@ |
||||
import React from 'react' |
||||
|
||||
import styled from 'styled-components/macro' |
||||
|
||||
import { useLexicsStore } from 'features/LexicsStore' |
||||
|
||||
export type ObjectWithName = { |
||||
[key: string]: any, |
||||
name_eng?: string, |
||||
name_rus?: string, |
||||
} |
||||
|
||||
type Props = { |
||||
className?: string, |
||||
nameObj: ObjectWithName, |
||||
prefix?: string, |
||||
} |
||||
|
||||
const NameStyled = styled.span`` |
||||
|
||||
export const useName = ( |
||||
nameObj: ObjectWithName, |
||||
prefix: string = 'name_', |
||||
): string => { |
||||
const { suffix } = useLexicsStore() |
||||
return nameObj?.[`${prefix}${suffix}`] |
||||
} |
||||
|
||||
export const Name = ({ |
||||
className, |
||||
nameObj, |
||||
prefix, |
||||
}: Props) => { |
||||
const name = useName(nameObj, prefix) |
||||
return <NameStyled className={className}>{name}</NameStyled> |
||||
} |
||||
@ -1,7 +1,9 @@ |
||||
import { ProfileTypes } from 'config' |
||||
|
||||
import type { ObjectWithName } from 'features/Name' |
||||
|
||||
export type ProfileCardProps = { |
||||
infoItems: Array<string>, |
||||
name: string, |
||||
profileType: ProfileTypes, |
||||
titleObj: ObjectWithName | null, |
||||
} |
||||
|
||||
@ -0,0 +1,22 @@ |
||||
import { ProfileTypes, SportTypes } from 'config' |
||||
import { getProfileUrl } from '..' |
||||
|
||||
it('returns correct profile urls', () => { |
||||
expect(getProfileUrl({ |
||||
id: 1, |
||||
profileType: ProfileTypes.PLAYERS, |
||||
sportType: SportTypes.FOOTBALL, |
||||
})).toBe('/football/players/1') |
||||
|
||||
expect(getProfileUrl({ |
||||
id: 2, |
||||
profileType: ProfileTypes.TEAMS, |
||||
sportType: SportTypes.BASKETBALL, |
||||
})).toBe('/basketball/teams/2') |
||||
|
||||
expect(getProfileUrl({ |
||||
id: 3, |
||||
profileType: ProfileTypes.TOURNAMENTS, |
||||
sportType: SportTypes.HOCKEY, |
||||
})).toBe('/hockey/tournaments/3') |
||||
}) |
||||
@ -0,0 +1,43 @@ |
||||
import type { ReactNode, MouseEvent } from 'react' |
||||
import React from 'react' |
||||
import { Link } from 'react-router-dom' |
||||
|
||||
import { ProfileTypes, SportTypes } from 'config' |
||||
|
||||
import { getProfileUrl } from './helpers' |
||||
|
||||
type Props = { |
||||
children: ReactNode, |
||||
className?: string, |
||||
id: number, |
||||
onClick?: (e: MouseEvent<HTMLAnchorElement>) => void, |
||||
profileType: ProfileTypes, |
||||
sportType: SportTypes, |
||||
target?: string, |
||||
} |
||||
|
||||
export const ProfileLink = ({ |
||||
children, |
||||
className, |
||||
id, |
||||
onClick, |
||||
profileType, |
||||
sportType, |
||||
target, |
||||
}: Props) => { |
||||
const url = getProfileUrl({ |
||||
id, |
||||
profileType, |
||||
sportType, |
||||
}) |
||||
return ( |
||||
<Link |
||||
to={url} |
||||
className={className} |
||||
target={target} |
||||
onClick={onClick} |
||||
> |
||||
{children} |
||||
</Link> |
||||
) |
||||
} |
||||
@ -1,36 +0,0 @@ |
||||
import map from 'lodash/map' |
||||
|
||||
import { getProfileUrl } from 'helpers' |
||||
import type { UserFavorites } from 'requests' |
||||
|
||||
type Names = 'name_eng' | 'name_rus' |
||||
type ShortNames = 'short_name_eng' | 'short_name_rus' |
||||
type FirstNames = 'firstname_eng' | 'firstname_rus' |
||||
type LastNames = 'lastname_eng' | 'firstname_rus' |
||||
type NickNames = 'nickname_eng' | 'nickname_rus' |
||||
|
||||
export const normalizeUserFavorites = (favorites: UserFavorites, suffix: string) => { |
||||
const nameField = `name_${suffix}` as Names |
||||
const shortNameField = `short_name_${suffix}` as ShortNames |
||||
const firtsNameField = `firstname_${suffix}` as FirstNames |
||||
const lastNameField = `lastname_${suffix}` as LastNames |
||||
const nickNameField = `nickname_${suffix}` as NickNames |
||||
|
||||
return map(favorites, (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], |
||||
profileUrl: getProfileUrl({ |
||||
id: item.id, |
||||
profileType: item.type, |
||||
sportType: item.sport, |
||||
}), |
||||
shortName: item.info[shortNameField], |
||||
sport: item.sport, |
||||
teamName: item.info.team?.[nameField], |
||||
type: item.type, |
||||
})) |
||||
} |
||||
Loading…
Reference in new issue