"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "AlgoOrderConfirmView", {
    enumerable: true,
    get: function() {
        return AlgoOrderConfirmView;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _networkImage = require("../../icon/networkImage");
const _text = require("../../text");
const _hooks = require("@orderly.network/hooks");
const _types = require("@orderly.network/types");
const _utils = require("@orderly.network/utils");
const _react = require("react");
const _orderConfirmViewnew = require("../orderEntry/sections/orderConfirmView.new");
const _button = require("../../button/button");
const _utils1 = require("../../utils");
const AlgoOrderConfirmView = (props)=>{
    const { order, oldOrder, tp_trigger_price, sl_trigger_price } = props;
    const symbolConfig = (0, _hooks.useSymbolsInfo)()[order.symbol]();
    const [loading, setLoading] = (0, _react.useState)(false);
    const type = (0, _react.useMemo)(()=>{
        if (order.algo_type === _types.AlgoOrderRootType.POSITIONAL_TP_SL) {
            if (typeof tp_trigger_price !== "undefined" && typeof sl_trigger_price !== "undefined") {
                return "Position TP/SL";
            }
            if (typeof tp_trigger_price !== "undefined") {
                return "Position TP";
            }
            if (typeof sl_trigger_price !== "undefined") {
                return "Position SL";
            }
        }
        if (order.algo_type === _types.AlgoOrderRootType.TP_SL) {
            if (typeof tp_trigger_price !== "undefined" && typeof sl_trigger_price !== "undefined") {
                return "TP/SL";
            }
            if (typeof tp_trigger_price !== "undefined") {
                return "Take profit";
            }
            if (typeof sl_trigger_price !== "undefined") {
                return "Stop loss";
            }
        }
    }, [
        order
    ]);
    const qty = (0, _react.useMemo)(()=>{
        if (order.algo_type === _types.AlgoOrderRootType.POSITIONAL_TP_SL) {
            return "Entire position";
        }
        return (0, _utils.commify)(order.quantity);
    }, [
        order
    ]);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-px-5 orderly-mt-5",
        children: [
            props.isEditing && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                className: "orderly-pb-3 orderly-text-sm orderly-text-base-contrast-80",
                children: `You agree to edit your ${symbolConfig.base}-PERP order.`
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-pb-4",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_networkImage.NetworkImage, {
                        symbol: order.symbol,
                        type: "symbol",
                        size: 20
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                        className: "desktop:orderly-text-lg orderly-pl-2",
                        children: `${symbolConfig.base}-PERP`
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: (0, _utils1.cn)("orderly-text-base-contract-54 orderly-text-xs desktop:orderly-text-sm orderly-font-semibold orderly-flex orderly-gap-2"),
                children: [
                    !props.isEditing && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: " orderly-w-[78px] desktop:orderly-flex-1",
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                            className: "orderly-mr-3",
                            children: type
                        })
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex-1 orderly-gap-2 orderly-text-xs desktop:orderly-text-sm",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-flex orderly-justify-between orderly-mb-1",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        className: "orderly-text-base-contrast-54",
                                        children: "Qty."
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        children: qty
                                    })
                                ]
                            }),
                            !!tp_trigger_price && /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-flex orderly-justify-between orderly-mb-1",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        className: "orderly-text-base-contrast-54",
                                        children: "TP Price"
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                                        children: tp_trigger_price,
                                        precision: props.quoteDp,
                                        rule: "price",
                                        coloring: true,
                                        surfix: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                            className: "orderly-text-base-contrast-36",
                                            children: symbolConfig.quote
                                        })
                                    })
                                ]
                            }),
                            !!sl_trigger_price && /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-flex orderly-justify-between orderly-mb-1",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        className: "orderly-text-base-contrast-54",
                                        children: "SL Price"
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                                        children: sl_trigger_price,
                                        precision: props.quoteDp,
                                        rule: "price",
                                        className: "orderly-text-trade-loss",
                                        surfix: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                            className: "orderly-text-base-contrast-36",
                                            children: symbolConfig.quote
                                        })
                                    })
                                ]
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-flex orderly-justify-between orderly-mb-1",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        className: "orderly-text-base-contrast-54",
                                        children: "Price"
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                        children: "Market"
                                    })
                                ]
                            })
                        ]
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: (0, _utils1.cn)("orderly-grid orderly-grid-cols-1 desktop:orderly-mt-6 desktop:orderly-grid-cols-2", props.isEditing && "desktop:orderly-grid-cols-1 orderly-mt-3"),
                children: [
                    !props.isEditing ? /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "orderly-flex orderly-items-center orderly-h-[40px]",
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_orderConfirmViewnew.OrderConfirmCheckBox, {})
                    }) : null,
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-grid orderly-grid-cols-2 orderly-gap-2",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.Button, {
                                className: "orderly-confirm-dialog-cancal-button orderly-text-xs desktop:orderly-text-xs orderly-font-bold",
                                type: "button",
                                variant: "contained",
                                color: "tertiary",
                                onClick: props.onCancel,
                                disabled: loading,
                                fullWidth: true,
                                children: "Cancel"
                            }, "cancel"),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.Button, {
                                className: "orderly-confirm-dialog-ok-button orderly-text-xs desktop:orderly-text-xs orderly-font-bold",
                                type: "button",
                                disabled: loading,
                                loading: loading,
                                fullWidth: true,
                                onClick: ()=>{
                                    setLoading(true);
                                    props.onConfirm?.().finally(()=>setLoading(false));
                                },
                                children: "Confirm"
                            }, "ok")
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=algoOrderConfirmView.js.map