You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
spa_instat_tv/src/features/UserSportFav/hooks/index.tsx

132 lines
3.1 KiB

import {
useEffect,
useState,
useMemo,
} from 'react'
import map from 'lodash/map'
import {
LOGOS_URLS,
FAV_SPORT_URLS,
} from 'config'
import {
SPORT_TYPES,
DATA_TYPES,
} from 'helpers'
import {
modifyUserSportFavs,
ModifyUserSportFavsArgs,
getUserSportFavs,
UserSportFavItem,
} from 'requests'
import { useLexicsStore } from 'features/LexicsStore'
type TNames = 'name_eng' | 'name_rus'
type TShortNames = 'short_name_eng' | 'short_name_rus'
type TFirstNames = 'firstname_eng' | 'firstname_rus'
type TLastNames = 'lastname_eng' | 'firstname_rus'
type TNickNames = 'nickname_eng' | 'nickname_rus'
export type TMemoizedUserSportFavItem = {
countryName?: string,
firstname?: string,
id: number,
lastname?: string,
name?: string,
nickname?: string,
shortName?: string,
sport: number,
teamName?: string,
type: number,
}
type TMakeUrlArgs = {
id: number,
sport: number,
type: number,
}
export const useUserSportFavs = () => {
const { suffix } = useLexicsStore()
const [userSportFavItems, setUserSportFavItems] = useState<Array<UserSportFavItem>>([])
const nameField = `name_${suffix}` as TNames
const shortNameField = `short_name_${suffix}` as TShortNames
const firtsNameField = `firstname_${suffix}` as TFirstNames
const lastNameField = `lastname_${suffix}` as TLastNames
const nickNameField = `nickname_${suffix}` as TNickNames
useEffect(() => {
getUserSportFavs().then(setUserSportFavItems)
}, [])
const addRemoveSportFav = ({
action,
id,
sport,
type,
}: ModifyUserSportFavsArgs) => {
// при добавлении дубликата userSportFavItem back возвращает {}
modifyUserSportFavs({
action,
id,
sport,
type,
}).then((userSportFavs) => Array.isArray(userSportFavs) && setUserSportFavItems(userSportFavs))
}
const memoizedUserSportFavItems = useMemo(() => map(userSportFavItems, (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],
shortName: item.info[shortNameField],
sport: item.sport,
teamName: item.info.team?.[nameField],
type: item.type,
})),
[
firtsNameField,
lastNameField,
userSportFavItems,
nameField,
nickNameField,
shortNameField,
])
return {
addRemoveSportFav,
userSportFavItems: memoizedUserSportFavItems,
}
}
export const makePicUrl = (arg: TMakeUrlArgs) => (
// @ts-expect-error
`${LOGOS_URLS[SPORT_TYPES[arg.sport]][DATA_TYPES[arg.type]]}/${arg.id}.png`
)
export const makeProfileUrl = (arg: TMakeUrlArgs) => (
// @ts-expect-error
`${FAV_SPORT_URLS[SPORT_TYPES[arg.sport]][DATA_TYPES[arg.type]]}/${arg.id}`
)
export const userSportFavs = (
userSportFavItems: Array<TMemoizedUserSportFavItem>,
) => userSportFavItems?.length > 0 && map(
userSportFavItems, (fav) => ({
...fav,
pic_url: makePicUrl({
id: fav.id,
sport: fav.sport,
type: fav.type,
}),
profile_url: makeProfileUrl({
id: fav.id,
sport: fav.sport,
type: fav.type,
}),
}),
)