feat: add currency setting with fiat conversion, display prices in user's preferred currency

js/components/app-footer.js

@@ -4,28 +4,43 @@ import { getXmrRates, formatFiat } from '../services/currency.js'
 class AppFooter extends HTMLElement {
     constructor() {
         super()
-        this.xmrRate = null
+        this.rates = null
+        this.handleCurrencyChange = this.handleCurrencyChange.bind(this)
     }
 
     async connectedCallback() {
         this.render()
-        await this.loadXmrRate()
+        await this.loadXmrRates()
+        window.addEventListener('currency-changed', this.handleCurrencyChange)
     }
 
-    async loadXmrRate() {
+    disconnectedCallback() {
+        window.removeEventListener('currency-changed', this.handleCurrencyChange)
+    }
+
+    handleCurrencyChange() {
+        this.updateRateDisplay()
+    }
+
+    getCurrency() {
+        return localStorage.getItem('dgray_currency') || 'USD'
+    }
+
+    async loadXmrRates() {
         try {
-            const rates = await getXmrRates()
-            this.xmrRate = rates.EUR
+            this.rates = await getXmrRates()
             this.updateRateDisplay()
         } catch (e) {
-            console.error('Failed to load XMR rate:', e)
+            console.error('Failed to load XMR rates:', e)
         }
     }
 
     updateRateDisplay() {
         const rateEl = this.querySelector('.xmr-rate')
-        if (rateEl && this.xmrRate) {
-            rateEl.textContent = `1 XMR ≈ ${formatFiat(this.xmrRate, 'EUR')}`
+        if (rateEl && this.rates) {
+            const currency = this.getCurrency()
+            const rate = this.rates[currency] || this.rates.USD
+            rateEl.textContent = `1 XMR ≈ ${formatFiat(rate, currency)}`
             rateEl.classList.add('loaded')
         }
     }
@@ -51,7 +66,7 @@ class AppFooter extends HTMLElement {
 
     updateTranslations() {
         this.render()
-        if (this.xmrRate) this.updateRateDisplay()
+        if (this.rates) this.updateRateDisplay()
     }
 }