Since version 2.3.12 there is a bug related to hydration

[zabavnikov]

The error appears when using auth.loggedIn

<nav>
  <ul class="space-y-0.5 main-nav">
    <li v-if="$auth.loggedIn">
      <NuxtLink to="/feed" :class="classes">
        <Home class="w-5 h-5 mr-3" />
        <span>Моя лента</span>
      </NuxtLink>
    </li>
    <li v-for="(item, index) in nav" :key="index">
      <NuxtLink :to="item.href" class="flex items-center py-2 px-3 rounded-lg hover:bg-slate-50">
        <Component :is="item.icon" class="w-5 h-5 mr-3" />
        <span>{{ item.name }}</span>
      </NuxtLink>
    </li>
  </ul>
</nav>

or

<main class="flex flex-col gap-8 max-w-[800px] w-full">
  <EmailNotVerifiedAlert
    v-if="$auth.loggedIn && !$auth.user.email_verified_at"
  />

  <!-- HERO -->
  <div v-if="hasHero">
    <slot name="hero" />
  </div>
  <!-- / HERO -->

  <!-- CONTENT, CONTENT-SIDEBAR -->
  <div class="flex-auto flex gap-20" :class="{'flex-row-reverse': isReverse}">
    <div class="flex-auto max-w-[calc(800px-240px)] w-full">
      <slot />
    </div>
    <div v-if="hasSidebar" class="flex-shrink-0 w-[240px]">
      <slot name="sidebar-before" />
      <slot name="sidebar" />
      <slot name="sidebar-after" />
    </div>
  </div>
  <!-- / CONTENT, CONTENT-SIDEBAR -->
</main>

[Denoder]

does it happen after a redirect?

[zabavnikov]

does it happen after a redirect?

video-convert-1682061046201.webm

On the video the latest version of the package.

[Denoder]

and this wasn't happening before 2.3.12?

[zabavnikov]

and this wasn't happening before 2.3.12?

Before version 2.3.12 everything works as it should

[Denoder]

can you try 2.4.1?

[zabavnikov]

can you try 2.4.1?

video-convert-1682075075736.webm

Installed 2.4.1, but now the login does not work

My login is custom. Were there any changes to LocalScheme in 2.4.1?

import { LocalScheme } from '#auth/runtime'
import { useQuery } from '@placehub/ui'

export default class GraphQLScheme extends LocalScheme {
  /**
   * @param credentials
   * @param reset
   */
  async login(credentials, { reset = true } = {}) {
    // Ditch any leftover local tokens before attempting to log in.
    if (reset) {
      this.$auth.reset({ resetInterceptor: false });
    }

    try {
      const { data: { token } } = await useQuery({
        query: `
          query getJwtToken($email: String, $password: String) {
            token: login(email: $email, password: $password)
          }
        `,
        variables: {
          ...credentials
        }
      })

      if (token) {
        this.token.set(token)
      }

      await this.fetchUser()
    } catch (error) {
      throw error
    }
  }

  async fetchUser() {
    // Token is required but not available.
    if (! this.check().valid) {
      return
    }

    try {
      const { data } = await useQuery({
        query: `
          query getMe {
            me {
              id
              name
              avatar
              email_verified_at
            }
          }
        `,
      })

      this.$auth.setUser(data.me)

      return data
    } catch (error) {
      this.$auth.callOnError(error, {
        method: 'fetchUser'
      })

      return Promise.reject(error)
    }
  }

  async logout(): Promise<void> {
    await useQuery({
      query: `
        query logout {
          logout
        }
      `,
    })

    this.$auth.redirect('logout')

    return this.$auth.reset()
  }
}

[Denoder]

No, i didnt touch it, but i see the issue, give me a bit.

[Denoder]

try 2.4.2 now

[zabavnikov]

It works now 👍