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.
59 lines
1.2 KiB
59 lines
1.2 KiB
import type { MouseEvent } from 'react'
|
|
|
|
import { Link } from 'react-router-dom'
|
|
|
|
import type { Match } from 'features/Matches'
|
|
import { OutsideClick } from 'features/OutsideClick'
|
|
|
|
import {
|
|
CardHoverInner,
|
|
CardHoverTitle,
|
|
CardHoverWrapper,
|
|
MoreVideo,
|
|
Row,
|
|
Rows,
|
|
} from '../styled'
|
|
|
|
type CardFinishedHoverProps = {
|
|
match: Match,
|
|
onClose: () => void,
|
|
}
|
|
|
|
const stopProp = (e: MouseEvent<HTMLDivElement>) => {
|
|
e.stopPropagation()
|
|
}
|
|
|
|
export const CardFinishedHover = ({
|
|
match: {
|
|
hasVideo,
|
|
id,
|
|
sportName,
|
|
},
|
|
onClose,
|
|
}: CardFinishedHoverProps) => (
|
|
<OutsideClick onClick={onClose}>
|
|
<CardHoverWrapper onClick={onClose}>
|
|
<CardHoverInner>
|
|
<CardHoverTitle t='match_video' />
|
|
<Rows onClick={stopProp}>
|
|
<Row>
|
|
<Link to={`/${sportName}/matches/${id}`}>
|
|
<MoreVideo t='full_game' />
|
|
</Link>
|
|
<MoreVideo t='game_time' />
|
|
</Row>
|
|
|
|
<Row>
|
|
<MoreVideo t='highlights' />
|
|
<MoreVideo t='goals' />
|
|
<MoreVideo t='interview' />
|
|
</Row>
|
|
|
|
<Row>
|
|
<MoreVideo t='players_video' />
|
|
</Row>
|
|
</Rows>
|
|
</CardHoverInner>
|
|
</CardHoverWrapper>
|
|
</OutsideClick>
|
|
)
|
|
|