cake pay country picker (#1779)

* cake pay country picker

* UI changes

* hide picker after the country is set

* Revert "hide picker after the country is set"

This reverts commit cce358b94f55c22e0807b4d3641a13ebd299106c.

* show country picker initially

* flags

* minor ui fixes

* Update lib/view_model/cake_pay/cake_pay_cards_list_view_model.dart

---------

Co-authored-by: tuxpizza <tuxsudo@tux.pizza>
Co-authored-by: Omar Hatem <omarh.ismail1@gmail.com>

lib/cake_pay/cake_pay_api.dart

@@ -3,6 +3,7 @@ import 'dart:convert';
 import 'package:cake_wallet/cake_pay/cake_pay_order.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_user_credentials.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_vendor.dart';
+import 'package:cake_wallet/entities/country.dart';
 import 'package:http/http.dart' as http;
 
 class CakePayApi {
@@ -171,7 +172,7 @@ class CakePayApi {
   }
 
   /// Get Countries
-  Future<List<String>> getCountries(
+  Future<List<Country>> getCountries(
       {required String CSRFToken, required String authorization}) async {
     final uri = Uri.https(baseCakePayUri, countriesPath);
 
@@ -188,8 +189,11 @@ class CakePayApi {
     }
 
     final bodyJson = json.decode(response.body) as List;
-
-    return bodyJson.map<String>((country) => country['name'] as String).toList();
+    return bodyJson
+        .map<String>((country) => country['name'] as String)
+        .map((name) => Country.fromCakePayName(name))
+        .whereType<Country>()
+        .toList();
   }
 
   /// Get Vendors

lib/cake_pay/cake_pay_service.dart

@@ -3,6 +3,7 @@ import 'package:cake_wallet/cake_pay/cake_pay_api.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_order.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_vendor.dart';
 import 'package:cake_wallet/core/secure_storage.dart';
+import 'package:cake_wallet/entities/country.dart';
 
 class CakePayService {
   CakePayService(this.secureStorage, this.cakePayApi);
@@ -23,7 +24,7 @@ class CakePayService {
   final CakePayApi cakePayApi;
 
   /// Get Available Countries
-  Future<List<String>> getCountries() async =>
+  Future<List<Country>> getCountries() async =>
       await cakePayApi.getCountries(CSRFToken: CSRFToken, authorization: authorization);
 
   /// Get Vendors

lib/di.dart

@@ -1271,7 +1271,8 @@ Future<void> setup({
       () => CakePayService(getIt.get<SecureStorage>(), getIt.get<CakePayApi>()));
 
   getIt.registerFactory(
-      () => CakePayCardsListViewModel(cakePayService: getIt.get<CakePayService>()));
+      () => CakePayCardsListViewModel(cakePayService: getIt.get<CakePayService>(),
+          settingsStore: getIt.get<SettingsStore>()));
 
   getIt.registerFactory(() => CakePayAuthViewModel(cakePayService: getIt.get<CakePayService>()));
 

lib/entities/country.dart

@@ -0,0 +1,386 @@
+import 'package:cw_core/enumerable_item.dart';
+import 'package:collection/collection.dart';
+
+class Country extends EnumerableItem<String> with Serializable<String> {
+  const Country({required String code, required this.fullName, required this.countryCode})
+      : super(title: fullName, raw: code);
+
+  final String fullName;
+  final String countryCode;
+
+  static List<Country> get all => _all.values.toList();
+
+  static const afghanistan = Country(code: 'afg', countryCode: 'AF', fullName: "Afghanistan");
+  static const andorra = Country(code: 'and', countryCode: 'AD', fullName: "Andorra");
+  static const angola = Country(code: 'ago', countryCode: 'AO', fullName: "Angola");
+  static const anguilla = Country(code: 'aia', countryCode: 'AI', fullName: "Anguilla");
+  static const antigua_and_barbuda =
+      Country(code: 'atg', countryCode: 'AG', fullName: "Antigua and Barbuda");
+  static const are = Country(code: 'are', countryCode: 'AE', fullName: "United Arab Emirates");
+  static const arg = Country(code: 'arg', countryCode: 'AR', fullName: "Argentina");
+  static const arm = Country(code: 'arm', countryCode: 'AM', fullName: "Armenia");
+  static const aruba = Country(code: 'abw', countryCode: 'AW', fullName: "Aruba");
+  static const aus = Country(code: 'aus', countryCode: 'AU', fullName: "Australia");
+  static const aut = Country(code: 'aut', countryCode: 'AT', fullName: "Austria");
+  static const aze = Country(code: 'aze', countryCode: 'AZ', fullName: "Azerbaijan");
+  static const belize = Country(code: 'blz', countryCode: 'BZ', fullName: "Belize");
+  static const bfa = Country(code: 'bfa', countryCode: 'BF', fullName: "Burkina Faso");
+  static const bel = Country(code: 'bel', countryCode: 'BE', fullName: "Belgium");
+  static const bgd = Country(code: 'bgd', countryCode: 'BD', fullName: "Bangladesh");
+  static const bhr = Country(code: 'bhr', countryCode: 'BH', fullName: "Bahrain");
+  static const bhs = Country(code: 'bhs', countryCode: 'BS', fullName: "Bahamas");
+  static const bhutan = Country(code: 'btn', countryCode: 'BT', fullName: "Bhutan");
+  static const bol = Country(code: 'bol', countryCode: 'BO', fullName: "Bolivia");
+  static const bra = Country(code: 'bra', countryCode: 'BR', fullName: "Brazil");
+  static const brn = Country(code: 'brn', countryCode: 'BN', fullName: "Brunei");
+  static const bwa = Country(code: 'bwa', countryCode: 'BW', fullName: "Botswana");
+  static const cad = Country(code: 'cad', countryCode: 'CA', fullName: "Canada");
+  static const che = Country(code: 'che', countryCode: 'CH', fullName: "Switzerland");
+  static const chl = Country(code: 'chl', countryCode: 'CL', fullName: "Chile");
+  static const chn = Country(code: 'chn', countryCode: 'CN', fullName: "China");
+  static const col = Country(code: 'col', countryCode: 'CO', fullName: "Colombia");
+  static const cri = Country(code: 'cri', countryCode: 'CR', fullName: "Costa Rica");
+  static const cyp = Country(code: 'cyp', countryCode: 'CY', fullName: "Cyprus");
+  static const czk = Country(code: 'czk', countryCode: 'CZ', fullName: "Czech Republic");
+  static const deu = Country(code: 'deu', countryCode: 'DE', fullName: "Germany");
+  static const dji = Country(code: 'dji', countryCode: 'DJ', fullName: "Djibouti");
+  static const dnk = Country(code: 'dnk', countryCode: 'DK', fullName: "Denmark");
+  static const dza = Country(code: 'dza', countryCode: 'DZ', fullName: "Algeria");
+  static const ecu = Country(code: 'ecu', countryCode: 'EC', fullName: "Ecuador");
+  static const egy = Country(code: 'egy', countryCode: 'EG', fullName: "Egypt");
+  static const esp = Country(code: 'esp', countryCode: 'ES', fullName: "Spain");
+  static const est = Country(code: 'est', countryCode: 'EE', fullName: "Estonia");
+  static const eur = Country(code: 'eur', countryCode: 'EU', fullName: "European Union");
+  static const fin = Country(code: 'fin', countryCode: 'FI', fullName: "Finland");
+  static const fji = Country(code: 'fji', countryCode: 'FJ', fullName: "Fiji");
+  static const flk = Country(code: 'flk', countryCode: 'FK', fullName: "Falkland Islands");
+  static const fra = Country(code: 'fra', countryCode: 'FR', fullName: "France");
+  static const fsm = Country(code: 'fsm', countryCode: 'FM', fullName: "Micronesia");
+  static const gab = Country(code: 'gab', countryCode: 'GA', fullName: "Gabon");
+  static const gbr = Country(code: 'gbr', countryCode: 'GB', fullName: "United Kingdom");
+  static const geo = Country(code: 'geo', countryCode: 'GE', fullName: "Georgia");
+  static const gha = Country(code: 'gha', countryCode: 'GH', fullName: "Ghana");
+  static const grc = Country(code: 'grc', countryCode: 'GR', fullName: "Greece");
+  static const grd = Country(code: 'grd', countryCode: 'GD', fullName: "Grenada");
+  static const grl = Country(code: 'grl', countryCode: 'GL', fullName: "Greenland");
+  static const gtm = Country(code: 'gtm', countryCode: 'GT', fullName: "Guatemala");
+  static const guy = Country(code: 'guy', countryCode: 'GY', fullName: "Guyana");
+  static const hkg = Country(code: 'hkg', countryCode: 'HK', fullName: "Hong Kong");
+  static const hrv = Country(code: 'hrv', countryCode: 'HR', fullName: "Croatia");
+  static const hun = Country(code: 'hun', countryCode: 'HU', fullName: "Hungary");
+  static const idn = Country(code: 'idn', countryCode: 'ID', fullName: "Indonesia");
+  static const ind = Country(code: 'ind', countryCode: 'IN', fullName: "India");
+  static const irl = Country(code: 'irl', countryCode: 'IE', fullName: "Ireland");
+  static const irn = Country(code: 'irn', countryCode: 'IR', fullName: "Iran");
+  static const isl = Country(code: 'isl', countryCode: 'IS', fullName: "Iceland");
+  static const isr = Country(code: 'isr', countryCode: 'IL', fullName: "Israel");
+  static const ita = Country(code: 'ita', countryCode: 'IT', fullName: "Italy");
+  static const jam = Country(code: 'jam', countryCode: 'JM', fullName: "Jamaica");
+  static const jor = Country(code: 'jor', countryCode: 'JO', fullName: "Jordan");
+  static const jpn = Country(code: 'jpn', countryCode: 'JP', fullName: "Japan");
+  static const kaz = Country(code: 'kaz', countryCode: 'KZ', fullName: "Kazakhstan");
+  static const ken = Country(code: 'ken', countryCode: 'KE', fullName: "Kenya");
+  static const kir = Country(code: 'kir', countryCode: 'KI', fullName: "Kiribati");
+  static const kor = Country(code: 'kor', countryCode: 'KR', fullName: "South Korea");
+  static const kwt = Country(code: 'kwt', countryCode: 'KW', fullName: "Kuwait");
+  static const lie = Country(code: 'lie', countryCode: 'LI', fullName: "Liechtenstein");
+  static const lka = Country(code: 'lka', countryCode: 'LK', fullName: "Sri Lanka");
+  static const ltu = Country(code: 'ltu', countryCode: 'LT', fullName: "Lithuania");
+  static const lux = Country(code: 'lux', countryCode: 'LU', fullName: "Luxembourg");
+  static const lva = Country(code: 'lva', countryCode: 'LV', fullName: "Latvia");
+  static const mar = Country(code: 'mar', countryCode: 'MA', fullName: "Morocco");
+  static const mex = Country(code: 'mex', countryCode: 'MX', fullName: "Mexico");
+  static const mlt = Country(code: 'mlt', countryCode: 'MT', fullName: "Malta");
+  static const mnp = Country(code: 'mnp', countryCode: 'MP', fullName: "Northern Mariana Islands");
+  static const mtq = Country(code: 'mtq', countryCode: 'MQ', fullName: "Martinique");
+  static const mys = Country(code: 'mys', countryCode: 'MY', fullName: "Malaysia");
+  static const mwi = Country(code: 'mwi', countryCode: 'MW', fullName: "Malawi");
+  static const nga = Country(code: 'nga', countryCode: 'NG', fullName: "Nigeria");
+  static const niu = Country(code: 'niu', countryCode: 'NU', fullName: "Niue");
+  static const nld = Country(code: 'nld', countryCode: 'NL', fullName: "Netherlands");
+  static const nor = Country(code: 'nor', countryCode: 'NO', fullName: "Norway");
+  static const nzl = Country(code: 'nzl', countryCode: 'NZ', fullName: "New Zealand");
+  static const omn = Country(code: 'omn', countryCode: 'OM', fullName: "Oman");
+  static const pak = Country(code: 'pak', countryCode: 'PK', fullName: "Pakistan");
+  static const per = Country(code: 'per', countryCode: 'PE', fullName: "Peru");
+  static const phl = Country(code: 'phl', countryCode: 'PH', fullName: "Philippines");
+  static const pol = Country(code: 'pol', countryCode: 'PL', fullName: "Poland");
+  static const pri = Country(code: 'pri', countryCode: 'PR', fullName: "Puerto Rico");
+  static const prt = Country(code: 'prt', countryCode: 'PT', fullName: "Portugal");
+  static const qat = Country(code: 'qat', countryCode: 'QA', fullName: "Qatar");
+  static const rou = Country(code: 'rou', countryCode: 'RO', fullName: "Romania");
+  static const rus = Country(code: 'rus', countryCode: 'RU', fullName: "Russia");
+  static const saf = Country(code: 'saf', countryCode: 'ZA', fullName: "South Africa");
+  static const sau = Country(code: 'sau', countryCode: 'SA', fullName: "Saudi Arabia");
+  static const sgp = Country(code: 'sgp', countryCode: 'SG', fullName: "Singapore");
+  static const slb = Country(code: 'slb', countryCode: 'SB', fullName: "Solomon Islands");
+  static const svk = Country(code: 'svk', countryCode: 'SK', fullName: "Slovakia");
+  static const svn = Country(code: 'svn', countryCode: 'SI', fullName: "Slovenia");
+  static const swe = Country(code: 'swe', countryCode: 'SE', fullName: "Sweden");
+  static const tha = Country(code: 'tha', countryCode: 'TH', fullName: "Thailand");
+  static const tkm = Country(code: 'tkm', countryCode: 'TM', fullName: "Turkmenistan");
+  static const ton = Country(code: 'ton', countryCode: 'TO', fullName: "Tonga");
+  static const tur = Country(code: 'tur', countryCode: 'TR', fullName: "Turkey");
+  static const tuv = Country(code: 'tuv', countryCode: 'TV', fullName: "Tuvalu");
+  static const twn = Country(code: 'twn', countryCode: 'TW', fullName: "Taiwan");
+  static const ukr = Country(code: 'ukr', countryCode: 'UA', fullName: "Ukraine");
+  static const ury = Country(code: 'ury', countryCode: 'UY', fullName: "Uruguay");
+  static const usa = Country(code: 'usa', countryCode: 'US', fullName: "USA");
+  static const ven = Country(code: 'ven', countryCode: 'VE', fullName: "Venezuela");
+  static const vnm = Country(code: 'vnm', countryCode: 'VN', fullName: "Vietnam");
+  static const vut = Country(code: 'vut', countryCode: 'VU', fullName: "Vanuatu");
+  static const btn = Country(code: 'btn', countryCode: 'BT', fullName: "Bhutan");
+  static const bgr = Country(code: 'bgr', countryCode: 'BG', fullName: "Bulgaria");
+  static const guf = Country(code: 'guf', countryCode: 'GF', fullName: "French Guiana");
+  static const bes = Country(code: 'bes', countryCode: 'BQ', fullName: "Caribbean Netherlands");
+  static const fro = Country(code: 'fro', countryCode: 'FO', fullName: "Faroe Islands");
+  static const cuw = Country(code: 'cuw', countryCode: 'CW', fullName: "Curacao");
+  static const msr = Country(code: 'msr', countryCode: 'MS', fullName: "Montserrat");
+  static const cpv = Country(code: 'cpv', countryCode: 'CV', fullName: "Cabo Verde");
+  static const nfk = Country(code: 'nfk', countryCode: 'NF', fullName: "Norfolk Island");
+  static const bmu = Country(code: 'bmu', countryCode: 'BM', fullName: "Bermuda");
+  static const vat = Country(code: 'vat', countryCode: 'VA', fullName: "Vatican City");
+  static const aia = Country(code: 'aia', countryCode: 'AI', fullName: "Anguilla");
+  static const gum = Country(code: 'gum', countryCode: 'GU', fullName: "Guam");
+  static const myt = Country(code: 'myt', countryCode: 'YT', fullName: "Mayotte");
+  static const mrt = Country(code: 'mrt', countryCode: 'MR', fullName: "Mauritania");
+  static const ggy = Country(code: 'ggy', countryCode: 'GG', fullName: "Guernsey");
+  static const cck = Country(code: 'cck', countryCode: 'CC', fullName: "Cocos (Keeling) Islands");
+  static const blz = Country(code: 'blz', countryCode: 'BZ', fullName: "Belize");
+  static const cxr = Country(code: 'cxr', countryCode: 'CX', fullName: "Christmas Island");
+  static const mco = Country(code: 'mco', countryCode: 'MC', fullName: "Monaco");
+  static const ner = Country(code: 'ner', countryCode: 'NE', fullName: "Niger");
+  static const jey = Country(code: 'jey', countryCode: 'JE', fullName: "Jersey");
+  static const asm = Country(code: 'asm', countryCode: 'AS', fullName: "American Samoa");
+  static const gmb = Country(code: 'gmb', countryCode: 'GM', fullName: "Gambia");
+  static const dma = Country(code: 'dma', countryCode: 'DM', fullName: "Dominica");
+  static const glp = Country(code: 'glp', countryCode: 'GP', fullName: "Guadeloupe");
+  static const ggi = Country(code: 'ggi', countryCode: 'GI', fullName: "Gibraltar");
+  static const cmr = Country(code: 'cmr', countryCode: 'CM', fullName: "Cameroon");
+  static const atg = Country(code: 'atg', countryCode: 'AG', fullName: "Antigua and Barbuda");
+  static const slv = Country(code: 'slv', countryCode: 'SV', fullName: "El Salvador");
+  static const pyf = Country(code: 'pyf', countryCode: 'PF', fullName: "French Polynesia");
+  static const iot =
+      Country(code: 'iot', countryCode: 'IO', fullName: "British Indian Ocean Territory");
+  static const vir = Country(code: 'vir', countryCode: 'VI', fullName: "Virgin Islands (U.S.)");
+  static const abw = Country(code: 'abw', countryCode: 'AW', fullName: "Aruba");
+  static const ago = Country(code: 'ago', countryCode: 'AO', fullName: "Angola");
+  static const afg = Country(code: 'afg', countryCode: 'AF', fullName: "Afghanistan");
+  static const lbn = Country(code: 'lbn', countryCode: 'LB', fullName: "Lebanon");
+  static const hmd =
+      Country(code: 'hmd', countryCode: 'HM', fullName: "Heard Island and McDonald Islands");
+  static const cok = Country(code: 'cok', countryCode: 'CK', fullName: "Cook Islands");
+  static const bvt = Country(code: 'bvt', countryCode: 'BV', fullName: "Bouvet Island");
+  static const atf =
+      Country(code: 'atf', countryCode: 'TF', fullName: "French Southern Territories");
+  static const eth = Country(code: 'eth', countryCode: 'ET', fullName: "Ethiopia");
+  static const plw = Country(code: 'plw', countryCode: 'PW', fullName: "Palau");
+  static const ata = Country(code: 'ata', countryCode: 'AQ', fullName: "Antarctica");
+
+  static final _all = {
+    Country.afghanistan.raw: Country.afghanistan,
+    Country.andorra.raw: Country.andorra,
+    Country.angola.raw: Country.angola,
+    Country.anguilla.raw: Country.anguilla,
+    Country.antigua_and_barbuda.raw: Country.antigua_and_barbuda,
+    Country.are.raw: Country.are,
+    Country.arg.raw: Country.arg,
+    Country.arm.raw: Country.arm,
+    Country.aruba.raw: Country.aruba,
+    Country.aus.raw: Country.aus,
+    Country.aut.raw: Country.aut,
+    Country.aze.raw: Country.aze,
+    Country.belize.raw: Country.belize,
+    Country.bfa.raw: Country.bfa,
+    Country.bel.raw: Country.bel,
+    Country.bgd.raw: Country.bgd,
+    Country.bhr.raw: Country.bhr,
+    Country.bhs.raw: Country.bhs,
+    Country.bhutan.raw: Country.bhutan,
+    Country.bol.raw: Country.bol,
+    Country.bra.raw: Country.bra,
+    Country.brn.raw: Country.brn,
+    Country.bwa.raw: Country.bwa,
+    Country.cad.raw: Country.cad,
+    Country.che.raw: Country.che,
+    Country.chl.raw: Country.chl,
+    Country.chn.raw: Country.chn,
+    Country.col.raw: Country.col,
+    Country.cri.raw: Country.cri,
+    Country.cyp.raw: Country.cyp,
+    Country.czk.raw: Country.czk,
+    Country.deu.raw: Country.deu,
+    Country.dji.raw: Country.dji,
+    Country.dnk.raw: Country.dnk,
+    Country.dza.raw: Country.dza,
+    Country.ecu.raw: Country.ecu,
+    Country.egy.raw: Country.egy,
+    Country.esp.raw: Country.esp,
+    Country.est.raw: Country.est,
+    Country.eur.raw: Country.eur,
+    Country.fin.raw: Country.fin,
+    Country.fji.raw: Country.fji,
+    Country.flk.raw: Country.flk,
+    Country.fra.raw: Country.fra,
+    Country.fsm.raw: Country.fsm,
+    Country.gab.raw: Country.gab,
+    Country.gbr.raw: Country.gbr,
+    Country.geo.raw: Country.geo,
+    Country.gha.raw: Country.gha,
+    Country.grc.raw: Country.grc,
+    Country.grd.raw: Country.grd,
+    Country.grl.raw: Country.grl,
+    Country.gtm.raw: Country.gtm,
+    Country.guy.raw: Country.guy,
+    Country.hkg.raw: Country.hkg,
+    Country.hrv.raw: Country.hrv,
+    Country.hun.raw: Country.hun,
+    Country.idn.raw: Country.idn,
+    Country.ind.raw: Country.ind,
+    Country.irl.raw: Country.irl,
+    Country.irn.raw: Country.irn,
+    Country.isl.raw: Country.isl,
+    Country.isr.raw: Country.isr,
+    Country.ita.raw: Country.ita,
+    Country.jam.raw: Country.jam,
+    Country.jor.raw: Country.jor,
+    Country.jpn.raw: Country.jpn,
+    Country.kaz.raw: Country.kaz,
+    Country.ken.raw: Country.ken,
+    Country.kir.raw: Country.kir,
+    Country.kor.raw: Country.kor,
+    Country.kwt.raw: Country.kwt,
+    Country.lie.raw: Country.lie,
+    Country.lka.raw: Country.lka,
+    Country.ltu.raw: Country.ltu,
+    Country.lux.raw: Country.lux,
+    Country.lva.raw: Country.lva,
+    Country.mar.raw: Country.mar,
+    Country.mex.raw: Country.mex,
+    Country.mlt.raw: Country.mlt,
+    Country.mnp.raw: Country.mnp,
+    Country.mtq.raw: Country.mtq,
+    Country.mys.raw: Country.mys,
+    Country.mwi.raw: Country.mwi,
+    Country.nga.raw: Country.nga,
+    Country.niu.raw: Country.niu,
+    Country.nld.raw: Country.nld,
+    Country.nor.raw: Country.nor,
+    Country.nzl.raw: Country.nzl,
+    Country.omn.raw: Country.omn,
+    Country.pak.raw: Country.pak,
+    Country.per.raw: Country.per,
+    Country.phl.raw: Country.phl,
+    Country.pol.raw: Country.pol,
+    Country.pri.raw: Country.pri,
+    Country.prt.raw: Country.prt,
+    Country.qat.raw: Country.qat,
+    Country.rou.raw: Country.rou,
+    Country.rus.raw: Country.rus,
+    Country.saf.raw: Country.saf,
+    Country.sau.raw: Country.sau,
+    Country.sgp.raw: Country.sgp,
+    Country.slb.raw: Country.slb,
+    Country.svk.raw: Country.svk,
+    Country.svn.raw: Country.svn,
+    Country.swe.raw: Country.swe,
+    Country.tha.raw: Country.tha,
+    Country.tkm.raw: Country.tkm,
+    Country.ton.raw: Country.ton,
+    Country.tur.raw: Country.tur,
+    Country.tuv.raw: Country.tuv,
+    Country.twn.raw: Country.twn,
+    Country.ukr.raw: Country.ukr,
+    Country.ury.raw: Country.ury,
+    Country.usa.raw: Country.usa,
+    Country.ven.raw: Country.ven,
+    Country.vnm.raw: Country.vnm,
+    Country.vut.raw: Country.vut,
+    Country.btn.raw: Country.btn,
+    Country.bgr.raw: Country.bgr,
+    Country.guf.raw: Country.guf,
+    Country.bes.raw: Country.bes,
+    Country.fro.raw: Country.fro,
+    Country.cuw.raw: Country.cuw,
+    Country.msr.raw: Country.msr,
+    Country.cpv.raw: Country.cpv,
+    Country.nfk.raw: Country.nfk,
+    Country.bmu.raw: Country.bmu,
+    Country.vat.raw: Country.vat,
+    Country.aia.raw: Country.aia,
+    Country.gum.raw: Country.gum,
+    Country.myt.raw: Country.myt,
+    Country.mrt.raw: Country.mrt,
+    Country.ggy.raw: Country.ggy,
+    Country.cck.raw: Country.cck,
+    Country.blz.raw: Country.blz,
+    Country.cxr.raw: Country.cxr,
+    Country.mco.raw: Country.mco,
+    Country.ner.raw: Country.ner,
+    Country.jey.raw: Country.jey,
+    Country.asm.raw: Country.asm,
+    Country.gmb.raw: Country.gmb,
+    Country.dma.raw: Country.dma,
+    Country.glp.raw: Country.glp,
+    Country.ggi.raw: Country.ggi,
+    Country.cmr.raw: Country.cmr,
+    Country.atg.raw: Country.atg,
+    Country.slv.raw: Country.slv,
+    Country.pyf.raw: Country.pyf,
+    Country.iot.raw: Country.iot,
+    Country.vir.raw: Country.vir,
+    Country.abw.raw: Country.abw,
+    Country.ago.raw: Country.ago,
+    Country.afg.raw: Country.afg,
+    Country.lbn.raw: Country.lbn,
+    Country.hmd.raw: Country.hmd,
+    Country.cok.raw: Country.cok,
+    Country.bvt.raw: Country.bvt,
+    Country.atf.raw: Country.atf,
+    Country.eth.raw: Country.eth,
+    Country.plw.raw: Country.plw,
+    Country.ata.raw: Country.ata,
+  };
+
+  static final Map<String, String> _cakePayNames = {
+    'Slovak Republic': 'Slovakia',
+    'Brunei Darussalam': 'Brunei',
+    'Federated States of Micronesia': 'Micronesia',
+    'Sri lanka': 'Sri Lanka',
+    'UAE': 'United Arab Emirates',
+    'UK': 'United Kingdom',
+    'Curaçao': "Curacao",
+  };
+
+  static Country deserialize({required String raw}) => _all[raw]!;
+
+  static final Map<String, Country> countryByName = {
+    for (var country in _all.values) country.fullName: country,
+  };
+
+  static Country? fromCakePayName(String name) {
+    final normalizedName = _cakePayNames[name] ?? name;
+    return countryByName[normalizedName];
+  }
+
+  static String getCakePayName(Country country) {
+    return _cakePayNames.entries
+        .firstWhere(
+          (entry) => entry.value == country.fullName,
+          orElse: () => MapEntry(country.fullName, country.fullName),
+        )
+        .key;
+  }
+
+  static Country? fromCode(String countryCode) {
+    return _all.values.firstWhereOrNull((element) => element.raw == countryCode.toLowerCase());
+  }
+
+  @override
+  bool operator ==(Object other) => other is Country && other.raw == raw;
+
+  @override
+  int get hashCode => raw.hashCode ^ title.hashCode;
+
+  String get iconPath => "assets/images/flags/$raw.png";
+}

lib/entities/preferences_key.dart

@@ -12,6 +12,7 @@ class PreferencesKey {
   static const currentBananoNodeIdKey = 'current_node_id_banano';
   static const currentBananoPowNodeIdKey = 'current_node_id_banano_pow';
   static const currentFiatCurrencyKey = 'current_fiat_currency';
+  static const currentCakePayCountry = 'current_cake_pay_country';
   static const currentBitcoinCashNodeIdKey = 'current_node_id_bch';
   static const currentSolanaNodeIdKey = 'current_node_id_sol';
   static const currentTronNodeIdKey = 'current_node_id_trx';

lib/src/screens/cake_pay/cards/cake_pay_cards_page.dart

@@ -1,5 +1,6 @@
 import 'package:cake_wallet/cake_pay/cake_pay_states.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_vendor.dart';
+import 'package:cake_wallet/entities/country.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/routes.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
@@ -8,6 +9,7 @@ import 'package:cake_wallet/src/screens/cake_pay/widgets/card_menu.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/filter_widget.dart';
 import 'package:cake_wallet/src/widgets/cake_scrollbar.dart';
 import 'package:cake_wallet/src/widgets/gradient_background.dart';
+import 'package:cake_wallet/src/widgets/picker.dart';
 import 'package:cake_wallet/themes/extensions/balance_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/dashboard_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/exchange_page_theme.dart';
@@ -20,6 +22,7 @@ import 'package:cake_wallet/utils/show_pop_up.dart';
 import 'package:cake_wallet/view_model/cake_pay/cake_pay_cards_list_view_model.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
+import 'package:mobx/mobx.dart';
 
 class CakePayCardsPage extends BasePage {
   CakePayCardsPage(this._cardsListViewModel) : searchFocusNode = FocusNode() {
@@ -80,9 +83,25 @@ class CakePayCardsPage extends BasePage {
 
   @override
   Widget body(BuildContext context) {
+
+    if (_cardsListViewModel.settingsStore.selectedCakePayCountry == null) {
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      reaction((_) => _cardsListViewModel.shouldShowCountryPicker, (bool shouldShowCountryPicker) async {
+        if (shouldShowCountryPicker) {
+          _cardsListViewModel.storeInitialFilterStates();
+          await showCountryPicker(context, _cardsListViewModel);
+          if (_cardsListViewModel.hasFiltersChanged) {
+            _cardsListViewModel.resetLoadingNextPageState();
+            _cardsListViewModel.getVendors();
+          }
+        }
+      });
+    });
+    }
+
     final filterButton = Semantics(
       label: S.of(context).filter_by,
-      child: InkWell(
+      child: GestureDetector(
           onTap: () async {
             _cardsListViewModel.storeInitialFilterStates();
             await showFilterWidget(context);
@@ -92,50 +111,87 @@ class CakePayCardsPage extends BasePage {
             }
           },
           child: Container(
-            width: 32,
-            padding: EdgeInsets.all(8),
-            decoration: BoxDecoration(
-              color: Theme.of(context).extension<SyncIndicatorTheme>()!.syncedBackgroundColor,
-              border: Border.all(
-                color: Colors.white.withOpacity(0.2),
+              width: 32,
+              padding: EdgeInsets.all(8),
+              decoration: BoxDecoration(
+                color: Theme.of(context).extension<SyncIndicatorTheme>()!.syncedBackgroundColor,
+                border: Border.all(
+                  color: Colors.transparent,
+                ),
+                borderRadius: BorderRadius.circular(10),
               ),
-              borderRadius: BorderRadius.circular(10),
+              child: Image.asset(
+                'assets/images/filter.png',
+                color: Theme.of(context).extension<FilterTheme>()!.iconColor,
+              ))),
+    );
+    final _countryPicker = Semantics(
+      label: S.of(context).filter_by,
+      child: GestureDetector(
+        onTap: () async {
+          _cardsListViewModel.storeInitialFilterStates();
+          await showCountryPicker(context, _cardsListViewModel);
+          if (_cardsListViewModel.hasFiltersChanged) {
+            _cardsListViewModel.resetLoadingNextPageState();
+            _cardsListViewModel.getVendors();
+          }
+        },
+        child: Container(
+          padding: EdgeInsets.symmetric(horizontal: 6),
+          decoration: BoxDecoration(
+            color: Theme.of(context).extension<SyncIndicatorTheme>()!.syncedBackgroundColor,
+            border: Border.all(color: Colors.transparent),
+            borderRadius: BorderRadius.circular(10),
+          ),
+          child: Container(
+            margin: EdgeInsets.symmetric(vertical: 2),
+            child: Row(
+              children: [
+                Image.asset(
+                  _cardsListViewModel.selectedCountry.iconPath,
+                  width: 24,
+                  height: 24,
+                  errorBuilder: (context, error, stackTrace) => Container(
+                    width: 24,
+                    height: 24,
+                  ),
+                ),
+                SizedBox(width: 6),
+                Text(
+                  _cardsListViewModel.selectedCountry.countryCode,
+                  style: TextStyle(
+                    color: Theme.of(context).extension<DashboardPageTheme>()!.textColor,
+                    fontSize: 16,
+                    fontWeight: FontWeight.w700,
+                  ),
+                ),
+              ],
             ),
-            child: Image.asset(
-              'assets/images/filter.png',
-              color: Theme.of(context).extension<FilterTheme>()!.iconColor,
-            ),
-          )),
+          ),
+        ),
+      ),
     );
 
     return Padding(
-      padding: const EdgeInsets.all(14.0),
-      child: Column(
-        children: [
+        padding: const EdgeInsets.all(14.0),
+        child: Column(children: [
           Container(
-            padding: EdgeInsets.only(left: 2, right: 22),
-            height: 32,
-            child: Row(
-              children: [
+              padding: EdgeInsets.only(left: 2, right: 22),
+              height: 32,
+              child: Row(children: [
                 Expanded(
                     child: _SearchWidget(
                   controller: _searchController,
                   focusNode: searchFocusNode,
                 )),
-                SizedBox(width: 10),
-                filterButton
-              ],
-            ),
-          ),
+                SizedBox(width: 5),
+                filterButton,
+                SizedBox(width: 5),
+                _countryPicker
+              ])),
           SizedBox(height: 8),
-          Expanded(
-            child: CakePayCardsPageBody(
-              cardsListViewModel: _cardsListViewModel,
-            ),
-          ),
-        ],
-      ),
-    );
+          Expanded(child: CakePayCardsPageBody(cardsListViewModel: _cardsListViewModel))
+        ]));
   }
 
   Future<void> showFilterWidget(BuildContext context) async {
@@ -148,6 +204,32 @@ class CakePayCardsPage extends BasePage {
   }
 }
 
+
+Future<void> showCountryPicker(BuildContext context, CakePayCardsListViewModel cardsListViewModel) async {
+  await showPopUp<void>(
+      context: context,
+      builder: (_) => Picker(
+        title: S.of(context).select_your_country,
+          items: cardsListViewModel.availableCountries,
+          images: cardsListViewModel.availableCountries
+              .map((e) => Image.asset(
+            e.iconPath,
+            errorBuilder: (context, error, stackTrace) => Container(
+              width: 58,
+              height: 58,
+            ),
+          ))
+              .toList(),
+          selectedAtIndex: cardsListViewModel.availableCountries
+              .indexOf(cardsListViewModel.selectedCountry),
+          onItemSelected: (Country country) =>
+              cardsListViewModel.setSelectedCountry(country),
+          isSeparated: false,
+          hintText: S.of(context).search,
+          matchingCriteria: (Country country, String searchText) =>
+              country.fullName.toLowerCase().contains(searchText.toLowerCase())));
+}
+
 class CakePayCardsPageBody extends StatefulWidget {
   const CakePayCardsPageBody({
     Key? key,
@@ -304,15 +386,9 @@ class _SearchWidget extends StatelessWidget {
           alignLabelWithHint: true,
           floatingLabelBehavior: FloatingLabelBehavior.never,
           suffixIcon: searchIcon,
-          border: OutlineInputBorder(
-            borderSide: BorderSide(
-              color: Colors.white.withOpacity(0.2),
-            ),
-            borderRadius: BorderRadius.circular(10),
-          ),
           enabledBorder: OutlineInputBorder(
             borderSide: BorderSide(
-              color: Colors.white.withOpacity(0.2),
+              color: Colors.transparent,
             ),
             borderRadius: BorderRadius.circular(10),
           ),

lib/src/screens/cake_pay/widgets/card_item.dart

@@ -9,7 +9,7 @@ class CardItem extends StatelessWidget {
     required this.backgroundColor,
     required this.titleColor,
     required this.subtitleColor,
-    this.hideBorder = false,
+    this.hideBorder = true,
     this.discount = 0.0,
     this.isAmount = false,
     this.discountBackground,

lib/store/settings_store.dart

@@ -9,6 +9,7 @@ import 'package:cake_wallet/entities/auto_generate_subaddress_status.dart';
 import 'package:cake_wallet/entities/background_tasks.dart';
 import 'package:cake_wallet/entities/balance_display_mode.dart';
 import 'package:cake_wallet/entities/cake_2fa_preset_options.dart';
+import 'package:cake_wallet/entities/country.dart';
 import 'package:cake_wallet/entities/exchange_api_mode.dart';
 import 'package:cake_wallet/entities/fiat_api_mode.dart';
 import 'package:cake_wallet/entities/fiat_currency.dart';
@@ -128,7 +129,8 @@ abstract class SettingsStoreBase with Store {
       TransactionPriority? initialLitecoinTransactionPriority,
       TransactionPriority? initialEthereumTransactionPriority,
       TransactionPriority? initialPolygonTransactionPriority,
-      TransactionPriority? initialBitcoinCashTransactionPriority})
+      TransactionPriority? initialBitcoinCashTransactionPriority,
+      Country? initialCakePayCountry})
       : nodes = ObservableMap<WalletType, Node>.of(nodes),
         powNodes = ObservableMap<WalletType, Node>.of(powNodes),
         _secureStorage = secureStorage,
@@ -213,6 +215,10 @@ abstract class SettingsStoreBase with Store {
       priority[WalletType.bitcoinCash] = initialBitcoinCashTransactionPriority;
     }
 
+    if (initialCakePayCountry != null) {
+      selectedCakePayCountry = initialCakePayCountry;
+    }
+
     initializeTrocadorProviderStates();
 
     WalletType.values.forEach((walletType) {
@@ -244,6 +250,15 @@ abstract class SettingsStoreBase with Store {
         (FiatCurrency fiatCurrency) => sharedPreferences.setString(
             PreferencesKey.currentFiatCurrencyKey, fiatCurrency.serialize()));
 
+    reaction(
+            (_) => selectedCakePayCountry,
+            (Country? country) {
+              if (country != null) {
+                sharedPreferences.setString(
+                    PreferencesKey.currentCakePayCountry, country.raw);
+              }
+            });
+
     reaction(
         (_) => shouldShowYatPopup,
         (bool shouldShowYatPopup) =>
@@ -625,6 +640,9 @@ abstract class SettingsStoreBase with Store {
   @observable
   FiatCurrency fiatCurrency;
 
+  @observable
+  Country? selectedCakePayCountry;
+
   @observable
   bool shouldShowYatPopup;
 
@@ -880,6 +898,10 @@ abstract class SettingsStoreBase with Store {
     final backgroundTasks = getIt.get<BackgroundTasks>();
     final currentFiatCurrency = FiatCurrency.deserialize(
         raw: sharedPreferences.getString(PreferencesKey.currentFiatCurrencyKey)!);
+    final savedCakePayCountryRaw = sharedPreferences.getString(PreferencesKey.currentCakePayCountry);
+    final currentCakePayCountry = savedCakePayCountryRaw != null
+        ? Country.deserialize(raw: savedCakePayCountryRaw)
+        : null;
 
     TransactionPriority? moneroTransactionPriority = monero?.deserializeMoneroTransactionPriority(
         raw: sharedPreferences.getInt(PreferencesKey.moneroTransactionPriority)!);
@@ -1225,6 +1247,7 @@ abstract class SettingsStoreBase with Store {
       deviceName: deviceName,
       isBitcoinBuyEnabled: isBitcoinBuyEnabled,
       initialFiatCurrency: currentFiatCurrency,
+      initialCakePayCountry: currentCakePayCountry,
       initialBalanceDisplayMode: currentBalanceDisplayMode,
       initialSaveRecipientAddress: shouldSaveRecipientAddress,
       initialAutoGenerateSubaddressStatus: autoGenerateSubaddressStatus,

lib/view_model/cake_pay/cake_pay_cards_list_view_model.dart

@@ -1,8 +1,10 @@
 import 'package:cake_wallet/cake_pay/cake_pay_service.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_states.dart';
 import 'package:cake_wallet/cake_pay/cake_pay_vendor.dart';
+import 'package:cake_wallet/entities/country.dart';
+import 'package:cake_wallet/entities/fiat_currency.dart';
 import 'package:cake_wallet/generated/i18n.dart';
-import 'package:cake_wallet/view_model/dashboard/dropdown_filter_item.dart';
+import 'package:cake_wallet/store/settings_store.dart';
 import 'package:cake_wallet/view_model/dashboard/filter_item.dart';
 import 'package:mobx/mobx.dart';
 
@@ -13,11 +15,11 @@ class CakePayCardsListViewModel = CakePayCardsListViewModelBase with _$CakePayCa
 abstract class CakePayCardsListViewModelBase with Store {
   CakePayCardsListViewModelBase({
     required this.cakePayService,
+    required this.settingsStore,
   })  : cardState = CakePayCardsStateNoCards(),
         cakePayVendors = [],
         availableCountries = [],
         page = 1,
-        selectedCountry = 'USA',
         displayPrepaidCards = true,
         displayGiftCards = true,
         displayDenominationsCards = true,
@@ -30,13 +32,20 @@ abstract class CakePayCardsListViewModelBase with Store {
     initialization();
   }
 
+  static Country _getInitialCountry(FiatCurrency fiatCurrency) {
+    if (fiatCurrency.countryCode == 'eur') {
+      return Country.deu;
+    }
+    return Country.fromCode(fiatCurrency.countryCode) ?? Country.usa;
+  }
+
   void initialization() async {
     await getCountries();
-    selectedCountry = availableCountries.first;
     getVendors();
   }
 
   final CakePayService cakePayService;
+  final SettingsStore settingsStore;
 
   List<CakePayVendor> CakePayVendorList;
 
@@ -61,28 +70,15 @@ abstract class CakePayCardsListViewModelBase with Store {
               caption: S.current.custom_value,
               onChanged: toggleCustomValueCards),
         ],
-        S.current.countries: [
-          DropdownFilterItem(
-            items: availableCountries,
-            caption: '',
-            selectedItem: selectedCountry,
-            onItemSelected: (String value) => setSelectedCountry(value),
-          ),
-        ]
       };
 
   String searchString;
-
   int page;
 
-  late String _initialSelectedCountry;
-
+  late Country _initialSelectedCountry;
   late bool _initialDisplayPrepaidCards;
-
   late bool _initialDisplayGiftCards;
-
   late bool _initialDisplayDenominationsCards;
-
   late bool _initialDisplayCustomValueCards;
 
   @observable
@@ -107,7 +103,7 @@ abstract class CakePayCardsListViewModelBase with Store {
   List<CakePayVendor> cakePayVendors;
 
   @observable
-  List<String> availableCountries;
+  List<Country> availableCountries;
 
   @observable
   bool displayPrepaidCards;
@@ -121,15 +117,22 @@ abstract class CakePayCardsListViewModelBase with Store {
   @observable
   bool displayCustomValueCards;
 
-  @observable
-  String selectedCountry;
+  @computed
+  Country get selectedCountry =>
+      settingsStore.selectedCakePayCountry ?? _getInitialCountry(settingsStore.fiatCurrency);
+
+  @computed
+  bool get shouldShowCountryPicker => settingsStore.selectedCakePayCountry == null && availableCountries.isNotEmpty;
+
+
+  bool get hasFiltersChanged {
+    return selectedCountry != _initialSelectedCountry ||
+        displayPrepaidCards != _initialDisplayPrepaidCards ||
+        displayGiftCards != _initialDisplayGiftCards ||
+        displayDenominationsCards != _initialDisplayDenominationsCards ||
+        displayCustomValueCards != _initialDisplayCustomValueCards;
+  }
 
-  bool get hasFiltersChanged =>
-      selectedCountry != _initialSelectedCountry ||
-      displayPrepaidCards != _initialDisplayPrepaidCards ||
-      displayGiftCards != _initialDisplayGiftCards ||
-      displayDenominationsCards != _initialDisplayDenominationsCards ||
-      displayCustomValueCards != _initialDisplayCustomValueCards;
 
   Future<void> getCountries() async {
     availableCountries = await cakePayService.getCountries();
@@ -143,7 +146,7 @@ abstract class CakePayCardsListViewModelBase with Store {
     vendorsState = CakePayVendorLoadingState();
     searchString = text ?? '';
     var newVendors = await cakePayService.getVendors(
-        country: selectedCountry,
+        country: Country.getCakePayName(selectedCountry),
         page: currentPage ?? page,
         search: searchString,
         giftCards: displayGiftCards,
@@ -152,20 +155,20 @@ abstract class CakePayCardsListViewModelBase with Store {
         onDemand: displayDenominationsCards);
 
     cakePayVendors = CakePayVendorList = newVendors;
-
     vendorsState = CakePayVendorLoadedState();
   }
 
   @action
   Future<void> fetchNextPage() async {
-    if (vendorsState is CakePayVendorLoadingState || !hasMoreDataToFetch || isLoadingNextPage)
+    if (vendorsState is CakePayVendorLoadingState || !hasMoreDataToFetch || isLoadingNextPage) {
       return;
+    }
 
     isLoadingNextPage = true;
     page++;
     try {
       var newVendors = await cakePayService.getVendors(
-          country: selectedCountry,
+          country: Country.getCakePayName(selectedCountry),
           page: page,
           search: searchString,
           giftCards: displayGiftCards,
@@ -201,7 +204,7 @@ abstract class CakePayCardsListViewModelBase with Store {
   }
 
   @action
-  void setSelectedCountry(String country) => selectedCountry = country;
+  void setSelectedCountry(Country country) => settingsStore.selectedCakePayCountry = country;
 
   @action
   void togglePrepaidCards() => displayPrepaidCards = !displayPrepaidCards;