Add coin by network

src/config/networks/local.ts

@@ -1,4 +1,4 @@
-import EtherLogo from 'src/assets/icons/icon_etherTokens.svg'
+import EtherLogo from 'src/config/assets/token_eth.svg'
 import { EnvironmentSettings, ETHEREUM_NETWORK, NetworkConfig } from 'src/config/networks/network.d'
 
 const baseConfig: EnvironmentSettings = {

src/config/networks/mainnet.ts

@@ -1,4 +1,4 @@
-import EtherLogo from 'src/assets/icons/icon_etherTokens.svg'
+import EtherLogo from 'src/config/assets/token_eth.svg'
 import { EnvironmentSettings, ETHEREUM_NETWORK, NetworkConfig } from 'src/config/networks/network.d'
 
 const baseConfig: EnvironmentSettings = {

src/config/networks/rinkeby.ts

@@ -1,4 +1,4 @@
-import EtherLogo from 'src/assets/icons/icon_etherTokens.svg'
+import EtherLogo from 'src/config/assets/token_eth.svg'
 import { EnvironmentSettings, ETHEREUM_NETWORK, NetworkConfig } from 'src/config/networks/network.d'
 
 const baseConfig: EnvironmentSettings = {

src/config/networks/xdai.ts

@@ -1,4 +1,5 @@
 import { EnvironmentSettings, ETHEREUM_NETWORK, NetworkConfig } from 'src/config/networks/network.d'
+import xDaiLogo from 'src/config/assets/token_xdai.svg'
 
 const baseConfig: EnvironmentSettings = {
   txServiceUrl: 'https://safe-transaction.xdai.gnosis.io/api/v1',
@@ -32,7 +33,7 @@ const xDai: NetworkConfig = {
       name: 'xDai',
       symbol: 'xDai',
       decimals: 18,
-      logoUri: '',
+      logoUri: xDaiLogo,
     },
   }
 }

src/logic/currencyValues/api/fetchCurrenciesRates.ts

@@ -1,29 +1,30 @@
 import axios from 'axios'
+import BigNumber from 'bignumber.js'
 
 import { EXCHANGE_RATE_URL } from 'src/utils/constants'
-import { AVAILABLE_CURRENCIES } from '../store/model/currencyValues'
 import { fetchTokenCurrenciesBalances } from './fetchTokenCurrenciesBalances'
-import BigNumber from 'bignumber.js'
+import { sameString } from 'src/utils/strings'
+import { AVAILABLE_CURRENCIES } from '../store/model/currencyValues'
 
 const fetchCurrenciesRates = async (
-  baseCurrency: AVAILABLE_CURRENCIES,
-  targetCurrencyValue: AVAILABLE_CURRENCIES,
+  baseCurrency: string,
+  targetCurrencyValue: string,
   safeAddress: string,
 ): Promise<number> => {
   let rate = 0
-
-  if (targetCurrencyValue === AVAILABLE_CURRENCIES.ETH) {
+  if (sameString(targetCurrencyValue, AVAILABLE_CURRENCIES.NETWORK)) {
     try {
       const result = await fetchTokenCurrenciesBalances(safeAddress)
       if (result?.data?.length) {
         rate = new BigNumber(1).div(result.data[0].fiatConversion).toNumber()
       }
     } catch (error) {
-      console.error('Fetching ETH data from the relayer errored', error)
+      console.error(`Fetching ${AVAILABLE_CURRENCIES.NETWORK} data from the relayer errored`, error)
     }
     return rate
   }
 
+  // National currencies
   try {
     const url = `${EXCHANGE_RATE_URL}?base=${baseCurrency}&symbols=${targetCurrencyValue}`
     const result = await axios.get(url)

src/logic/currencyValues/api/fetchTokenCurrenciesBalances.ts

@@ -2,15 +2,14 @@ import axios, { AxiosResponse } from 'axios'
 
 import { getTxServiceUrl } from 'src/config'
 import { TokenProps } from 'src/logic/tokens/store/model/token'
-import { AVAILABLE_CURRENCIES } from '../store/model/currencyValues'
 
 export type BalanceEndpoint = {
   tokenAddress: string
   token?: TokenProps
   balance: string
   fiatBalance: string
   fiatConversion: string
-  fiatCode: AVAILABLE_CURRENCIES
+  fiatCode: string
 }
 
 export const fetchTokenCurrenciesBalances = (

src/logic/currencyValues/store/actions/fetchCurrencyRate.ts

@@ -3,7 +3,7 @@ import { setCurrencyRate } from 'src/logic/currencyValues/store/actions/setCurre
 import { AVAILABLE_CURRENCIES } from 'src/logic/currencyValues/store/model/currencyValues'
 import { Dispatch } from 'redux'
 
-const fetchCurrencyRate = (safeAddress: string, selectedCurrency: AVAILABLE_CURRENCIES) => async (
+const fetchCurrencyRate = (safeAddress: string, selectedCurrency: string) => async (
   dispatch: Dispatch<typeof setCurrencyRate>,
 ): Promise<void> => {
   if (AVAILABLE_CURRENCIES.USD === selectedCurrency) {

src/logic/currencyValues/store/actions/setSelectedCurrency.ts

@@ -2,20 +2,16 @@ import { createAction } from 'redux-actions'
 import { ThunkDispatch } from 'redux-thunk'
 import { AnyAction } from 'redux'
 import { AppReduxState } from 'src/store'
-import { AVAILABLE_CURRENCIES } from '../model/currencyValues'
 import fetchCurrencyRate from 'src/logic/currencyValues/store/actions/fetchCurrencyRate'
 
 export const SET_CURRENT_CURRENCY = 'SET_CURRENT_CURRENCY'
 
-const setCurrentCurrency = createAction(
-  SET_CURRENT_CURRENCY,
-  (safeAddress: string, selectedCurrency: AVAILABLE_CURRENCIES) => ({
-    safeAddress,
-    selectedCurrency,
-  }),
-)
+const setCurrentCurrency = createAction(SET_CURRENT_CURRENCY, (safeAddress: string, selectedCurrency: string) => ({
+  safeAddress,
+  selectedCurrency,
+}))
 
-export const setSelectedCurrency = (safeAddress: string, selectedCurrency: AVAILABLE_CURRENCIES) => (
+export const setSelectedCurrency = (safeAddress: string, selectedCurrency: string) => (
   dispatch: ThunkDispatch<AppReduxState, undefined, AnyAction>,
 ): void => {
   dispatch(setCurrentCurrency(safeAddress, selectedCurrency))

src/logic/currencyValues/store/model/currencyValues.ts

@@ -1,41 +1,45 @@
 import { List, Record, RecordOf } from 'immutable'
 
-export enum AVAILABLE_CURRENCIES {
-  ETH = 'ETH',
-  USD = 'USD',
-  EUR = 'EUR',
-  AUD = 'AUD',
-  BGN = 'BGN',
-  BRL = 'BRL',
-  CAD = 'CAD',
-  CHF = 'CHF',
-  CNY = 'CNY',
-  CZK = 'CZK',
-  DKK = 'DKK',
-  GBP = 'GBP',
-  HKD = 'HKD',
-  HRK = 'HRK',
-  HUF = 'HUF',
-  IDR = 'IDR',
-  ILS = 'ILS',
-  INR = 'INR',
-  ISK = 'ISK',
-  JPY = 'JPY',
-  KRW = 'KRW',
-  MXN = 'MXN',
-  MYR = 'MYR',
-  NOK = 'NOK',
-  NZD = 'NZD',
-  PHP = 'PHP',
-  PLN = 'PLN',
-  RON = 'RON',
-  RUB = 'RUB',
-  SEK = 'SEK',
-  SGD = 'SGD',
-  THB = 'THB',
-  TRY = 'TRY',
-  ZAR = 'ZAR',
-}
+import { getNetworkInfo } from 'src/config'
+
+const { nativeCoin } = getNetworkInfo()
+
+export const AVAILABLE_CURRENCIES = {
+  NETWORK: nativeCoin.symbol.toLocaleUpperCase(),
+  USD: 'USD',
+  EUR: 'EUR',
+  AUD: 'AUD',
+  BGN: 'BGN',
+  BRL: 'BRL',
+  CAD: 'CAD',
+  CHF: 'CHF',
+  CNY: 'CNY',
+  CZK: 'CZK',
+  DKK: 'DKK',
+  GBP: 'GBP',
+  HKD: 'HKD',
+  HRK: 'HRK',
+  HUF: 'HUF',
+  IDR: 'IDR',
+  ILS: 'ILS',
+  INR: 'INR',
+  ISK: 'ISK',
+  JPY: 'JPY',
+  KRW: 'KRW',
+  MXN: 'MXN',
+  MYR: 'MYR',
+  NOK: 'NOK',
+  NZD: 'NZD',
+  PHP: 'PHP',
+  PLN: 'PLN',
+  RON: 'RON',
+  RUB: 'RUB',
+  SEK: 'SEK',
+  SGD: 'SGD',
+  THB: 'THB',
+  TRY: 'TRY',
+  ZAR: 'ZAR',
+} as const
 
 export type BalanceCurrencyRecord = {
   currencyName?: string
@@ -57,6 +61,6 @@ export type BalanceCurrencyList = List<CurrencyRateValueRecord>
 
 export interface CurrencyRateValue {
   currencyRate?: number
-  selectedCurrency?: AVAILABLE_CURRENCIES
+  selectedCurrency?: string
   currencyBalances?: BalanceCurrencyList
 }

src/logic/currencyValues/store/utils/currencyValuesStorage.ts

@@ -1,15 +1,14 @@
 import { loadFromStorage, saveToStorage } from 'src/utils/storage'
-import { AVAILABLE_CURRENCIES } from '../model/currencyValues'
 
 const SELECTED_CURRENCY_STORAGE_KEY = 'SELECTED_CURRENCY'
-export const saveSelectedCurrency = async (selectedCurrency: AVAILABLE_CURRENCIES): Promise<void> => {
+export const saveSelectedCurrency = async (selectedCurrency: string): Promise<void> => {
   try {
     await saveToStorage(SELECTED_CURRENCY_STORAGE_KEY, selectedCurrency)
   } catch (err) {
     console.error('Error storing currency values info in localstorage', err)
   }
 }
 
-export const loadSelectedCurrency = async (): Promise<AVAILABLE_CURRENCIES | undefined> => {
+export const loadSelectedCurrency = async (): Promise<string | undefined> => {
   return await loadFromStorage(SELECTED_CURRENCY_STORAGE_KEY)
 }