Skip to content

Commit 6d529bd

Browse files
LibreBlocksDevLibreBlocksDev
committed
Account Value Fixed & getTokens issue Fixed
1 parent af83603 commit 6d529bd

File tree

10 files changed

+321
-194
lines changed

10 files changed

+321
-194
lines changed

Diff for: ‎next-env.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
/// <reference types="next" />
22
/// <reference types="next/image-types/global" />
3+
/// <reference types="next/navigation-types/compat/navigation" />
34

45
// NOTE: This file should not be edited
56
// see https://nextjs.org/docs/basic-features/typescript for more information.

Diff for: ‎src/hooks/api.ts

+10-2
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ import type {
1818
ResponseOrdinalsMarketcap,
1919
ResponseGetDefillama,
2020
ResponseChainInfo2,
21+
ParamsGetAccountTokens,
22+
ResponseGetAccountTokens,
2123
} from '@/types';
2224
import * as api from '@/lib/api';
2325

@@ -126,10 +128,16 @@ export const useOrdinalsMarketcap = () => {
126128
});
127129
};
128130

129-
130131
export const useDefillamaTVL = () => {
131-
return useQuery<ResponseGetDefillama, Error>({
132+
return useQuery<ResponseGetDefillama, Error>({
132133
queryKey: ['DefiLlamaTVL'],
133134
queryFn: api.getDefillamaTVL, // Defillama
134135
});
135136
};
137+
138+
export const useAccountTokens = (params: ParamsGetAccountTokens) => {
139+
return useQuery<ResponseGetAccountTokens, Error>({
140+
queryKey: ['accountTokens', params],
141+
queryFn: api.getAccountTokens,
142+
});
143+
};

Diff for: ‎src/lib/api.ts

+22-9
Original file line numberDiff line numberDiff line change
@@ -10,28 +10,28 @@ const apiUrl =
1010

1111
export const getCoinInfo = async () => {
1212
const { data } = await axios.get(
13-
`${process.env.NEXT_PUBLIC_LIBRE_API}/tokens`
13+
`${process.env.NEXT_PUBLIC_LIBRE_API}/tokens`,
1414
);
1515
return data;
1616
};
1717

1818
export const getChainInfo = async () => {
1919
const { data } = await axios.get(
20-
`${process.env.NEXT_PUBLIC_LIBRE_API}/stats/chain`
20+
`${process.env.NEXT_PUBLIC_LIBRE_API}/stats/chain`,
2121
);
2222
return data;
2323
};
2424

2525
export const getChainInfo2 = async () => {
2626
const { data } = await axios.get(
27-
`${process.env.NEXT_PUBLIC_MAINNET_API}/v1/chain/get_info`
27+
`${process.env.NEXT_PUBLIC_MAINNET_API}/v1/chain/get_info`,
2828
);
2929
return data;
3030
};
3131

3232
export const getExchangeRates = async () => {
3333
const { data } = await axios.get(
34-
`${process.env.NEXT_PUBLIC_LIBRE_API}/exchange-rates`
34+
`${process.env.NEXT_PUBLIC_LIBRE_API}/exchange-rates`,
3535
);
3636
return data;
3737
};
@@ -77,7 +77,6 @@ export const getTransaction = async ({ queryKey }: { queryKey: any }) => {
7777
return data;
7878
};
7979

80-
8180
export const getBlock = async ({ queryKey }: { queryKey: any }) => {
8281
const [_key, queryParams] = queryKey;
8382
if (!queryParams.block_num_or_id) {
@@ -92,14 +91,14 @@ export const getBlock = async ({ queryKey }: { queryKey: any }) => {
9291

9392
export const getProducers = async () => {
9493
const { data } = await axios.get(
95-
`${process.env.NEXT_PUBLIC_LIBRE_API}/producers`
94+
`${process.env.NEXT_PUBLIC_LIBRE_API}/producers`,
9695
);
9796
return data;
9897
};
9998

10099
export const getTokens = async () => {
101100
const { data } = await axios.get(
102-
`${process.env.NEXT_PUBLIC_LIBRE_API}/tokens`
101+
`${process.env.NEXT_PUBLIC_LIBRE_API}/tokens`,
103102
);
104103
return data;
105104
};
@@ -109,8 +108,22 @@ export const getOrdinalsMarketcap = async () => {
109108
return data;
110109
};
111110

112-
113111
export const getDefillamaTVL = async () => {
114112
const { data } = await axios.get(`https://api.llama.fi/tvl/libre-swap`);
115113
return data;
116-
};
114+
};
115+
116+
export const getAccountTokens = async ({ queryKey }: { queryKey: any }) => {
117+
const [_key, queryParams] = queryKey;
118+
if (!queryParams.account) {
119+
return [];
120+
}
121+
122+
const { data } = await axios.get(
123+
`${process.env.NEXT_PUBLIC_MAINNET_API}/v2/state/get_tokens`,
124+
{
125+
params: queryParams,
126+
},
127+
);
128+
return data;
129+
};

Diff for: ‎src/types.d.ts

+15-1
Original file line numberDiff line numberDiff line change
@@ -346,7 +346,6 @@ export type ResponseGetTokens = {
346346

347347
export type ResponseGetDefillama = string;
348348

349-
350349
export type ParamsGetBlock = {
351350
block_num_or_id: string;
352351
};
@@ -423,3 +422,18 @@ export type ResponseOrdinalsMarketcap = {
423422
bitcoinHolderCount: number;
424423
}[];
425424
};
425+
426+
export type ParamsGetAccountTokens = {
427+
account: string;
428+
limit?: number;
429+
};
430+
431+
export type ResponseGetAccountTokens = {
432+
account: string;
433+
tokens: {
434+
symbol: keyof ResponseExchangeRates;
435+
precision: number;
436+
amount: number;
437+
contract: string;
438+
}[];
439+
};

Diff for: ‎src/views/address/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export default function ViewAddress() {
5050
<AccountProducers accountData={accountData} />
5151
</div>
5252
<div className='my-12'>
53-
<AccountOverview tokens={accountData.tokens} />
53+
<AccountOverview account={accountData.account.account_name} />
5454
</div>
5555
<div className='my-12'>
5656
<Transactions account={accountData.account.account_name} />

Diff for: ‎src/views/address/overview.tsx

+44-27
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
'use client';
22

3-
import { useExchangeRates, useOrdinalsMarketcap } from '@/hooks/api';
3+
import {
4+
useAccountTokens,
5+
useExchangeRates,
6+
useOrdinalsMarketcap,
7+
} from '@/hooks/api';
48
import type { OverviewProps } from './types';
59
import * as React from 'react';
610
import * as S from '@/styles/table';
@@ -10,19 +14,28 @@ import CustomPagination from '@/components/custom-pagination';
1014

1115
const MotionTableRow = motion(TableRow);
1216

13-
export default function AccountOverview({ tokens }: OverviewProps) {
17+
export default function AccountOverview({ account }: OverviewProps) {
1418
const [page, setPage] = React.useState(0);
1519
const rowsPerPage = 5;
1620
const exchangeRatesQuery = useExchangeRates();
1721
const ordinalsMarketcapQuery = useOrdinalsMarketcap();
22+
const accountTokensQuery = useAccountTokens({ account, limit: 999 });
1823
const [totalValue, setTotalValue] = React.useState(0);
1924

2025
const fetchData = () => {
21-
if (exchangeRatesQuery.isLoading || ordinalsMarketcapQuery.isLoading) {
26+
if (
27+
exchangeRatesQuery.isLoading ||
28+
ordinalsMarketcapQuery.isLoading ||
29+
accountTokensQuery.isLoading
30+
) {
2231
return { loading: true };
2332
}
2433

25-
if (exchangeRatesQuery.isError || ordinalsMarketcapQuery.isError) {
34+
if (
35+
exchangeRatesQuery.isError ||
36+
ordinalsMarketcapQuery.isError ||
37+
accountTokensQuery.isError
38+
) {
2639
return {
2740
error:
2841
exchangeRatesQuery.error?.message +
@@ -33,15 +46,17 @@ export default function AccountOverview({ tokens }: OverviewProps) {
3346

3447
const exchangeRates = exchangeRatesQuery.data;
3548
const ordinalsMarketcap = ordinalsMarketcapQuery.data;
49+
const accountTokens = accountTokensQuery.data;
3650

37-
return { exchangeRates, ordinalsMarketcap };
51+
return { exchangeRates, ordinalsMarketcap, accountTokens };
3852
};
3953

4054
const dataResult = fetchData();
41-
const { exchangeRates, ordinalsMarketcap } = dataResult;
55+
const { exchangeRates, ordinalsMarketcap, accountTokens } = dataResult;
56+
const tokens = accountTokens?.tokens;
4257

4358
const sortedTokens = React.useMemo(() => {
44-
if (!exchangeRates) return false;
59+
if (!exchangeRates || !tokens) return false;
4560

4661
const sorted = [...tokens].sort((a, b) => {
4762
const aValue = (a.amount || 0) * (exchangeRates[a.symbol] || 0);
@@ -52,7 +67,7 @@ export default function AccountOverview({ tokens }: OverviewProps) {
5267
});
5368

5469
const filtered = sorted.filter(
55-
(token) => token.contract !== 'ord.libre' && token.amount !== 0
70+
(token) => token.contract !== 'ord.libre' && token.amount !== 0,
5671
);
5772

5873
return filtered;
@@ -74,7 +89,7 @@ export default function AccountOverview({ tokens }: OverviewProps) {
7489
const exchangeRates = exchangeRatesQuery.data;
7590
let total = 0;
7691

77-
tokens.forEach((token) => {
92+
tokens?.forEach((token) => {
7893
const value = token.amount * exchangeRates[token.symbol];
7994
if (!isNaN(value)) {
8095
total += value;
@@ -139,40 +154,42 @@ export default function AccountOverview({ tokens }: OverviewProps) {
139154
<img
140155
src={`/images/symbols/${token.symbol}.svg`}
141156
alt={token.symbol}
142-
className='block h-15 w-15 shrink-0 object-contain mr-2'
157+
className='h-15 w-15 mr-2 block shrink-0 object-contain'
143158
onError={(e) => {
144159
// @ts-ignore
145160
if (e.target instanceof HTMLElement) {
146161
e.target.style.display = 'none'; // SVG görüntüsünü gizle
147162
const container = document.createElement('div');
148-
container.className = 'flex items-center space-x-2 mr-2'; // İçeriği yatay hizalamak için flex kullanın
163+
container.className =
164+
'flex items-center space-x-2 mr-2'; // İçeriği yatay hizalamak için flex kullanın
149165
const textContainer = document.createElement('div');
150-
textContainer.className = 'rounded-full w-8 h-8 bg-[#4F4FDE] flex items-center justify-center ';
166+
textContainer.className =
167+
'rounded-full w-8 h-8 bg-[#4F4FDE] flex items-center justify-center ';
151168
textContainer.style.fontSize = '8px'; // Küçük font boyutu ayarlayın
152169
textContainer.style.overflow = 'hidden'; // İçeriği kırp
153170
textContainer.style.color = 'white'; // Metin rengini beyaz yapın
154171
textContainer.innerText = token.symbol; // Token adını içeriğe ekleyin
155172
container.appendChild(textContainer); // Yazıyı içeriğe ekleyin
156173
if (e.target.parentNode) {
157-
e.target.parentNode.insertBefore(container, e.target.nextSibling); // İçeriği ekleyin
174+
e.target.parentNode.insertBefore(
175+
container,
176+
e.target.nextSibling,
177+
); // İçeriği ekleyin
158178
}
159179
}
160180
}}
161181
/>
162182

163-
164-
165-
166-
167-
<div className='flex items-center'>
168-
<span className='font-semibold'>{token.symbol}</span>
169-
{['PBTC', 'LIBRE', 'PUSDT', 'BTCLIB','BTCUSD'].includes(token.symbol) ? null : (
170-
<div className='bg-[#4F4FDE] text-white px-2 py-1 rounded-full text-xs ml-2'>
171-
BRC20
172-
</div>
173-
)}
174-
</div>
175-
183+
<div className='flex items-center'>
184+
<span className='font-semibold'>{token.symbol}</span>
185+
{['PBTC', 'LIBRE', 'PUSDT', 'BTCLIB', 'BTCUSD'].includes(
186+
token.symbol,
187+
) ? null : (
188+
<div className='ml-2 rounded-full bg-[#4F4FDE] px-2 py-1 text-xs text-white'>
189+
BRC20
190+
</div>
191+
)}
192+
</div>
176193
</div>
177194
</S.StyledTableCell>
178195
<S.StyledTableCell size='medium'>
@@ -187,7 +204,7 @@ export default function AccountOverview({ tokens }: OverviewProps) {
187204
{(
188205
token.amount *
189206
(ordinalsMarketcap.tokens.find(
190-
(t) => t.mappedName === token.symbol
207+
(t) => t.mappedName === token.symbol,
191208
)?.price ?? 0) *
192209
BTCPrice
193210
).toLocaleString('en-US', {

0 commit comments

Comments
 (0)