@@ -315,19 +315,24 @@ async function initAuth(nav, tools) {
315315 }
316316 if ( mobileLink && ! mobileLink . classList . contains ( 'button' ) ) mobileLink . classList . add ( 'button' ) ;
317317
318- const authState = await resolveAuthState ( ) ;
319- const loggedIn = authState . authenticated ;
320- const loginHref = getLoginUrl ( ) ;
321- const logoutHref = getLogoutUrl ( ) ;
322- const targetHref = loggedIn ? logoutHref : loginHref ;
323- const label = loggedIn ? logoutLabel : loginLabel ;
324-
325- [ desktopLink , mobileLink ] . filter ( Boolean ) . forEach ( ( link ) => {
326- link . setAttribute ( 'href' , targetHref ) ;
327- link . textContent = label ;
328- link . setAttribute ( 'aria-label' , label ) ;
329- setAuthUserInfo ( link , loggedIn ? authState . email : '' ) ;
330- } ) ;
318+ const applyAuthState = async ( ) => {
319+ const authState = await resolveAuthState ( ) ;
320+ const loggedIn = authState . authenticated ;
321+ const loginHref = getLoginUrl ( ) ;
322+ const logoutHref = getLogoutUrl ( ) ;
323+ const targetHref = loggedIn ? logoutHref : loginHref ;
324+ const label = loggedIn ? logoutLabel : loginLabel ;
325+
326+ [ desktopLink , mobileLink ] . filter ( Boolean ) . forEach ( ( link ) => {
327+ link . setAttribute ( 'href' , targetHref ) ;
328+ link . textContent = label ;
329+ link . setAttribute ( 'aria-label' , label ) ;
330+ setAuthUserInfo ( link , loggedIn ? authState . email : '' ) ;
331+ } ) ;
332+ } ;
333+
334+ await applyAuthState ( ) ;
335+ return applyAuthState ;
331336}
332337
333338function ensureGoogleTranslateScript ( ) {
@@ -454,6 +459,14 @@ function toggleMobile(nav, open, body) {
454459 nav . querySelectorAll ( '.nav-drop' ) . forEach ( ( d ) => d . setAttribute ( 'tabindex' , DESKTOP . matches ? '0' : '-1' ) ) ;
455460}
456461
462+ function syncMobileNavHeight ( nav ) {
463+ if ( DESKTOP . matches ) {
464+ nav . style . removeProperty ( '--nav-open-height' ) ;
465+ return ;
466+ }
467+ nav . style . setProperty ( '--nav-open-height' , `${ window . innerHeight } px` ) ;
468+ }
469+
457470const NAV_ITEMS = '.default-content-wrapper > ul > li' ;
458471
459472export default async function decorate ( block ) {
@@ -507,7 +520,11 @@ export default async function decorate(block) {
507520 const hamburger = document . createElement ( 'div' ) ;
508521 hamburger . className = 'nav-hamburger' ;
509522 hamburger . innerHTML = '<button type="button" aria-controls="nav" aria-label="Open navigation"><span class="nav-hamburger-icon"></span></button>' ;
510- hamburger . onclick = ( ) => toggleMobile ( nav , undefined , body ) ;
523+ let refreshAuthState = null ;
524+ hamburger . onclick = async ( ) => {
525+ toggleMobile ( nav , undefined , body ) ;
526+ if ( nav . getAttribute ( 'aria-expanded' ) === 'true' ) await refreshAuthState ?. ( ) ;
527+ } ;
511528
512529 eventRoot . addEventListener ( 'click' , ( e ) => {
513530 if ( ! DESKTOP . matches && nav . getAttribute ( 'aria-expanded' ) === 'true' && ! nav . contains ( e . target ) ) {
@@ -530,13 +547,23 @@ export default async function decorate(block) {
530547 block . append ( wrapper ) ;
531548
532549 toggleMobile ( nav , false , body ) ;
550+ syncMobileNavHeight ( nav ) ;
533551 collapseAll ( nav ) ;
534552 DESKTOP . addEventListener ( 'change' , ( ) => toggleMobile ( nav , false , body ) ) ;
553+ window . addEventListener ( 'resize' , ( ) => {
554+ syncMobileNavHeight ( nav ) ;
555+ } ) ;
535556
536557 if ( tools ) {
537558 initTheme ( tools ) ;
538559 initSearch ( tools ) ;
539- await initAuth ( nav , tools ) ;
560+ refreshAuthState = await initAuth ( nav , tools ) ;
561+ window . addEventListener ( 'pageshow' , ( ) => { refreshAuthState ?. ( ) ; } ) ;
562+ if ( eventRoot === document ) {
563+ document . addEventListener ( 'visibilitychange' , ( ) => {
564+ if ( ! document . hidden ) refreshAuthState ?. ( ) ;
565+ } ) ;
566+ }
540567 initLanguage ( tools , eventRoot ) ;
541568 hydrateTranslateFromCookie ( ) ;
542569 }
0 commit comments