From 0e634c84ff2816cbf74c90fb7486225cd21014fe Mon Sep 17 00:00:00 2001
From: Jackson Roberts <jrobe3221@gmail.com>
Date: Fri, 27 Feb 2026 18:08:27 -0600
Subject: [PATCH] fix: keep login spinner visible until auth callback completes

- Spinner was disappearing when the OAuth popup closed, but the server
  was still waiting for the socket callback (awaitAuthCallback)
- Now the spinner stays until BOTH the popup closes AND the form action
  finishes
- Handle popup-blocked case by resetting loading state immediately
---
 src/routes/(auth)/login/+page.svelte | 37 ++++++++++++++++++++++------
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/src/routes/(auth)/login/+page.svelte b/src/routes/(auth)/login/+page.svelte
index d6a79bd..19ccea1 100644
--- a/src/routes/(auth)/login/+page.svelte
+++ b/src/routes/(auth)/login/+page.svelte
@@ -8,10 +8,13 @@
 
   const uriData = await optima.auth.fetchAuthRedirectUri(PUBLIC_API_URL);
   let loading = writable(false);
+  /** Track whether the server-side form action has finished */
+  let formActionDone = false;
 
   function handleSubmit(e: SubmitEvent) {
     if ($loading) return;
     $loading = true;
+    formActionDone = false;
 
     const url = uriData.uri;
     const width = 420;
@@ -22,15 +25,26 @@
 
     const popup = window.open(url, "msAuth", features);
 
-    if (popup) {
-      const popupCheckInterval = setInterval(() => {
-        console.log(popup);
-        if (popup.closed) {
-          clearInterval(popupCheckInterval);
+    if (!popup) {
+      // Popup was blocked — reset so the user can try again
+      $loading = false;
+      return;
+    }
+
+    // Only hide the spinner when BOTH the popup has closed AND the
+    // server-side form action (awaitAuthCallback) has completed.
+    // Previously the spinner was removed as soon as the popup closed,
+    // leaving a gap while the server was still processing the callback.
+    const popupCheckInterval = setInterval(() => {
+      if (popup.closed) {
+        clearInterval(popupCheckInterval);
+        if (formActionDone) {
           $loading = false;
         }
-      }, 500);
-    }
+        // If the form action isn't done yet the spinner stays;
+        // the enhance callback below will clear it.
+      }
+    }, 500);
   }
 </script>
 
@@ -71,7 +85,14 @@
     </svg>
   </button>
 
-  <form action="?/login" method="POST" onsubmit={handleSubmit} use:enhance>
+  <form action="?/login" method="POST" onsubmit={handleSubmit} use:enhance={() => {
+    // Called when the form action response comes back from the server
+    return async ({ update }) => {
+      formActionDone = true;
+      $loading = false;
+      await update();
+    };
+  }}>
     <input type="hidden" name="callbackKey" value={uriData.callbackKey} />
     <button
       type="submit"