From d52aaaba9c8db15127b9ab88ddb443f20f3f66a5 Mon Sep 17 00:00:00 2001
From: Maciej Pienczyn <maciej.pienczyn@inpi.pl>
Date: Mon, 2 Feb 2026 19:32:35 +0100
Subject: [PATCH] feat: Add waiting animation for email verification polling

- Pulsing green dot with 'Oczekuje na aktywacje...' text
- Changes to 'Aktywowano! Przekierowuje...' when verified
- Visual feedback that page is actively checking
---
 templates/auth/registration_success.html | 50 +++++++++++++++++++++++-
 1 file changed, 49 insertions(+), 1 deletion(-)

diff --git a/templates/auth/registration_success.html b/templates/auth/registration_success.html
index cd29590..2b8f29d 100644
--- a/templates/auth/registration_success.html
+++ b/templates/auth/registration_success.html
@@ -178,6 +178,43 @@
         background: var(--primary);
         color: white;
     }
+
+    .waiting-indicator {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: var(--spacing-xs);
+        padding: var(--spacing-sm);
+        background-color: #ecfdf5;
+        border: 1px solid #10b981;
+        border-radius: var(--radius);
+        margin-bottom: var(--spacing-md);
+        color: #065f46;
+        font-size: var(--font-size-xs);
+    }
+
+    .waiting-dot {
+        width: 8px;
+        height: 8px;
+        background: #10b981;
+        border-radius: 50%;
+        animation: pulse 1.5s ease-in-out infinite;
+    }
+
+    @keyframes pulse {
+        0%, 100% { opacity: 0.4; transform: scale(0.8); }
+        50% { opacity: 1; transform: scale(1.2); }
+    }
+
+    .waiting-indicator.verified {
+        background-color: #d1fae5;
+        border-color: #059669;
+    }
+
+    .waiting-indicator.verified .waiting-dot {
+        animation: none;
+        background: #059669;
+    }
 </style>
 {% endblock %}
 
@@ -214,6 +251,11 @@
             </ol>
         </div>
 
+        <div class="waiting-indicator" id="waitingIndicator">
+            <span class="waiting-dot"></span>
+            <span id="waitingText">Oczekuje na aktywacje...</span>
+        </div>
+
         <div class="timer-box">
             <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
@@ -236,13 +278,19 @@
 (function() {
     const email = '{{ email }}';
     const checkUrl = '{{ url_for("auth.check_verification_status") }}?email=' + encodeURIComponent(email);
+    const indicator = document.getElementById('waitingIndicator');
+    const waitingText = document.getElementById('waitingText');
 
     function checkVerification() {
         fetch(checkUrl)
             .then(response => response.json())
             .then(data => {
                 if (data.verified && data.redirect) {
-                    window.location.href = data.redirect;
+                    indicator.classList.add('verified');
+                    waitingText.textContent = 'Aktywowano! Przekierowuje...';
+                    setTimeout(() => {
+                        window.location.href = data.redirect;
+                    }, 500);
                 }
             })
             .catch(() => {});