import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useContext, useState } from "react";
import { TabPane, Tabs } from "../../../tab";
import AssetHistory from "./assetHistory";
import FundingFee from "./fundingFee";
import { LayoutContext } from "../../../layout/layoutContext";
export var EPortfolioTab;
(function(EPortfolioTab) {
    EPortfolioTab["DepositsWithdrawals"] = "deposits_withdrawals";
    EPortfolioTab["Funding"] = "funding";
    EPortfolioTab["Liquidations"] = "liquidations";
})(EPortfolioTab || (EPortfolioTab = {}));
export const DataList = ()=>{
    const [activeTab, setActiveTab] = useState("deposits_withdrawals");
    const { pageHeaderHeight, headerHeight, footerHeight } = useContext(LayoutContext);
    const height = `calc(100vh - ${headerHeight + footerHeight + (pageHeaderHeight ?? 0) + 20 + 32}px)`;
    return /*#__PURE__*/ _jsx("div", {
        style: {
            height
        },
        className: "orderly-overflow-hidden orderly-max-w-[1408px] orderly-min-w-[736px] orderly-mx-auto orderly-tabular-nums",
        children: /*#__PURE__*/ _jsxs(Tabs, {
            value: activeTab,
            onTabChange: setActiveTab,
            tabBarClassName: "orderly-h-[48px] orderly-text-sm orderly-pl-0",
            children: [
                /*#__PURE__*/ _jsx(TabPane, {
                    title: "Deposits & Withdrawals",
                    value: "deposits_withdrawals",
                    children: /*#__PURE__*/ _jsx(AssetHistory, {})
                }),
                /*#__PURE__*/ _jsx(TabPane, {
                    title: "Funding",
                    value: "funding",
                    children: /*#__PURE__*/ _jsx(FundingFee, {})
                })
            ]
        })
    });
};

//# sourceMappingURL=index.js.map