After second login frontend user info only gets updated in sidebar, not in index

[liutec]

First Check

• I added a very descriptive title here.
• I used the GitHub search to find a similar question and didn't find it.
• I searched in the documentation/README.
• I already searched in Google "How to do X" and didn't find any information.
• I already read and followed all the tutorial in the docs/README and didn't find an answer.

Commit to Help

• I commit to help with one of those options 👆

Example Code

# components/common/Sidebar.tsx
[..]
const Sidebar: React.FC = () => {
  const queryClient = useQueryClient()
  const bgColor = useColorModeValue('ui.white', 'ui.dark')
  const textColor = useColorModeValue('ui.dark', 'ui.white')
  const secBgColor = useColorModeValue('ui.secondary', 'ui.darkSlate')
  const currentUser = queryClient.getQueryData<UserOut>('currentUser')
  const { isOpen, onOpen, onClose } = useDisclosure()
  const { logout } = useAuth()

  console.log(currentUser)  // outputs info for the currently authenticated user
[...]

# routes/_layout/index.tsx
[...]
function Dashboard() {
  const queryClient = useQueryClient()

  const currentUser = queryClient.getQueryData<UserOut>('currentUser')

  console.log(currentUser)  // outputs info for the previously authenticated user
[...]

Description

Context:

• create one or more additional users

Steps to reproduce:

• login as user 1
• log out
• login as user 2
• the sidebar correctly displays the newly authenticated user (user 2)
• the dashboard welcomes the previously authenticated user (user 1)

Operating System

Linux

Operating System Details

not OS related

Python Version

3.10

Additional Context

This issue reproduces everywhere useAuth() is not called and queryClient.getQueryData('currentUser') is used.