Skip to content

Commit e29dc54

Browse files
LibreBlocksDevLibreBlocksDev
committed
Update BRC Token Price
1 parent 9b655c4 commit e29dc54

File tree

4 files changed

+96
-33
lines changed

4 files changed

+96
-33
lines changed

‎src/hooks/api.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import type {
1515
ResponseGetProducers,
1616
ResponseGetTokens,
1717
ResponseGetBlock,
18+
ResponseOrdinalsMarketcap,
1819
} from '@/types';
1920
import * as api from '@/lib/api';
2021

@@ -100,3 +101,10 @@ export const useTokens = () => {
100101
queryFn: api.getTokens,
101102
});
102103
};
104+
105+
export const useOrdinalsMarketcap = () => {
106+
return useQuery<ResponseOrdinalsMarketcap, Error>({
107+
queryKey: ['ordinalsMarketcap'],
108+
queryFn: api.getOrdinalsMarketcap,
109+
});
110+
};

‎src/lib/api.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,3 +74,8 @@ export const getTokens = async () => {
7474
const { data } = await axios.get(`${process.env.NEXT_PUBLIC_DASHBOARD_API}/tokens`);
7575
return data;
7676
};
77+
78+
export const getOrdinalsMarketcap = async () => {
79+
const { data } = await axios.get(`https://ordinals-api.libre.org/marketcap`);
80+
return data;
81+
};

‎src/types.d.ts

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -376,3 +376,24 @@ export type ResponseGetBlock = {
376376
block_num: number;
377377
ref_block_prefix: number;
378378
};
379+
380+
export type ResponseOrdinalsMarketcap = {
381+
stats: {
382+
tradingVolume: number;
383+
libreAccounts: number;
384+
brcTokenCount: number;
385+
inscriptionCount: number;
386+
btcAddressCount: number;
387+
};
388+
tokens: {
389+
name: string;
390+
mappedName: string;
391+
price: number;
392+
volume: number;
393+
change24h: number | null;
394+
libreHolderCount: number;
395+
totalSupply: number;
396+
marketCap: number;
397+
bitcoinHolderCount: number;
398+
}[];
399+
};

‎src/views/address/overview.tsx

Lines changed: 62 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
1-
import { useExchangeRates } from '@/hooks/api';
2-
import { currencyFormat } from '@/utils/number';
3-
import Link from 'next/link';
4-
import type { OverviewProps } from './types';
5-
import { useState, useEffect } from 'react';
1+
import { useExchangeRates, useOrdinalsMarketcap } from "@/hooks/api";
2+
import { currencyFormat } from "@/utils/number";
3+
import Link from "next/link";
4+
import type { OverviewProps } from "./types";
5+
import { useState, useEffect } from "react";
66

77
export default function AccountOverview({ tokens }: OverviewProps) {
88
const exchangeRatesQuery = useExchangeRates();
9+
const ordinalsMarketcapQuery = useOrdinalsMarketcap();
910
const [totalValue, setTotalValue] = useState(0);
1011

1112
useEffect(() => {
@@ -24,12 +25,17 @@ export default function AccountOverview({ tokens }: OverviewProps) {
2425
}
2526
}, [exchangeRatesQuery.isSuccess, tokens]);
2627

27-
if (exchangeRatesQuery.isLoading) {
28+
if (exchangeRatesQuery.isLoading || ordinalsMarketcapQuery.isLoading) {
2829
return <span>Loading...</span>;
2930
}
3031

31-
if (exchangeRatesQuery.isError) {
32-
return <span>Error: {exchangeRatesQuery.error?.message}</span>;
32+
if (exchangeRatesQuery.isError || ordinalsMarketcapQuery.isError) {
33+
return (
34+
<span>
35+
Error: {exchangeRatesQuery.error?.message}{" "}
36+
{ordinalsMarketcapQuery.error?.message}
37+
</span>
38+
);
3339
}
3440

3541
const exchangeRates = exchangeRatesQuery.data;
@@ -40,11 +46,15 @@ export default function AccountOverview({ tokens }: OverviewProps) {
4046
if (isNaN(bValue)) return -1;
4147
return bValue - aValue;
4248
});
49+
console.log(sortedTokens);
50+
51+
52+
const ordinalsMarketcap = ordinalsMarketcapQuery.data;
4353

4454
return (
45-
<div className='flex-1'>
46-
<div className='w-full overflow-x-auto rounded-md border border-shade-800 bg-shade-900'>
47-
<table className='custom-table'>
55+
<div className="flex-1">
56+
<div className="w-full overflow-x-auto rounded-md border border-shade-800 bg-shade-900">
57+
<table className="custom-table">
4858
<thead>
4959
<tr>
5060
<th>TOKEN</th>
@@ -53,27 +63,37 @@ export default function AccountOverview({ tokens }: OverviewProps) {
5363
</tr>
5464
</thead>
5565
<tbody>
56-
{sortedTokens.map((token) => (
66+
{sortedTokens
67+
.filter((token) => token.contract !== 'ord.libre' && token.amount !== 0)
68+
.map((token) => (
69+
// ... Rest of your code for rendering each token
70+
71+
72+
5773
<tr key={token.symbol}>
5874
<td>
59-
<div className='flex items-center space-x-4'>
60-
<div className="">
61-
{['PBTC', 'PUSDT', 'BTCUSD', 'LIBRE', 'BTCLIB'].includes(token.symbol.toUpperCase()) ? (
62-
<img
63-
src={`/images/symbols/${token.symbol.toUpperCase()}.svg`}
64-
alt={token.symbol.toUpperCase()}
65-
className="h-8 w-8 shrink-0"
66-
/>
67-
) : (
68-
<div className="w-11 h-11 rounded-full bg-blue-500 flex flex-col justify-center items-center">
69-
<a className="uppercase text-xs">{token.symbol.toUpperCase()}</a>
70-
</div>
71-
)}
72-
</div>
75+
<div className="flex items-center space-x-4">
76+
<div className="">
77+
{["PBTC", "PUSDT", "BTCUSD", "LIBRE", "BTCLIB"].includes(
78+
token.symbol.toUpperCase()
79+
) ? (
80+
<img
81+
src={`/images/symbols/${token.symbol.toUpperCase()}.svg`}
82+
alt={token.symbol.toUpperCase()}
83+
className="h-8 w-8 shrink-0"
84+
/>
85+
) : (
86+
<div className="flex h-11 w-11 flex-col items-center justify-center rounded-full bg-blue-500">
87+
<a className="text-xs uppercase">
88+
{token.symbol.toUpperCase()}
89+
</a>
90+
</div>
91+
)}
92+
</div>
7393

7494
<Link
75-
href={'../tokens'}
76-
className='inline-block max-w-full truncate align-middle hover:underline'
95+
href={"../tokens"}
96+
className="inline-block max-w-full truncate align-middle hover:underline"
7797
>
7898
<span>{token.symbol}</span>
7999
</Link>
@@ -82,11 +102,17 @@ export default function AccountOverview({ tokens }: OverviewProps) {
82102
<td>{token?.amount ?? 0}</td>
83103
<td>
84104
{isNaN(token.amount * exchangeRates[token.symbol]) ? (
85-
<span style={{ color: 'gray' }}>SOON</span>
105+
<span style={{ color: "white" }}>
106+
${token.amount * (ordinalsMarketcap.tokens.find((t) => t.mappedName === token.symbol)?.price ?? 0)}
107+
108+
109+
</span>
86110
) : (
87-
<span style={{ color: 'white' }}>
111+
<span style={{ color: "white" }}>
88112
$
89-
{(token.amount * exchangeRates[token.symbol]).toLocaleString('en-US', {
113+
{(
114+
token.amount * exchangeRates[token.symbol]
115+
).toLocaleString("en-US", {
90116
maximumFractionDigits: 3,
91117
})}
92118
</span>
@@ -99,8 +125,11 @@ export default function AccountOverview({ tokens }: OverviewProps) {
99125

100126
<div></div>
101127
</table>
102-
<div className=' flex justify-center py-3 text-[15px]'>
103-
<div>Total: ${totalValue.toLocaleString('en-US', { maximumFractionDigits: 3 })}</div>
128+
<div className=" flex justify-center py-3 text-[15px]">
129+
<div>
130+
Total: $
131+
{totalValue.toLocaleString("en-US", { maximumFractionDigits: 3 })}
132+
</div>
104133
</div>
105134
</div>
106135
</div>

0 commit comments

Comments
 (0)