feat: add notifications system with bell badge, polling, Directus flows, and webhook integration

js/app.js

@@ -20,6 +20,14 @@ async function initApp() {
     favoritesService.init()
     notificationsService.init()
 
+    auth.subscribe((loggedIn) => {
+        if (loggedIn) {
+            notificationsService.init()
+        } else {
+            notificationsService.destroy()
+        }
+    })
+
     await import('./components/app-shell.js')
     
     document.getElementById('app').innerHTML = '<app-shell></app-shell>'

js/components/auth-modal.js

@@ -364,7 +364,7 @@ style.textContent = /* css */`
         border-radius: var(--radius-lg);
         padding: var(--space-xl);
         width: 100%;
-        max-width: 425px;
+        max-width: 480px;
         position: relative;
         box-shadow: var(--shadow-xl);
     }

js/components/listing-card.js

@@ -246,8 +246,8 @@ style.textContent = /* css */`
     }
 
     listing-card .payment-published {
-        background: rgba(40, 167, 69, 0.9);
-        color: #fff;
+        background: var(--color-accent);
+        color: var(--color-accent-text, #fff);
     }
 
     listing-card .payment-expired {

js/services/btcpay.js

@@ -1,3 +1,5 @@
+import { i18n } from '../i18n.js'
+
 const POW_SERVER = 'https://pow.dgray.io'
 
 let modalScriptLoaded = false
@@ -80,7 +82,8 @@ export async function openCheckout(invoiceId) {
             resolve(lastStatus || 'unknown')
         })
 
-        window.btcpay.showInvoice(invoiceId)
+        const lang = i18n.getLocale() || 'en'
+        window.btcpay.showInvoice(invoiceId, { lang })
     })
 }
 

js/services/directus.js

@@ -114,9 +114,10 @@ class DirectusService {
         document.addEventListener('visibilitychange', () => {
             if (document.visibilityState === 'visible' && this.refreshToken) {
                 const timeLeft = this.tokenExpiry - Date.now()
-                if (timeLeft < 60000) {
+                if (timeLeft < 120000) {
                     this.refreshSession()
                 }
+                this.scheduleTokenRefresh()
             }
         })
     }
@@ -280,7 +281,7 @@ class DirectusService {
         this.clearTokens()
     }
 
-    async refreshSession() {
+    async refreshSession(_retryCount = 0) {
         if (!this.refreshToken) return false
         
         try {
@@ -298,6 +299,10 @@ class DirectusService {
                 return true
             }
         } catch (e) {
+            if (_retryCount < 2) {
+                await new Promise(r => setTimeout(r, 2000))
+                return this.refreshSession(_retryCount + 1)
+            }
             this.clearTokens()
         }