40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import { useEffect, useState } from 'react'
|
|
import mangoStore from '../../store/mangoStore'
|
|
import TabButtons from '../shared/TabButtons'
|
|
import TokenList from '../TokenList'
|
|
import TradeHistoryTable from '../TradeHistoryTable'
|
|
|
|
const AccountTabs = () => {
|
|
const [activeTab, setActiveTab] = useState('tokens')
|
|
const actions = mangoStore((s) => s.actions)
|
|
const mangoAccount = mangoStore((s) => s.mangoAccount.current)
|
|
const tradeHistory = mangoStore((s) => s.mangoAccount.stats.tradeHistory.data)
|
|
const loading = mangoStore((s) => s.mangoAccount.stats.tradeHistory.loading)
|
|
|
|
useEffect(() => {
|
|
if (mangoAccount) {
|
|
actions.fetchTradeHistory(mangoAccount.publicKey.toString())
|
|
}
|
|
}, [actions, mangoAccount])
|
|
|
|
return (
|
|
<>
|
|
<div className="mb-4 mt-8 md:mt-10">
|
|
<TabButtons
|
|
activeValue={activeTab}
|
|
onChange={(v) => setActiveTab(v)}
|
|
values={['tokens', 'trade-history']}
|
|
large
|
|
/>
|
|
</div>
|
|
{activeTab === 'tokens' ? (
|
|
<TokenList />
|
|
) : (
|
|
<TradeHistoryTable tradeHistory={tradeHistory} loading={loading} />
|
|
)}
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default AccountTabs
|