fix auth

src/components/TopBar.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { addNote, setActiveNote, rootNote } from '@/composables/useNotes'
-import { user, signOut as firebaseSignOut, isPendingRedirect } from '@/composables/useAuth'
+import { user, signOut as firebaseSignOut } from '@/composables/useFirebase'
+import { initialized } from '@/composables/useFirebase'
 
 const props = defineProps<{
   sideBarCollapsed: boolean
@@ -10,22 +11,10 @@ const emit = defineEmits<{
   toggleSideBar: []
 }>()
 
-const signOut = (close: () => Promise<Boolean>) => {
-  firebaseSignOut()
+const signOut = async (close: () => Promise<boolean>) => {
+  await firebaseSignOut()
   close()
 }
-
-const signedIn = ref<boolean>(false)
-const closeAuthModal = async (close: () => Promise<boolean>) => {
-  await close()
-  signedIn.value = true
-  redirectPending.value = false
-}
-watch(user, () => {
-  if (!user.value) signedIn.value = false
-})
-
-const redirectPending = ref<boolean>(isPendingRedirect())
 </script>
 <template>
   <div class="fixed left-0 right-0 top-0 z-[500] flex h-[50px] bg-primary">
@@ -49,12 +38,12 @@ const redirectPending = ref<boolean>(isPendingRedirect())
         >
           <i class="fas fa-plus-circle text-[1.1rem]" />
         </button>
-        <Modal v-if="!signedIn" :open="redirectPending">
+        <Modal v-if="initialized && !user">
           <template #activator="{ open }">
             <button class="btn-outline btn-sm btn py-1 text-white" @click="open">Sign in</button>
           </template>
           <template #default="{ close }">
-            <Auth :authenticating="redirectPending" @signedIn="closeAuthModal(close)" />
+            <Auth @signedIn="close" />
           </template>
           <template #actions="{ close }">
             <button class="btn-sm btn" @click="close">Close</button>
@@ -72,6 +61,7 @@ const redirectPending = ref<boolean>(isPendingRedirect())
             <button class="btn-primary btn-sm btn" @click="signOut(close)">Sign out</button>
           </template>
         </Modal>
+        <template v-else>Loading...</template>
       </div>
     </div>
   </div>