granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

HeaderMenu should always be in a <nav>

Browse source
This commit is contained in:
Justin Edmund 2022-12-27 17:16:34 -08:00
parent 0fb30e0ac5
commit 8f635c6967
1 changed files with 50 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

100
components/HeaderMenu/index.tsx
View file

@ -72,58 +72,56 @@ const HeaderMenu = (props: Props) => {
function authItems() {
return (
<nav>
<div className="MenuGroup">
<li className="MenuItem profile">
<Link href={`/${accountData.username}` || ''} passHref>
<div>
<span>{accountData.username}</span>
<img
alt={userData.picture}
className={`profile ${accountState.account.user?.element}`}
srcSet={`/profile/${accountState.account.user?.picture}.png,
/profile/${userData.picture}@2x.png 2x`}
src={`/profile/${userData.picture}.png`}
/>
</div>
</Link>
</li>
<li className="MenuItem">
<Link href={`/saved` || ''}>{t('menu.saved')}</Link>
</li>
</div>
<div className="MenuGroup">
<li className="MenuItem">
<Link href="/teams">{t('menu.teams')}</Link>
</li>
<li className="MenuItem disabled">
<ul className={menuClasses}>
<div className="MenuGroup">
<li className="MenuItem profile">
<Link href={`/${data?.account.username}` || ''} passHref>
<div>
<span>{t('menu.guides')}</span>
<i className="tag">{t('coming_soon')}</i>
<span>{data?.account.username}</span>
<img
alt={data?.user.picture}
className={`profile ${data?.user.element}`}
srcSet={`/profile/${data?.user.picture}.png,
/profile/${data?.user.picture}@2x.png 2x`}
src={`/profile/${data?.user.picture}.png`}
/>
</div>
</li>
</div>
<div className="MenuGroup">
<AboutModal />
<ChangelogModal />
<RoadmapModal />
</div>
<div className="MenuGroup">
<AccountModal
username={accountState.account.user?.username}
picture={accountState.account.user?.picture}
gender={accountState.account.user?.gender}
language={accountState.account.user?.language}
theme={accountState.account.user?.theme}
/>
<li className="MenuItem" onClick={props.logout}>
<span>{t('menu.logout')}</span>
</li>
</div>
</ul>
</nav>
</Link>
</li>
<li className="MenuItem">
<Link href={`/saved` || ''}>{t('menu.saved')}</Link>
</li>
</div>
<div className="MenuGroup">
<li className="MenuItem">
<Link href="/teams">{t('menu.teams')}</Link>
</li>
<li className="MenuItem disabled">
<div>
<span>{t('menu.guides')}</span>
<i className="tag">{t('coming_soon')}</i>
</div>
</li>
</div>
<div className="MenuGroup">
<AboutModal />
<ChangelogModal />
<RoadmapModal />
</div>
<div className="MenuGroup">
<AccountModal
username={data?.account.username}
picture={data?.user.picture}
gender={data?.user.gender}
language={data?.user.language}
theme={data?.user.theme}
/>
<li className="MenuItem" onClick={props.logout}>
<span>{t('menu.logout')}</span>
</li>
</div>
</ul>
)
}
@ -169,7 +167,9 @@ const HeaderMenu = (props: Props) => {
)
}
return props.authenticated ? authItems() : unauthItems()
return (
<nav ref={ref}>{props.authenticated ? authItems() : unauthItems()}</nav>
)
}
export default HeaderMenu