Update columsn in balances table
This commit is contained in:
parent
349ad1b62d
commit
37f9c41355
|
@ -32,9 +32,9 @@ export default function AccountsTable({ accountBalances }) {
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
{
|
||||||
title: 'Key',
|
title: 'Market',
|
||||||
dataIndex: 'key',
|
dataIndex: 'market',
|
||||||
key: 'key',
|
key: 'market',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Coin',
|
title: 'Coin',
|
||||||
|
@ -66,7 +66,10 @@ export default function AccountsTable({ accountBalances }) {
|
||||||
<DataTable
|
<DataTable
|
||||||
emptyLabel="No balances"
|
emptyLabel="No balances"
|
||||||
dataSource={accountBalances}
|
dataSource={accountBalances}
|
||||||
columns={columns}
|
columns={columns.map((data) => ({
|
||||||
|
...data,
|
||||||
|
key: `${data.market}${data.coin}`,
|
||||||
|
}))}
|
||||||
pagination={false}
|
pagination={false}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|
|
@ -6,11 +6,6 @@ export default function WalletBalancesTable({
|
||||||
walletBalances,
|
walletBalances,
|
||||||
}) {
|
}) {
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
|
||||||
title: 'Key',
|
|
||||||
dataIndex: 'key',
|
|
||||||
key: 'key',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: 'Coin',
|
title: 'Coin',
|
||||||
dataIndex: 'coin',
|
dataIndex: 'coin',
|
||||||
|
|
|
@ -1,6 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Tabs } from 'antd';
|
import { Tabs } from 'antd';
|
||||||
import { useWalletBalancesForAllMarkets, useOpenOrderAccountBalancesForAllMarkets } from '../utils/markets';
|
import {
|
||||||
|
useWalletBalancesForAllMarkets,
|
||||||
|
useOpenOrderAccountBalancesForAllMarkets,
|
||||||
|
} from '../utils/markets';
|
||||||
import FloatingElement from '../components/layout/FloatingElement';
|
import FloatingElement from '../components/layout/FloatingElement';
|
||||||
import WalletBalancesTable from '../components/UserInfoTable/WalletBalancesTable';
|
import WalletBalancesTable from '../components/UserInfoTable/WalletBalancesTable';
|
||||||
import AccountsTable from '../components/UserInfoTable/AccountsTable';
|
import AccountsTable from '../components/UserInfoTable/AccountsTable';
|
||||||
|
@ -8,17 +11,29 @@ import AccountsTable from '../components/UserInfoTable/AccountsTable';
|
||||||
const { TabPane } = Tabs;
|
const { TabPane } = Tabs;
|
||||||
|
|
||||||
export default function BalancesPage() {
|
export default function BalancesPage() {
|
||||||
const [walletBalances, loadedWalletBalances] = useWalletBalancesForAllMarkets();
|
const [
|
||||||
const [accountBalances, accountBalancesLoaded] = useOpenOrderAccountBalancesForAllMarkets();
|
walletBalances,
|
||||||
|
loadedWalletBalances,
|
||||||
|
] = useWalletBalancesForAllMarkets();
|
||||||
|
const [
|
||||||
|
accountBalances,
|
||||||
|
accountBalancesLoaded,
|
||||||
|
] = useOpenOrderAccountBalancesForAllMarkets();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<FloatingElement style={{ flex: 1, paddingTop: 10 }}>
|
<FloatingElement style={{ flex: 1, paddingTop: 10 }}>
|
||||||
<Tabs defaultActiveKey="accounts">
|
<Tabs defaultActiveKey="walletBalances">
|
||||||
<TabPane tab="Balances" key="balances">
|
<TabPane tab="Wallet Balances" key="walletBalances">
|
||||||
<WalletBalancesTable loaded={loadedWalletBalances} walletBalances={walletBalances} />
|
<WalletBalancesTable
|
||||||
|
loaded={loadedWalletBalances}
|
||||||
|
walletBalances={walletBalances}
|
||||||
|
/>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
<TabPane tab="Accounts" key="accounts">
|
<TabPane tab="Market balances" key="marketBalances">
|
||||||
<AccountsTable loaded={accountBalancesLoaded} accountBalances={accountBalances} />
|
<AccountsTable
|
||||||
|
loaded={accountBalancesLoaded}
|
||||||
|
accountBalances={accountBalances}
|
||||||
|
/>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
</FloatingElement>
|
</FloatingElement>
|
||||||
|
|
|
@ -722,13 +722,13 @@ export function useOpenOrderAccountBalancesForAllMarkets() {
|
||||||
openOrdersAccount?.quoteTokenFree &&
|
openOrdersAccount?.quoteTokenFree &&
|
||||||
market.baseSplSizeToNumber(openOrdersAccount.quoteTokenFree);
|
market.baseSplSizeToNumber(openOrdersAccount.quoteTokenFree);
|
||||||
openOrderAccountBalances.push({
|
openOrderAccountBalances.push({
|
||||||
key: baseCurrency,
|
market: marketName,
|
||||||
coin: baseCurrency,
|
coin: baseCurrency,
|
||||||
orders: inOrdersBase,
|
orders: inOrdersBase,
|
||||||
unsettled: unsettledBase,
|
unsettled: unsettledBase,
|
||||||
});
|
});
|
||||||
openOrderAccountBalances.push({
|
openOrderAccountBalances.push({
|
||||||
key: quoteCurrency,
|
market: marketName,
|
||||||
coin: quoteCurrency,
|
coin: quoteCurrency,
|
||||||
orders: inOrdersQuote,
|
orders: inOrdersQuote,
|
||||||
unsettled: unsettledQuote,
|
unsettled: unsettledQuote,
|
||||||
|
|
Loading…
Reference in New Issue