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.
68 lines
1.4 KiB
68 lines
1.4 KiB
import { Fragment } from 'react'
|
|
import type { ReactNode } from 'react'
|
|
import { Link } from 'react-router-dom'
|
|
|
|
import { PAGES } from 'config'
|
|
|
|
import { client } from 'config/clients'
|
|
|
|
import { Menu } from 'features/Menu'
|
|
import { Search } from 'features/Search'
|
|
import { ScoreSwitch } from 'features/MatchSwitches'
|
|
|
|
import { isMatchPage } from 'helpers/isMatchPage'
|
|
|
|
import {
|
|
HeaderStyled,
|
|
HeaderGroup,
|
|
HeaderLogo,
|
|
Position,
|
|
} from './styled'
|
|
import { useProfileColor } from './hooks'
|
|
|
|
type Props = {
|
|
children?: ReactNode,
|
|
color?: string,
|
|
headerImage?: string | null,
|
|
height?: number,
|
|
profileId?: number,
|
|
}
|
|
|
|
export const ProfileHeader = ({
|
|
children,
|
|
color: headerColor,
|
|
headerImage,
|
|
height,
|
|
profileId,
|
|
}: Props) => {
|
|
const color = useProfileColor(profileId)
|
|
|
|
return (
|
|
<Fragment>
|
|
<HeaderStyled
|
|
headerImage={headerImage}
|
|
color={headerColor || color}
|
|
height={height}
|
|
>
|
|
<Position isMatchPage={isMatchPage()} left={1.7}>
|
|
<HeaderGroup marginTop={0.19}>
|
|
<Link to={PAGES.home}>
|
|
<HeaderLogo isMatchPage={isMatchPage()} />
|
|
</Link>
|
|
|
|
{client.showSearch && <Search />}
|
|
</HeaderGroup>
|
|
</Position>
|
|
|
|
{children}
|
|
|
|
<Position right={0.71}>
|
|
<HeaderGroup height={2.28}>
|
|
<ScoreSwitch />
|
|
<Menu />
|
|
</HeaderGroup>
|
|
</Position>
|
|
</HeaderStyled>
|
|
</Fragment>
|
|
)
|
|
}
|
|
|