Update global header based on loggedIn status

This commit is contained in:
Robbie Antenesse 2019-10-17 21:10:15 -06:00
parent 43a8c006a1
commit d8f0de9ec4
2 changed files with 15 additions and 4 deletions

View File

@ -3,7 +3,9 @@
"locale": "en",
"global": {
"menu_search": "Search for Books",
"menu_login": "Log In",
"menu_about": "About",
"menu_login": "Log In / Create Account",
"menu_account": "My Profile",
"menu_logout": "Log Out",
"footer_repo": "Repo",
"footer_chat": "Chat"

View File

@ -19,9 +19,18 @@ export const globalView = (state, emit, view) => {
<label for="navMenu" class="burger pseudo button">${'\u2261'}</label>
<div class="menu">
<a href="/search" class="pseudo button"><i class="icon-search" aria-label=${i18n.__('global.menu_search')}></i></a>
<a href="/login" class="pseudo button">${i18n.__('global.menu_login')}</a>
<a href="/logout" class="pseudo button">${i18n.__('global.menu_logout')}</a>
<a href="/search" class="pseudo button">
<i class="icon-search" aria-labeledBy="searchLabel"></i> <span id="searchLabel">${i18n.__('global.menu_search')}</span>
</a>
<a href="/about" class="pseudo button">${i18n.__('global.menu_about')}</a>
${
state.isLoggedIn === true
? [
html`<a href="/account" class="pseudo button">${i18n.__('global.menu_account')}</a>`,
html`<a href="/logout" class="pseudo button">${i18n.__('global.menu_logout')}</a>`,
]
: html`<a href="/login" class="pseudo button">${i18n.__('global.menu_login')}</a>`
}
</div>
</nav>
</header>