Pinia firebase user emailVerified property loses reactivity

Question

currently i'm building out an app that on user signup I navigate the user to an email verification page. This page then watches the firebase user object inside of a Pinia store waiting for the emailVerified user property to update before directing them to a new page.

When I update the user object manually using vue devtools I can observe my console.log. When I receive the email verification email and use the link provided by firebase my watcher does not react to the user update. I can refresh the pinia store using my vue devtools and I see emailVerified inside my firebase user object has been updated to true but my watcher was never hit.

Any ideas on why I am losing reactivity when going through the email flow?

testStore.js

export const useTestStore = defineStore('test', () => {
   const auth = getAuth()
  const {user} = useAuth(auth)

  return {
    user: user,
  }
})

emailVerification.js

<script setup>
const { user } = storeToRefs(testStore)

watch(user, () => {
  console.log('Direct user to new page')
}, { deep:true })
</script>

Answer 1

For some reason when replacing my watcher with setInterval it seems to works... although this is not the ideal solution

setInterval(function () {
      if(user){
        if(user.value?.emailVerified) {
          console.log('Direct user to new page');
        }
      }
}, 5000);