Add currency settings, Settings service, and dialog to select fiat currency. Add support for non Official currencies like DOGE when using rates.

src/tui/hooks/useSatoshisConversion.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo, useSyncExternalStore } from 'react';
 import { useAppContext } from './useAppContext.js';
 import { useBchToFiatRate } from './useRates.js';
 
@@ -9,9 +9,40 @@ import { useBchToFiatRate } from './useRates.js';
  * component using it will re-render automatically when the selected pair
  * receives a new quote.
  */
-export function useSatoshisConversion(targetCurrency: string = 'USD') {
+export function useSatoshisConversion(targetCurrency?: string) {
   const { appService } = useAppContext();
-  const currencyCode = useMemo(() => targetCurrency.toUpperCase(), [targetCurrency]);
+  const subscribeToCurrency = useCallback(
+    (callback: () => void) => {
+      if (!appService || targetCurrency) {
+        return () => {};
+      }
+
+      return appService.settings.on('settings-updated', (event) => {
+        if (event.key === 'currency') {
+          callback();
+        }
+      });
+    },
+    [appService, targetCurrency],
+  );
+
+  const getCurrencySnapshot = useCallback(() => {
+    if (targetCurrency) {
+      return targetCurrency.toUpperCase();
+    }
+
+    if (!appService) {
+      return 'USD';
+    }
+
+    return appService.settings.getCurrency();
+  }, [appService, targetCurrency]);
+
+  const currencyCode = useSyncExternalStore(
+    subscribeToCurrency,
+    getCurrencySnapshot,
+    getCurrencySnapshot,
+  );
   const fiatPerBchRate = useBchToFiatRate(currencyCode);
 
   const formattedFiatPerBchRate = useMemo(() => {