The web3auth "connected" modal shows up on every page

[robinstraub]

I am using web3auth for a web application, every time I navigate to a new page the authentication mobile « You are connected with your account » shows up on page load and deteriorate the user experience.

is there any way to retain the authentication state across page navigation to avoid this behavior?

const web3auth = new Web3Auth({
    clientId: 'XXXXXXX',
    chainConfig: {
      chainNamespace: 'eip155',
      chainId: '0x13881',
      rpcTarget: 'https://rpc.ankr.com/polygon_mumbai',
      displayName: 'Polygon Mainnet',
      blockExplorer: 'https://mumbai.polygonscan.com/',
      ticker: 'MATIC',
      tickerName: 'Matic',
    },
    uiConfig: {
      theme: 'dark',
      appLogo: 'https://web3auth.io/images/w3a-L-Favicon-1.svg',
    },
  })
await web3auth.initModal()
await web3auth.connect()

[copostic]

As a workaround, I call the initModal method only when the user is not logged in

[robinstraub]

sadly the user does not stay "logged in" (connected in web3auth naming) on page change

[copostic]

Why do you want him to stay connected to Web3Auth ?
As for myself I have a cookie that contains all the user info (including the JWT provided by Web3Auth).
This way, I can display them on non protected routes (e.g. profile picture on my header)
and if the user tries to access to a protected page e.g. profile page, I check the JWT validity with jose.

[robinstraub]

I need to get the provider object to interact with the blockchain. the provider is only defined on web3auth after the user is connected, thus my need to retain the authentication state.

I do only call to web3auth on pages that need to fetch data to the blockchain. Web3auth does not inject a "ethereum.providers" object in the window like metamask so I cannot get it without relying on an initialized web3auth object