Token mismatch after refresh (handling onTokenChanged)

[pk992]

The bug
If the access token get's refreshed by the Nhost client, a hydration mismatch happens (if the access token is displayed) and further requests like page reloads fail, leading to log-out.

To Reproduce
Start the playground, login and wait until the token get's refreshed. Then reload or change the page to see the auth fail.

A possible solution
Adding the following code prevents the bug, but also adds an unecassary, second POST to /api/_nhost/session on each page reload.

plugins/nhost.client.ts: adding onTokenChanged in mounted hook

// Once Nuxt app is mounted
nuxtApp.hooks.hook('app:mounted', () => {
    // Listen to Nhost auth changes
    client.auth.onAuthStateChanged(async (event, session) => {
        await setServerSession(event, session)
        const nhostUser = client.auth.getUser()
        user.value = nhostUser
    })

    // Listen to Nhost token changes
    client.auth.onTokenChanged(async (session) => {
        await setServerSession('TOKEN_CHANGED', session)
        const nhostUser = client.auth.getUser()
        user.value = nhostUser
    })
})

server/api/_nhost/session.ts: adding TOKEN_CHANGED handler

if (signEvent === 'TOKEN_CHANGED') {
    if (!session) {
        throw new Error('Auth session missing!')
    }
    setCookie(
        event,
        `${cookieOptions.name}-access-token`,
        session.refreshToken, {
            domain: cookieOptions.domain,
            maxAge: cookieOptions.lifetime ?? 0,
            path: cookieOptions.path,
            sameSite: cookieOptions.sameSite
        }
    )
}

Right now, I can't think of a clean way to prevent the duplicated POST to /api/_nhost/session.