Wait until session is initialized

vue/src/components/LoginQRCode.vue

@@ -8,18 +8,26 @@
 import { ref } from 'vue'
 import { useSession } from '@/stores/session'
 
-let qr = ref(null)
+const qr = ref(null)
-let lnurl = ref(null)
+const lnurl = ref(null)
+
+const login = async () => {
+  const s = await session.login()
+  qr.value = s.qr
+  lnurl.value = s.lnurl
+}
 
 const session = useSession()
-await (async () => {
+// wait until session is initialized
-  try {
+if (session.initialized && !session.isAuthenticated) {
-    if (session.isAuthenticated) return
+  await login()
-    const s = await session.login()
+} else {
-    qr = s.qr
+  // else subscribe to changes
-    lnurl = s.lnurl
+  session.$subscribe(async (_, s) => {
-  } catch (err) {
+    if (s.initialized && !s.isAuthenticated) {
-    console.error('error:', err.reason || err)
+      await login()
     }
-})()
+  })
+}
+
 </script>

vue/src/stores/session.js

@@ -4,6 +4,7 @@ import { computed, ref } from 'vue'
 export const useSession = defineStore('session', () => {
   const pubkey = ref(null)
   const isAuthenticated = computed(() => !!pubkey.value)
+  const initialized = ref(false)
 
   async function init () {
     try {
@@ -16,6 +17,7 @@ export const useSession = defineStore('session', () => {
     } catch (err) {
       console.error('error:', err.reason || err)
     }
+    initialized.value = true
   }
 
   function checkSession () {
@@ -35,5 +37,5 @@ export const useSession = defineStore('session', () => {
     return fetch(url, { credentials: 'include' }).then(r => r.json())
   }
 
-  return { pubkey, isAuthenticated, init, checkSession, login }
+  return { pubkey, isAuthenticated, initialized, init, checkSession, login }
 })