Skip to content

Commit

Permalink
Merge pull request #821 from alexstotsky/refactor-ledgers-earns-configs
Browse files Browse the repository at this point in the history 
(improvements) Ledgers and earnings sections
  • Loading branch information
@ezewer
ezewer authored Jun 12, 2024
2 parents ec7896d + 00e1cf9 commit 97d5f16
Show file tree
Hide file tree
Showing 6 changed files with 120 additions and 195 deletions.
4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion src/components/AffiliatesEarnings/AffiliatesEarnings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
toggleSymbol,
clearAllSymbols,
} from 'state/utils'
import getColumns from 'components/Ledgers/Ledgers.columns'
import { getColumns } from 'components/Ledgers/Ledgers.columns'

import AffiliatesLink from './AffiliatesEarnings.link'

Expand Down
2 changes: 1 addition & 1 deletion src/components/FundingPayment/FundingPayment.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import {
clearAllSymbols,
} from 'state/utils'

import getColumns from 'components/Ledgers/Ledgers.columns'
import { getColumns } from 'components/Ledgers/Ledgers.columns'

const TYPE = queryConstants.MENU_FPAYMENT

Expand Down
303 changes: 114 additions & 189 deletions src/components/Ledgers/Ledgers.columns.js
View file
Original file line number Diff line number Diff line change
@@ -1,210 +1,135 @@
import React from 'react'
import { Cell } from '@blueprintjs/table'
import { isEqual } from '@bitfinex/lib-js-util-base'

import { insertIf, fixedFloat, formatAmount } from 'ui/utils'
import queryConstants from 'state/query/constants'
import config from 'config'
import { getCellState, getColumnWidth, getTooltipContent } from 'utils/columns'

import queryConstants from 'state/query/constants'
import { insertIf, fixedFloat, formatAmount } from 'ui/utils'
import { getCell, getCellState, getColumnWidth } from 'utils/columns'

export default function getColumns(props) {
const {
t,
target,
isNoData,
isLoading,
timeOffset,
getFullTime,
filteredData,
columnsWidth,
} = props
const { showFrameworkMode } = config
const { MENU_FPAYMENT } = queryConstants

return [
{
id: 'id',
name: 'column.id',
className: 'align-left',
width: getColumnWidth('id', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { id } = filteredData[rowIndex]
return (
<Cell tooltip={getTooltipContent(id, t)}>
{id}
</Cell>
)
},
copyText: rowIndex => filteredData[rowIndex].id,
export const getColumns = ({
t,
target,
isNoData,
isLoading,
timeOffset,
getFullTime,
filteredData,
columnsWidth,
}) => [
{
id: 'id',
name: 'column.id',
className: 'align-left',
width: getColumnWidth('id', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { id } = filteredData[rowIndex]
return getCell(id, t)
},
...insertIf(target !== queryConstants.MENU_FPAYMENT, (
{
id: 'description',
name: 'column.description',
className: 'align-left',
width: getColumnWidth('description', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { description } = filteredData[rowIndex]
return (
<Cell tooltip={getTooltipContent(description, t)}>
{description}
</Cell>
)
},
copyText: rowIndex => filteredData[rowIndex].description,
}
)),
copyText: rowIndex => filteredData[rowIndex].id,
},
...insertIf(!isEqual(target, MENU_FPAYMENT), (
{
id: 'currency',
name: 'column.currency',
id: 'description',
name: 'column.description',
className: 'align-left',
width: getColumnWidth('currency', columnsWidth),
width: getColumnWidth('description', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { currency } = filteredData[rowIndex]
return (
<Cell tooltip={getTooltipContent(currency, t)}>
{currency}
</Cell>
)
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { description } = filteredData[rowIndex]
return getCell(description, t)
},
copyText: rowIndex => filteredData[rowIndex].currency,
copyText: rowIndex => filteredData[rowIndex].description,
}
)),
{
id: 'currency',
name: 'column.currency',
className: 'align-left',
width: getColumnWidth('currency', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { currency } = filteredData[rowIndex]
return getCell(currency, t)
},
{
id: 'amount',
name: 'column.amount',
width: getColumnWidth('amount', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { amount, currency } = filteredData[rowIndex]
const tooltip = getTooltipContent(`${fixedFloat(amount)} ${currency}`, t)
return (
<Cell
className='bitfinex-text-align-right'
tooltip={tooltip}
>
{formatAmount(amount)}
</Cell>
)
},
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].amount),
copyText: rowIndex => filteredData[rowIndex].currency,
},
{
id: 'amount',
name: 'column.amount',
width: getColumnWidth('amount', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { amount, currency } = filteredData[rowIndex]
return getCell(formatAmount(amount), t, `${fixedFloat(amount)} ${currency}`)
},
...insertIf(config.showFrameworkMode, (
{
id: 'amountUsd',
name: 'column.amountUsd',
width: getColumnWidth('amountUsd', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { amountUsd } = filteredData[rowIndex]
const tooltip = getTooltipContent(`${fixedFloat(amountUsd)} ${t('column.usd')}`, t)
return (
<Cell
className='bitfinex-text-align-right'
tooltip={tooltip}
>
{formatAmount(amountUsd)}
</Cell>
)
},
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].amountUsd),
}
)),
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].amount),
},
...insertIf(showFrameworkMode, (
{
id: 'balance',
name: 'column.balance',
width: getColumnWidth('balance', columnsWidth),
id: 'amountUsd',
name: 'column.amountUsd',
width: getColumnWidth('amountUsd', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { balance, currency } = filteredData[rowIndex]
const fixedBalance = fixedFloat(balance)
const tooltip = getTooltipContent(`${fixedBalance} ${currency}`, t)
return (
<Cell
className='bitfinex-text-align-right'
tooltip={tooltip}
>
{fixedBalance}
</Cell>
)
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { amountUsd } = filteredData[rowIndex]
return getCell(formatAmount(amountUsd), t, `${fixedFloat(amountUsd)} ${t('column.usd')}`)
},
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].balance),
copyText: rowIndex => fixedFloat(filteredData[rowIndex].amountUsd),
}
)),
{
id: 'balance',
name: 'column.balance',
width: getColumnWidth('balance', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { balance, currency } = filteredData[rowIndex]
return getCell(fixedFloat(balance), t, `${fixedFloat(balance)} ${currency}`)
},
...insertIf(config.showFrameworkMode, (
{
id: 'balanceUsd',
name: 'column.balanceUsd',
width: getColumnWidth('balanceUsd', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { balanceUsd } = filteredData[rowIndex]
const fixedBalanceUsd = fixedFloat(balanceUsd)
const tooltip = getTooltipContent(`${fixedBalanceUsd} ${t('column.usd')}`, t)
return (
<Cell
className='bitfinex-text-align-right'
tooltip={tooltip}
>
{fixedBalanceUsd}
</Cell>
)
},
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].balanceUsd),
}
)),
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].balance),
},
...insertIf(showFrameworkMode, (
{
id: 'mts',
nameStr: `${t('column.date')} (${timeOffset})`,
className: 'align-left',
width: getColumnWidth('mts', columnsWidth),
id: 'balanceUsd',
name: 'column.balanceUsd',
width: getColumnWidth('balanceUsd', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const timestamp = getFullTime(filteredData[rowIndex].mts)
return (
<Cell tooltip={getTooltipContent(timestamp, t)}>
{timestamp}
</Cell>
)
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { balanceUsd } = filteredData[rowIndex]
return getCell(fixedFloat(balanceUsd), t, `${fixedFloat(balanceUsd)} ${t('column.usd')}`)
},
copyText: rowIndex => getFullTime(filteredData[rowIndex].mts),
isNumericValue: true,
copyText: rowIndex => fixedFloat(filteredData[rowIndex].balanceUsd),
}
)),
{
id: 'mts',
nameStr: `${t('column.date')} (${timeOffset})`,
className: 'align-left',
width: getColumnWidth('mts', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const timestamp = getFullTime(filteredData[rowIndex].mts)
return getCell(timestamp, t)
},
{
id: 'wallet',
name: 'column.wallet',
className: 'align-left',
width: getColumnWidth('wallet', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) {
return getCellState(isLoading, isNoData)
}
const { wallet } = filteredData[rowIndex]
return (
<Cell tooltip={getTooltipContent(wallet, t)}>
{wallet}
</Cell>
)
},
copyText: rowIndex => filteredData[rowIndex].wallet,
copyText: rowIndex => getFullTime(filteredData[rowIndex].mts),
},
{
id: 'wallet',
name: 'column.wallet',
className: 'align-left',
width: getColumnWidth('wallet', columnsWidth),
renderer: (rowIndex) => {
if (isLoading || isNoData) return getCellState(isLoading, isNoData)
const { wallet } = filteredData[rowIndex]
return getCell(wallet, t)
},
]
}
copyText: rowIndex => filteredData[rowIndex].wallet,
},
]
2 changes: 1 addition & 1 deletion src/components/Ledgers/Ledgers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ import {
clearAllSymbols,
} from 'state/utils'

import getColumns from './Ledgers.columns'
import { getColumns } from './Ledgers.columns'

const TYPE = queryConstants.MENU_LEDGERS

Expand Down
2 changes: 1 addition & 1 deletion src/components/StakingPayments/StakingPayments.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import {
clearAllSymbols,
} from 'state/utils'

import getColumns from 'components/Ledgers/Ledgers.columns'
import { getColumns } from 'components/Ledgers/Ledgers.columns'

const TYPE = queryConstants.MENU_SPAYMENTS

Expand Down

0 comments on commit 97d5f16

Please sign in to comment.