feat: add FavoritesService with Directus sync, union merge on login, localStorage migration

js/components/pages/page-favorites.js

@@ -1,6 +1,7 @@
 import { t, i18n } from '../../i18n.js'
 import { directus } from '../../services/directus.js'
 import { auth } from '../../services/auth.js'
+import { favoritesService } from '../../services/favorites.js'
 import { escapeHTML } from '../../utils/helpers.js'
 import '../listing-card.js'
 import '../skeleton-card.js'
@@ -14,32 +15,19 @@ class PageFavorites extends HTMLElement {
     }
 
     connectedCallback() {
-        if (!auth.isLoggedIn()) {
-            window.location.hash = '#/'
-            return
-        }
-        
         this.render()
         this.loadFavorites()
         this.unsubscribe = i18n.subscribe(() => this.render())
-        this.authUnsubscribe = auth.subscribe(() => {
-            if (!auth.isLoggedIn()) {
-                window.location.hash = '#/'
-            }
-        })
+        this.favUnsubscribe = favoritesService.subscribe(() => this.loadFavorites())
     }
 
     disconnectedCallback() {
         if (this.unsubscribe) this.unsubscribe()
-        if (this.authUnsubscribe) this.authUnsubscribe()
-    }
-
-    getFavoriteIds() {
-        return JSON.parse(localStorage.getItem('favorites') || '[]')
+        if (this.favUnsubscribe) this.favUnsubscribe()
     }
 
     async loadFavorites() {
-        const ids = this.getFavoriteIds()
+        const ids = favoritesService.getAll()
         
         if (ids.length === 0) {
             this.loading = false

js/components/pages/page-listing.js

@@ -1,6 +1,7 @@
 import { t, i18n } from '../../i18n.js'
 import { directus } from '../../services/directus.js'
 import { auth } from '../../services/auth.js'
+import { favoritesService } from '../../services/favorites.js'
 import { getXmrRates, formatPrice as formatCurrencyPrice } from '../../services/currency.js'
 import { escapeHTML } from '../../utils/helpers.js'
 import '../chat-widget.js'
@@ -99,20 +100,11 @@ class PageListing extends HTMLElement {
     }
 
     loadFavoriteState() {
-        const favorites = JSON.parse(localStorage.getItem('favorites') || '[]')
-        this.isFavorite = favorites.includes(this.listingId)
+        this.isFavorite = favoritesService.isFavorite(this.listingId)
     }
 
     toggleFavorite() {
-        let favorites = JSON.parse(localStorage.getItem('favorites') || '[]')
-        
-        if (this.isFavorite) {
-            favorites = favorites.filter(f => f !== this.listingId)
-        } else {
-            favorites.push(this.listingId)
-        }
-        
-        localStorage.setItem('favorites', JSON.stringify(favorites))
+        favoritesService.toggle(this.listingId)
         this.isFavorite = !this.isFavorite
         
         const btn = this.querySelector('#favorite-btn')

js/components/pages/page-settings.js

@@ -1,5 +1,6 @@
 import { t, i18n } from '../../i18n.js'
 import { auth } from '../../services/auth.js'
+import { favoritesService } from '../../services/favorites.js'
 
 class PageSettings extends HTMLElement {
     constructor() {
@@ -63,9 +64,12 @@ class PageSettings extends HTMLElement {
         })
 
         // Clear favorites
-        this.querySelector('#clear-favorites')?.addEventListener('click', () => {
+        this.querySelector('#clear-favorites')?.addEventListener('click', async () => {
             if (confirm(t('settings.confirmClearFavorites'))) {
-                localStorage.removeItem('favorites')
+                const ids = favoritesService.getAll()
+                for (const id of ids) {
+                    await favoritesService.toggle(id)
+                }
                 this.showToast(t('settings.favoritesCleared'))
             }
         })