status-im/safe-react
2
0
Fork 0
mirror of https://github.com/status-im/safe-react.git synced 2025-01-27 18:04:52 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1745 from gnosis/fix/balance-table-sort

Browse Source 
Fix - Value column not sortable in Assets list
This commit is contained in:
Mati Dastugue 2021-01-05 15:45:02 -03:00 committed by GitHub
commit b7fb6033eb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
src/routes/safe/components/Balances/dataFetcher.ts
View File

@ -13,15 +13,7 @@ export const BALANCE_TABLE_VALUE_ID = 'value'
const { nativeCoin } = getNetworkInfo()
const getTokenPriceInCurrency = (
token: Token,
currencySelected?: string,
currencyValues?: BalanceCurrencyList,
currencyRate?: number,
): string => {
if (!currencySelected) {
return ''
}
const getTokenValue = (token: Token, currencyValues?: BalanceCurrencyList, currencyRate?: number): string => {
const currencyValue = currencyValues?.find(({ tokenAddress }) => {
if (token.address === nativeCoin.address && !tokenAddress) {
return true
@ -35,9 +27,16 @@ const getTokenPriceInCurrency = (
}
const { balanceInBaseCurrency } = currencyValue
const balance = new BigNumber(balanceInBaseCurrency).times(currencyRate).toFixed(2)
const balance = new BigNumber(balanceInBaseCurrency).times(currencyRate).toString()
return `${formatAmountInUsFormat(balance)} ${currencySelected}`
return balance
}
const getTokenPriceInCurrency = (balance: string, currencySelected?: string): string => {
if (!currencySelected) {
return Number('').toFixed(2)
}
return `${formatAmountInUsFormat(Number(balance).toFixed(2))} ${currencySelected}`
}
export interface BalanceData {
@ -47,6 +46,7 @@ export interface BalanceData {
balanceOrder: number
fixed: boolean
value: string
valueOrder: number
}
export const getBalanceData = (
@ -56,19 +56,23 @@ export const getBalanceData = (
currencyRate?: number,
): List<BalanceData> => {
const { nativeCoin } = getNetworkInfo()
return activeTokens.map((token) => ({
[BALANCE_TABLE_ASSET_ID]: {
name: token.name,
logoUri: token.logoUri,
address: token.address,
symbol: token.symbol,
},
assetOrder: token.name,
[BALANCE_TABLE_BALANCE_ID]: `${formatAmountInUsFormat(token.balance?.toString() || '0')} ${token.symbol}`,
balanceOrder: Number(token.balance),
[FIXED]: token.symbol === nativeCoin.symbol,
[BALANCE_TABLE_VALUE_ID]: getTokenPriceInCurrency(token, currencySelected, currencyValues, currencyRate),
}))
return activeTokens.map((token) => {
const balance = getTokenValue(token, currencyValues, currencyRate)
return {
[BALANCE_TABLE_ASSET_ID]: {
name: token.name,
logoUri: token.logoUri,
address: token.address,
symbol: token.symbol,
},
assetOrder: token.name,
[BALANCE_TABLE_BALANCE_ID]: `${formatAmountInUsFormat(token.balance?.toString() || '0')} ${token.symbol}`,
balanceOrder: Number(token.balance),
[FIXED]: token.symbol === nativeCoin.symbol,
[BALANCE_TABLE_VALUE_ID]: getTokenPriceInCurrency(balance, currencySelected),
valueOrder: Number(balance),
}
})
}
export const generateColumns = (): List<TableColumn> => {
@ -101,21 +105,10 @@ export const generateColumns = (): List<TableColumn> => {
const value: TableColumn = {
id: BALANCE_TABLE_VALUE_ID,
order: false,
order: true,
label: 'Value',
custom: false,
static: true,
disablePadding: false,
style: {
fontSize: '11px',
color: '#5d6d74',
borderBottomWidth: '2px',
width: '125px',
fontFamily: 'Averta',
fontWeight: 'normal',
fontStyle: 'normal',
textAlign: 'right',
},
}
return List([assetColumn, balanceColumn, value, actions])