feat: fiat currency picker

lib/currencies.tsx

@@ -0,0 +1,178 @@
+export type CurrencyObject = {
+    [key: string]: string;
+};
+
+const currencyObject: CurrencyObject = {
+    USD: "United States Dollar",
+    EUR: "Euro",
+    JPY: "Japanese Yen",
+    GBP: "British Pound Sterling",
+    AUD: "Australian Dollar",
+    CHF: "Swiss Franc",
+    AED: "United Arab Emirates Dirham",
+    AFN: "Afghan Afghani",
+    ALL: "Albanian Lek",
+    AMD: "Armenian Dram",
+    ANG: "Netherlands Antillean Guilder",
+    AOA: "Angolan Kwanza",
+    ARS: "Argentine Peso",
+    AWG: "Aruban Florin",
+    AZN: "Azerbaijani Manat",
+    BAM: "Bosnia-Herzegovina Convertible Mark",
+    BBD: "Barbadian Dollar",
+    BDT: "Bangladeshi Taka",
+    BGN: "Bulgarian Lev",
+    BHD: "Bahraini Dinar",
+    BIF: "Burundian Franc",
+    BMD: "Bermudan Dollar",
+    BND: "Brunei Dollar",
+    BOB: "Bolivian Boliviano",
+    BRL: "Brazilian Real",
+    BSD: "Bahamian Dollar",
+    BTC: "Bitcoin",
+    BTN: "Bhutanese Ngultrum",
+    BWP: "Botswanan Pula",
+    BYN: "Belarusian Ruble",
+    BZD: "Belize Dollar",
+    CAD: "Canadian Dollar",
+    CDF: "Congolese Franc",
+    CLF: "Chilean Unit of Account (UF)",
+    CLP: "Chilean Peso",
+    CNH: "Chinese Yuan (Offshore)",
+    CNY: "Chinese Yuan",
+    COP: "Colombian Peso",
+    CRC: "Costa Rican Colón",
+    CUC: "Cuban Convertible Peso",
+    CUP: "Cuban Peso",
+    CVE: "Cape Verdean Escudo",
+    CZK: "Czech Republic Koruna",
+    DJF: "Djiboutian Franc",
+    DKK: "Danish Krone",
+    DOP: "Dominican Peso",
+    DZD: "Algerian Dinar",
+    EGP: "Egyptian Pound",
+    ERN: "Eritrean Nakfa",
+    ETB: "Ethiopian Birr",
+    FJD: "Fijian Dollar",
+    FKP: "Falkland Islands Pound",
+    GEL: "Georgian Lari",
+    GGP: "Guernsey Pound",
+    GHS: "Ghanaian Cedi",
+    GIP: "Gibraltar Pound",
+    GMD: "Gambian Dalasi",
+    GNF: "Guinean Franc",
+    GTQ: "Guatemalan Quetzal",
+    GYD: "Guyanaese Dollar",
+    HKD: "Hong Kong Dollar",
+    HNL: "Honduran Lempira",
+    HRK: "Croatian Kuna",
+    HTG: "Haitian Gourde",
+    HUF: "Hungarian Forint",
+    IDR: "Indonesian Rupiah",
+    ILS: "Israeli New Sheqel",
+    IMP: "Manx pound",
+    INR: "Indian Rupee",
+    IQD: "Iraqi Dinar",
+    IRR: "Iranian Rial",
+    ISK: "Icelandic Króna",
+    JEP: "Jersey Pound",
+    JMD: "Jamaican Dollar",
+    JOD: "Jordanian Dinar",
+    KES: "Kenyan Shilling",
+    KGS: "Kyrgystani Som",
+    KHR: "Cambodian Riel",
+    KMF: "Comorian Franc",
+    KPW: "North Korean Won",
+    KRW: "South Korean Won",
+    KWD: "Kuwaiti Dinar",
+    KYD: "Cayman Islands Dollar",
+    KZT: "Kazakhstani Tenge",
+    LAK: "Laotian Kip",
+    LBP: "Lebanese Pound",
+    LKR: "Sri Lankan Rupee",
+    LRD: "Liberian Dollar",
+    LSL: "Lesotho Loti",
+    LYD: "Libyan Dinar",
+    MAD: "Moroccan Dirham",
+    MDL: "Moldovan Leu",
+    MGA: "Malagasy Ariary",
+    MKD: "Macedonian Denar",
+    MMK: "Myanma Kyat",
+    MNT: "Mongolian Tugrik",
+    MOP: "Macanese Pataca",
+    MRU: "Mauritanian Ouguiya",
+    MUR: "Mauritian Rupee",
+    MVR: "Maldivian Rufiyaa",
+    MWK: "Malawian Kwacha",
+    MXN: "Mexican Peso",
+    MYR: "Malaysian Ringgit",
+    MZN: "Mozambican Metical",
+    NAD: "Namibian Dollar",
+    NGN: "Nigerian Naira",
+    NIO: "Nicaraguan Córdoba",
+    NOK: "Norwegian Krone",
+    NPR: "Nepalese Rupee",
+    NZD: "New Zealand Dollar",
+    OMR: "Omani Rial",
+    PAB: "Panamanian Balboa",
+    PEN: "Peruvian Nuevo Sol",
+    PGK: "Papua New Guinean Kina",
+    PHP: "Philippine Peso",
+    PKR: "Pakistani Rupee",
+    PLN: "Polish Zloty",
+    PYG: "Paraguayan Guarani",
+    QAR: "Qatari Rial",
+    RON: "Romanian Leu",
+    RSD: "Serbian Dinar",
+    RUB: "Russian Ruble",
+    RWF: "Rwandan Franc",
+    SAR: "Saudi Riyal",
+    SBD: "Solomon Islands Dollar",
+    SCR: "Seychellois Rupee",
+    SDG: "Sudanese Pound",
+    SEK: "Swedish Krona",
+    SGD: "Singapore Dollar",
+    SHP: "Saint Helena Pound",
+    SLL: "Sierra Leonean Leone",
+    SOS: "Somali Shilling",
+    SRD: "Surinamese Dollar",
+    SSP: "South Sudanese Pound",
+    STD: "São Tomé and Príncipe Dobra (pre-2018)",
+    STN: "São Tomé and Príncipe Dobra",
+    SVC: "Salvadoran Colón",
+    SYP: "Syrian Pound",
+    SZL: "Swazi Lilangeni",
+    THB: "Thai Baht",
+    TJS: "Tajikistani Somoni",
+    TMT: "Turkmenistani Manat",
+    TND: "Tunisian Dinar",
+    TOP: "Tongan Pa'anga",
+    TRY: "Turkish Lira",
+    TTD: "Trinidad and Tobago Dollar",
+    TWD: "New Taiwan Dollar",
+    TZS: "Tanzanian Shilling",
+    UAH: "Ukrainian Hryvnia",
+    UGX: "Ugandan Shilling",
+    UYU: "Uruguayan Peso",
+    UZS: "Uzbekistan Som",
+    VEF: "Venezuelan Bolívar Fuerte (Old)",
+    VES: "Venezuelan Bolívar Soberano",
+    VND: "Vietnamese Dong",
+    VUV: "Vanuatu Vatu",
+    WST: "Samoan Tala",
+    XAF: "CFA Franc BEAC",
+    XAG: "Silver Ounce",
+    XAU: "Gold Ounce",
+    XCD: "East Caribbean Dollar",
+    XDR: "Special Drawing Rights",
+    XOF: "CFA Franc BCEAO",
+    XPD: "Palladium Ounce",
+    XPF: "CFP Franc",
+    XPT: "Platinum Ounce",
+    YER: "Yemeni Rial",
+    ZAR: "South African Rand",
+    ZMW: "Zambian Kwacha",
+    ZWL: "Zimbabwean Dollar"
+};
+
+export const currencies = Object.entries(currencyObject);

pages/settings/FiatCurrency.tsx

@@ -1,39 +1,43 @@
 import { router } from "expo-router";
 import React from "react";
-import { Keyboard, TouchableWithoutFeedback, View } from "react-native";
+import { View, FlatList, TouchableOpacity } from "react-native";
 import Toast from "react-native-toast-message";
 import { Button } from "~/components/ui/button";
-import { Input } from "~/components/ui/input";
 import { Text } from "~/components/ui/text";
 import { useAppStore } from "~/lib/state/appStore";
 import Screen from "~/components/Screen";
+import { cn } from "~/lib/utils";
+import { currencies } from "../../lib/currencies";
+
 
 export function FiatCurrency() {
   const [fiatCurrency, setFiatCurrency] = React.useState(
     useAppStore.getState().fiatCurrency,
   );
+
+  const renderCurrencyItem = ({ item }: { item: [string, string] }) => (
+    <TouchableOpacity
+      className={cn("p-4 flex flex-row gap-2 border-b border-input", item[0] === fiatCurrency && "bg-muted")}
+      onPress={() => setFiatCurrency(item[0])}
+    >
+      <Text className={cn("text-lg", item[0] === fiatCurrency && "font-bold2")}>
+        {item[1]}
+      </Text>
+      <Text className="text-lg text-muted-foreground">
+        ({item[0]})
+      </Text>
+    </TouchableOpacity >
+  );
+
   return (
-    <View className="flex-1 flex flex-col p-6 gap-3">
-      <Screen
-        title="Units & Currency"
+    <View className="flex-1 flex flex-col p-6">
+      <Screen title="Fiat Currency" />
+      <FlatList
+        data={currencies}
+        renderItem={renderCurrencyItem}
+        keyExtractor={(item) => item[0]}
+        className="flex-1 mb-4"
       />
-      <TouchableWithoutFeedback
-        onPress={() => {
-          Keyboard.dismiss();
-        }}
-      >
-        <View className="flex-1">
-          <Input
-            autoFocus
-            className="w-full text-center"
-            placeholder="USD"
-            value={fiatCurrency}
-            onChangeText={setFiatCurrency}
-            returnKeyType="done"
-          // aria-errormessage="inputError"
-          />
-        </View>
-      </TouchableWithoutFeedback>
       <Button
         size="lg"
         onPress={() => {

pages/settings/Settings.tsx

@@ -2,7 +2,7 @@ import { Link, router } from "expo-router";
 import { Alert, TouchableOpacity, View } from "react-native";
 import { Bitcoin, Egg, Palette, Power, Wallet2 } from "~/components/Icons";
 
-import { DEFAULT_WALLET_NAME } from "~/lib/constants";
+import { DEFAULT_CURRENCY, DEFAULT_WALLET_NAME } from "~/lib/constants";
 import { useAppStore } from "~/lib/state/appStore";
 import { Text } from "~/components/ui/text";
 import React from "react";
@@ -16,6 +16,7 @@ export function Settings() {
   const [developerCounter, setDeveloperCounter] = React.useState(0);
   const [developerMode, setDeveloperMode] = React.useState(false);
   const { colorScheme, toggleColorScheme } = useColorScheme();
+  const fiatCurrency = useAppStore((store) => store.fiatCurrency);
 
   return (
     <View className="flex-1 flex flex-col p-6 gap-6">
@@ -36,7 +37,10 @@ export function Settings() {
         <TouchableOpacity className="flex flex-row gap-4">
           <Bitcoin className="text-foreground" />
           <Text className="text-foreground font-medium2 text-xl">
-            Units & Currency
+            Fiat Currency
+          </Text>
+          <Text className="text-muted-foreground text-xl">
+            ({fiatCurrency || DEFAULT_CURRENCY})
           </Text>
         </TouchableOpacity>
       </Link>