"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "Listview", {
    enumerable: true,
    get: function() {
        return Listview;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _table = require("../../../table");
const _react = require("react");
const _text = require("../../../text");
const _positionRowContext = require("./positionRowContext");
const _priceInput = require("./priceInput");
const _closeButton = require("./closeButton");
const _provider = require("../../../provider");
const _quantityInput = require("./quantityInput");
const _numeralWithCtx = require("../../../text/numeralWithCtx");
const _tab = require("../../../tab");
const _divider = require("../../../divider");
const _unrealPnLHover = require("./unrealPnLHover");
const _positionEmptyView = require("./positionEmptyView");
const _sharePnLIcon = require("../../../block/shared/sharePnLIcon");
const Listview = (props)=>{
    const { pnlNotionalDecimalPrecision } = props;
    const { height } = (0, _react.useContext)(_tab.TabContext);
    // const { footerHeight } = useContext(LayoutContext);
    // const {
    //   data: { pnlNotionalDecimalPrecision },
    // } = useTabContext();
    const columns = (0, _react.useMemo)(()=>{
        return [
            {
                title: "Instrument",
                dataIndex: "symbol",
                className: "orderly-h-[48px]",
                fixed: "left",
                width: 120,
                onSort: (r1, r2, sortOrder)=>{
                    if (sortOrder === "asc") {
                        return r1.symbol.localeCompare(r2.symbol);
                    }
                    return r2.symbol.localeCompare(r1.symbol);
                },
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                        rule: "symbol",
                        className: "orderly-font-semibold orderly-cursor-pointer",
                        onClick: (e)=>{
                            props.onSymbolChange?.({
                                symbol: value
                            });
                            e.stopPropagation();
                            e.preventDefault();
                        },
                        children: value
                    })
            },
            {
                title: "Quantity",
                className: "orderly-h-[48px]",
                dataIndex: "position_qty",
                onSort: true,
                width: 100,
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_numeralWithCtx.NumeralWithCtx, {
                        coloring: true,
                        className: "orderly-font-semibold",
                        tick: "base_dp",
                        children: value
                    })
            },
            {
                title: "Avg. open",
                className: "orderly-h-[48px]",
                width: 120,
                onSort: true,
                dataIndex: "average_open_price",
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_numeralWithCtx.NumeralWithCtx, {
                        children: value
                    })
            },
            {
                title: "Mark price",
                dataIndex: "mark_price",
                width: 120,
                onSort: true,
                className: "orderly-h-[48px]",
                render: (value)=>{
                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_numeralWithCtx.NumeralWithCtx, {
                        className: "orderly-font-semibold",
                        children: value
                    });
                }
            },
            {
                title: "Liq. price",
                width: 100,
                onSort: true,
                className: "orderly-h-[48px]",
                hint: "Estimated price at which your position will be liquidated. Prices are estimated and depend on multiple factors across all positions.",
                dataIndex: "est_liq_price",
                render: (value)=>{
                    return Number(value) === 0 ? "--" : /*#__PURE__*/ (0, _jsxruntime.jsx)(_numeralWithCtx.NumeralWithCtx, {
                        className: "orderly-text-warning orderly-font-semibold",
                        children: value
                    });
                }
            },
            {
                title: "Unreal. PnL",
                className: "orderly-h-[48px]",
                dataIndex: "unrealized_pnl",
                width: 150,
                onSort: true,
                hint: /*#__PURE__*/ (0, _jsxruntime.jsx)(_unrealPnLHover.UnrealizedPnLPopoverCard, {
                    unPnlPriceBasis: props.unPnlPriceBasis,
                    setUnPnlPriceBasic: props.setUnPnlPriceBasic
                }),
                render: (value, record)=>{
                    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("span", {
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                                precision: pnlNotionalDecimalPrecision,
                                coloring: true,
                                className: "orderly-font-semibold",
                                children: value
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                                rule: "percentages",
                                precision: pnlNotionalDecimalPrecision,
                                coloring: true,
                                className: "orderly-font-semibold",
                                prefix: "(",
                                surfix: ")",
                                children: record.unrealized_pnl_ROI
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_sharePnLIcon.SharePnLIcon, {
                                className: "orderly-ml-2",
                                position: record
                            })
                        ]
                    });
                }
            },
            // {
            //   title: "Unreal. ROI",
            //   className: "orderly-h-[48px]",
            //   dataIndex: "unsettled_pnl_ROI",
            //   width: 120,
            //   onSort: true,
            //   render: (value: string) => (
            //   ),
            // },
            // {
            //   title: "Daily real.",
            //   className: "orderly-h-[48px]",
            //   dataIndex: "open_price",
            // },
            {
                title: "Est. total",
                dataIndex: "notional",
                className: "orderly-h-[48px]",
                width: 100,
                onSort: true,
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                        precision: pnlNotionalDecimalPrecision,
                        className: "orderly-font-semibold",
                        children: value
                    })
            },
            {
                title: "Margin",
                className: "orderly-h-[48px]",
                dataIndex: "mm",
                onSort: true,
                width: 100,
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                        className: "orderly-font-semibold",
                        children: value
                    }),
                hint: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                    children: [
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                            children: "The minimum equity to keep your position. "
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_divider.Divider, {
                            className: "orderly-py-2 orderly-border-white/10"
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                            children: "Margin = Position size * Mark price * MMR"
                        })
                    ]
                }),
                hintClassName: "orderly-p-2"
            },
            {
                title: "Qty.",
                dataIndex: "close_qty",
                className: "orderly-h-[48px]",
                width: 100,
                fixed: "right",
                render: (value)=>{
                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_quantityInput.QuantityInput, {});
                }
            },
            {
                title: "Price",
                dataIndex: "close_price",
                width: 100,
                fixed: "right",
                className: "orderly-w-[100px] orderly-h-[48px]",
                render: (value)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_priceInput.PriceInput, {})
            },
            {
                title: "",
                dataIndex: "close_position",
                align: "right",
                width: 80,
                fixed: "right",
                className: "orderly-h-[48px]",
                render: (value)=>{
                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_closeButton.CloseButton, {});
                }
            }
        ];
    }, [
        pnlNotionalDecimalPrecision,
        props.unPnlPriceBasis
    ]);
    const divRef = (0, _react.useRef)(null);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        ref: divRef,
        // className="orderly-overflow-y-auto"
        className: "orderly-relative",
        style: {
            height: `${(height?.content ?? 100) - 68}px`
        },
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_table.Table, {
                bordered: true,
                justified: true,
                showMaskElement: false,
                columns: columns,
                dataSource: props.dataSource,
                headerClassName: "orderly-text-2xs orderly-text-base-contrast-54 orderly-py-3 orderly-bg-base-900",
                className: "orderly-text-2xs orderly-text-base-contrast-80",
                generatedRowKey: (record)=>record.symbol,
                renderRowContainer: (record, index, children)=>{
                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_provider.SymbolProvider, {
                        symbol: record.symbol,
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_positionRowContext.PositionsRowProvider, {
                            position: record,
                            children: children
                        })
                    });
                }
            }),
            (!props.dataSource || props.dataSource.length <= 0) && /*#__PURE__*/ (0, _jsxruntime.jsx)(_positionEmptyView.PositionEmptyView, {
                watchRef: divRef,
                left: 120,
                right: 280
            })
        ]
    });
};

//# sourceMappingURL=listview.js.map