"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "OrderCell", {
    enumerable: true,
    get: function() {
        return OrderCell;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _button = /*#__PURE__*/ _interop_require_default(require("../../button"));
const _statistic = require("../../statistic");
const _tag = require("../../tag");
const _react = require("react");
const _types = require("@orderly.network/types");
const _text = require("../../text");
const _numeralTotal = require("../../text/numeralTotal");
const _orderListContext = require("./shared/orderListContext");
const _provider = require("../../provider");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const OrderCell = (props)=>{
    const { order } = props;
    const [loading, setLoading] = (0, _react.useState)(false);
    const { onCancelOrder, onEditOrder } = (0, _react.useContext)(_orderListContext.OrderListContext);
    const { quote, quote_dp, base, base_dp } = (0, _react.useContext)(_provider.SymbolContext);
    const isAlgoOrder = order?.algo_order_id !== undefined;
    // console.log("price node", order);
    const isStopMarket = order?.type === "MARKET" && isAlgoOrder;
    const typeTag = (0, _react.useMemo)(()=>{
        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_tag.Tag, {
            color: order.side === "BUY" ? "buy" : "sell",
            size: "small",
            children: order.side === "BUY" ? "Buy" : "Sell"
        });
    }, [
        order
    ]);
    const cancelOrder = (0, _react.useCallback)(()=>{
        if (loading) return;
        setLoading(true);
        onCancelOrder(order).finally(()=>setLoading(false));
    }, [
        loading,
        order
    ]);
    const onSymbol = ()=>{
        props.onSymbolChange?.({
            symbol: order.symbol
        });
        // go to the top of page
        window.scrollTo(0, 0);
    };
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-px-4 orderly-py-2",
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-gap-2 orderly-mb-1",
                children: [
                    typeTag,
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "orderly-flex-1 orderly-text-2xs",
                        onClick: onSymbol,
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                            rule: "symbol",
                            children: order.symbol
                        })
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "orderly-text-4xs orderly-text-base-contrast-36",
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                            rule: "date",
                            children: order.created_time
                        })
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-grid orderly-grid-cols-3 orderly-gap-2",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: "Qty.",
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        value: order.quantity ?? "-",
                        precision: base_dp,
                        rule: "price",
                        valueClassName: order.side === _types.OrderSide.BUY ? "orderly-text-trade-profit orderly-text-3xs" : "orderly-text-trade-loss orderly-text-3xs"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: "Filled",
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-3xs orderly-text-base-contrast-80",
                        // @ts-ignore
                        value: order.total_executed_quantity ?? "-",
                        rule: "price",
                        precision: base_dp
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                            children: [
                                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                    className: "orderly-text-base-contrast-36",
                                    children: "Est. total"
                                }),
                                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                    className: "orderly-text-base-contrast-20",
                                    children: "(USDC)"
                                })
                            ]
                        }),
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-3xs orderly-text-base-contrast-80",
                        value: /*#__PURE__*/ (0, _jsxruntime.jsx)(_numeralTotal.NumeralTotal, {
                            price: props.order.price ?? 1,
                            quantity: props.order.quantity,
                            precision: quote_dp
                        }),
                        align: "right"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-36",
                                children: "Trigger price"
                            })
                        }),
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-3xs orderly-text-base-contrast-80",
                        rule: "price",
                        precision: quote_dp,
                        value: order.trigger_price
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-36",
                                children: "Limit price"
                            })
                        }),
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-3xs orderly-text-base-contrast-80",
                        value: isStopMarket ? /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                            children: "Market"
                        }) : order.price ?? "-",
                        rule: "price",
                        precision: quote_dp
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-36",
                                children: "Mark price"
                            })
                        }),
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-3xs orderly-text-base-contrast-80",
                        rule: "price",
                        precision: quote_dp,
                        value: order.mark_price,
                        align: "right"
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-gap-3 orderly-text-4xs orderly-justify-end orderly-mt-2",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.default, {
                        id: "orderly-pending-cell-edit-button",
                        variant: "outlined",
                        size: "small",
                        color: "tertiary",
                        className: "orderly-w-[120px] orderly-text-4xs",
                        onClick: ()=>onEditOrder(order),
                        children: "Edit"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.default, {
                        id: "orderly-pending-cell-cancel-button",
                        variant: "outlined",
                        color: "tertiary",
                        size: "small",
                        className: "orderly-w-[120px] orderly-text-4xs",
                        loading: loading,
                        onClick: cancelOrder,
                        children: "Cancel"
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=cell.js.map