From 77c63ebdbb60d01ec1c34d6435e4c8f350daa97b Mon Sep 17 00:00:00 2001 From: Anastasios Date: Tue, 16 Jul 2024 19:28:10 +0400 Subject: [PATCH] feat: add runes fiat balance, closes #5300 --- package.json | 2 +- pnpm-lock.yaml | 10 +++++----- src/app/components/loaders/runes-loader.tsx | 6 ++++-- .../bitcoin/runes-asset-list/runes-asset-list.tsx | 9 ++++++++- 4 files changed, 18 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index fdf80d677c2..dc67061cd87 100644 --- a/package.json +++ b/package.json @@ -138,7 +138,7 @@ "@leather.io/constants": "0.8.1", "@leather.io/crypto": "1.0.3", "@leather.io/models": "0.10.1", - "@leather.io/query": "0.10.2", + "@leather.io/query": "0.11.1", "@leather.io/tokens": "0.6.1", "@leather.io/ui": "1.6.3", "@leather.io/utils": "0.10.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 334a3df9bcb..75e6c104d2d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -45,8 +45,8 @@ importers: specifier: 0.10.1 version: 0.10.1 '@leather.io/query': - specifier: 0.10.2 - version: 0.10.2(@stacks/network@6.13.0(encoding@0.1.13))(encoding@0.1.13)(react@18.3.1) + specifier: 0.11.1 + version: 0.11.1(@stacks/network@6.13.0(encoding@0.1.13))(encoding@0.1.13)(react@18.3.1) '@leather.io/tokens': specifier: 0.6.1 version: 0.6.1 @@ -2898,8 +2898,8 @@ packages: '@leather.io/prettier-config@0.5.0': resolution: {integrity: sha512-Pul+4MAyBKnQvqgcKJLbZl4DHnS4kCJzSuaYFW6cfHdre7BFn/iY6Er/Dvm9F8g7VMtkdYu68jEYxQ1Xc7A0KQ==} - '@leather.io/query@0.10.2': - resolution: {integrity: sha512-Fikei979AsZkLvO1boUQkJJOlVcHf9NZvSvFnvgTlaqZA3HAwLykeNkHyrSca359jiC3Xi7Ie+wH/RcFsh11AQ==} + '@leather.io/query@0.11.1': + resolution: {integrity: sha512-lrjfKo5+70FSijrFCOgkK08K14OUy/b58lfu+IDXO2higm4Qqo1Af0+L8Jtm5CMRTbdcvRicP/+ssaAK9lGoOA==} peerDependencies: react: '*' @@ -17586,7 +17586,7 @@ snapshots: - '@vue/compiler-sfc' - supports-color - '@leather.io/query@0.10.2(@stacks/network@6.13.0(encoding@0.1.13))(encoding@0.1.13)(react@18.3.1)': + '@leather.io/query@0.11.1(@stacks/network@6.13.0(encoding@0.1.13))(encoding@0.1.13)(react@18.3.1)': dependencies: '@fungible-systems/zone-file': 2.0.0 '@hirosystems/token-metadata-api-client': 1.2.0(encoding@0.1.13) diff --git a/src/app/components/loaders/runes-loader.tsx b/src/app/components/loaders/runes-loader.tsx index 79c09d0e5d4..78f4b8cb289 100644 --- a/src/app/components/loaders/runes-loader.tsx +++ b/src/app/components/loaders/runes-loader.tsx @@ -1,9 +1,11 @@ -import type { CryptoAssetBalance, RuneCryptoAssetInfo } from '@leather.io/models'; +import type { CryptoAssetBalance, MarketData, RuneCryptoAssetInfo } from '@leather.io/models'; import { useRuneTokens } from '@leather.io/query'; interface RunesLoaderProps { addresses: string[]; - children(runes: { balance: CryptoAssetBalance; info: RuneCryptoAssetInfo }[]): React.ReactNode; + children( + runes: { balance: CryptoAssetBalance; info: RuneCryptoAssetInfo; marketData: MarketData }[] + ): React.ReactNode; } export function RunesLoader({ addresses, children }: RunesLoaderProps) { const { runes = [] } = useRuneTokens(addresses); diff --git a/src/app/features/asset-list/bitcoin/runes-asset-list/runes-asset-list.tsx b/src/app/features/asset-list/bitcoin/runes-asset-list/runes-asset-list.tsx index 6de30d00763..928296a2969 100644 --- a/src/app/features/asset-list/bitcoin/runes-asset-list/runes-asset-list.tsx +++ b/src/app/features/asset-list/bitcoin/runes-asset-list/runes-asset-list.tsx @@ -1,17 +1,20 @@ -import type { CryptoAssetBalance, RuneCryptoAssetInfo } from '@leather.io/models'; +import type { CryptoAssetBalance, MarketData, RuneCryptoAssetInfo } from '@leather.io/models'; import { RunesAvatarIcon } from '@leather.io/ui'; import { convertAmountToBaseUnit, createMoneyFromDecimal } from '@leather.io/utils'; +import { convertAssetBalanceToFiat } from '@app/common/asset-utils'; import { CryptoAssetItemLayout } from '@app/components/crypto-asset-item/crypto-asset-item.layout'; interface RuneTokenAssetDetails { balance: CryptoAssetBalance; info: RuneCryptoAssetInfo; + marketData: MarketData; } interface RunesAssetListProps { runes: RuneTokenAssetDetails[]; } + export function RunesAssetList({ runes }: RunesAssetListProps) { return runes.map((rune, i) => ( } key={`${rune.info.symbol}${i}`} titleLeft={rune.info.spacedRuneName ?? rune.info.runeName} + fiatBalance={convertAssetBalanceToFiat({ + balance: rune.balance.availableBalance, + marketData: rune.marketData, + })} /> )); }