diff --git a/packages/features/src/common/types.ts b/packages/features/src/common/types.ts index 68f7e1ee..f3d74f1c 100644 --- a/packages/features/src/common/types.ts +++ b/packages/features/src/common/types.ts @@ -22,6 +22,7 @@ export type StructurizedTransaction = Mina.TransactionBody & { time: string minaAmount: number minaFee: number + txTotalMinaAmount: number } type StakingAccount = { diff --git a/packages/features/src/transactions/components/TxTile.tsx b/packages/features/src/transactions/components/TxTile.tsx index b8c4ec30..eef860c8 100644 --- a/packages/features/src/transactions/components/TxTile.tsx +++ b/packages/features/src/transactions/components/TxTile.tsx @@ -1,3 +1,4 @@ +import { useFiatPrice } from '@palladxyz/offchain-data' import { useNavigate } from 'react-router-dom' import { MinaIcon } from '@/common/components/MinaIcon' @@ -9,17 +10,22 @@ interface TxTileProps { tx: StructurizedTransaction } +const fiatTxValue = (amount, fiatValue) => { + if (!amount || !fiatValue) return 0 + return Number(amount) * fiatValue +} + +const getTransactionLabel = (tx) => { + if (tx.kind === TxKind.STAKE_DELEGATION) return 'Delegation' + if (tx.from === tx.to && tx.kind === TxKind.PAYMENT) return 'Sent to Self' + return tx.side === TxSide.INCOMING ? 'Received' : 'Sent' +} + export const TxTile = ({ tx }: TxTileProps) => { const navigate = useNavigate() - const getTransactionLabel = (tx: StructurizedTransaction) => { - if (tx.kind === TxKind.STAKE_DELEGATION) { - return 'Delegation' - } - if (tx.from === tx.to && tx.kind === TxKind.PAYMENT) { - return 'Sent to Self' - } - return tx.side === TxSide.INCOMING ? 'Received' : 'Sent' - } + const { data: fiatPriceData } = useFiatPrice() + const rawFiatPrice = fiatPriceData?.['mina-protocol']?.usd ?? 0 + return (
{
- {tx.minaAmount} + {tx.txTotalMinaAmount}
- {tx.minaFee} - - Fee + + {fiatTxValue(tx.txTotalMinaAmount, rawFiatPrice).toFixed(3)} + + USD
diff --git a/packages/features/src/transactions/utils/structurizeTransactions.ts b/packages/features/src/transactions/utils/structurizeTransactions.ts index d6e4206c..5c57e199 100644 --- a/packages/features/src/transactions/utils/structurizeTransactions.ts +++ b/packages/features/src/transactions/utils/structurizeTransactions.ts @@ -21,6 +21,10 @@ export const structurizeTransaction = ({ time: dayjs(tx.dateTime).format('HH:mm'), minaAmount: (Number(tx.amount) / 1_000_000_000).toFixed(3), minaFee: (Number(tx.fee) / 1_000_000_000).toFixed(3), + txTotalMinaAmount: ( + (Number(tx.amount) + Number(tx.fee)) / + 1_000_000_000 + ).toFixed(3), side: tx.from === walletPublicKey ? TxSide.OUTGOING : TxSide.INCOMING })