"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "OrderEditForm", {
    enumerable: true,
    get: function() {
        return OrderEditForm;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = require("react");
const _button = /*#__PURE__*/ _interop_require_default(require("../../../../button"));
const _divider = require("../../../../divider");
const _input = require("../../../../input");
const _slider = require("../../../../slider");
const _statistic = require("../../../../statistic");
const _text = require("../../../../text");
const _hooks = require("@orderly.network/hooks");
const _types = require("@orderly.network/types");
const _reacthookform = require("react-hook-form");
const _modal = require("../../../../modal");
const _toast = require("../../../../toast");
const _confirmContent = require("../../shared/confirmContent");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const OrderEditForm = (props)=>{
    const { order, onSubmit } = props;
    const isAlgoOrder = order.algo_order_id !== undefined;
    const isMarket = order.type === "MARKET";
    // const { hide, reject, resolve } = useModal();
    // @ts-ignore
    const { markPrice, maxQty, helper, metaState } = (0, _hooks.useOrderEntry)(order.symbol, order.side);
    const orderType = (0, _react.useMemo)(()=>{
        if (isAlgoOrder) {
            return `STOP_${order.type}`;
        }
        return order.type;
    }, [
        order,
        isAlgoOrder
    ]);
    const { handleSubmit, control, getValues, setValue, formState: { errors, submitCount, isSubmitting, isDirty, dirtyFields } } = (0, _reacthookform.useForm)({
        defaultValues: {
            order_price: order.price?.toString(),
            order_quantity: order.quantity.toString(),
            trigger_price: order.trigger_price?.toString(),
            symbol: order.symbol,
            order_type: orderType,
            side: order.side,
            reduce_only: Boolean(order.reduce_only)
        },
        // values: {
        // },
        resolver: async (values)=>{
            // @ts-ignore
            const errors = await helper.validator(values);
            if (errors.total?.message !== undefined) {
                _toast.toast.error(errors.total?.message);
            }
            return {
                values,
                errors
            };
        }
    });
    // console.log("editor form ", order);
    const symbolInfo = (0, _hooks.useSymbolsInfo)()[order.symbol];
    //
    const base = (0, _react.useMemo)(()=>symbolInfo("base"), [
        symbolInfo
    ]);
    const quote = (0, _react.useMemo)(()=>symbolInfo("quote"), [
        symbolInfo
    ]);
    const quoteDP = (0, _react.useMemo)(()=>symbolInfo("quote_dp"), [
        symbolInfo
    ]);
    const typeText = (0, _react.useMemo)(()=>{
        if (order.side === _types.OrderSide.SELL) return /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
            type: "sell",
            children: "Limit Sell"
        });
        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
            type: "buy",
            children: "Limit Buy"
        });
    }, [
        order
    ]);
    const onConfirm = (data, dirtyFields)=>{
        return _modal.modal.confirm({
            title: "Edit Order",
            content: (0, _confirmContent.EditOrderConfirmContent)(isAlgoOrder, isMarket, data, dirtyFields, base, order.symbol),
            contentClassName: "desktop:orderly-w-[340px]",
            onOk: ()=>Promise.resolve(data),
            onCancel: ()=>{
                return Promise.reject();
            }
        });
    };
    const onFormSubmit = (0, _react.useCallback)((data)=>{
        return onConfirm(data, dirtyFields).then((data)=>{
            return onSubmit(data);
        }, ()=>{});
    }, [
        quote,
        order,
        dirtyFields
    ]);
    const onFieldChange = (name, value)=>{
        // @ts-ignore
        const newValues = helper.calculate(getValues(), name, value);
        //
        if (name === "trigger_price") {
            // @ts-ignore
            setValue("trigger_price", newValues.trigger_price, {
                shouldValidate: submitCount > 0,
                shouldDirty: true
            });
        } else {
            if (name === "order_price") {
                // @ts-ignore
                setValue("order_price", newValues.order_price, {
                    shouldValidate: submitCount > 0,
                    shouldDirty: true
                });
            }
            // @ts-ignore
            setValue("order_quantity", newValues.order_quantity, {
                shouldValidate: submitCount > 0,
                shouldDirty: true
            });
        }
    };
    if (!order) return null;
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                className: "orderly-pb-3 orderly-pt-5 orderly-text-xs",
                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                    rule: "symbol",
                    children: order.symbol
                })
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-grid orderly-grid-cols-2",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: "Order type",
                        value: typeText,
                        valueClassName: "orderly-text-2xs",
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_statistic.Statistic, {
                        label: "Last price",
                        value: markPrice,
                        rule: "price",
                        precision: quoteDP || 2,
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-2xs"
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_divider.Divider, {
                className: "orderly-py-5"
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("form", {
                onSubmit: handleSubmit(onFormSubmit),
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-flex-col orderly-gap-5",
                        children: [
                            isAlgoOrder && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                                name: "trigger_price",
                                control: control,
                                render: ({ field })=>{
                                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_input.Input, {
                                        prefix: "Trigger price",
                                        suffix: quote,
                                        type: "text",
                                        inputMode: "decimal",
                                        containerClassName: "orderly-bg-base-500 orderly-rounded-borderRadius",
                                        helpText: errors.trigger_price?.message,
                                        error: !!errors.trigger_price,
                                        className: "orderly-text-right orderly-text-3xs",
                                        value: field.value,
                                        onChange: (e)=>{
                                            // field.onChange(e.target.value)
                                            onFieldChange("trigger_price", e.target.value);
                                        }
                                    });
                                }
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                                name: "order_price",
                                control: control,
                                render: ({ field })=>{
                                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_input.Input, {
                                        prefix: "Price",
                                        suffix: quote,
                                        type: "text",
                                        inputMode: "decimal",
                                        containerClassName: "orderly-bg-base-500 orderly-rounded-borderRadius",
                                        helpText: errors.order_price?.message,
                                        error: !!errors.order_price,
                                        className: "orderly-text-right orderly-text-3xs",
                                        value: isMarket ? "Market" : field.value,
                                        disabled: isMarket,
                                        onChange: (e)=>{
                                            // field.onChange(e.target.value)
                                            onFieldChange("order_price", e.target.value);
                                        }
                                    });
                                }
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                                name: "order_quantity",
                                control: control,
                                render: ({ field })=>{
                                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_input.Input, {
                                        prefix: "Quantity",
                                        suffix: base,
                                        type: "text",
                                        inputMode: "decimal",
                                        containerClassName: "orderly-bg-base-500 orderly-rounded-borderRadius",
                                        helpText: errors.order_quantity?.message,
                                        error: !!errors.order_quantity,
                                        className: "orderly-text-right orderly-text-3xs",
                                        value: field.value,
                                        onChange: (e)=>{
                                            // field.onChange(e.target.value)
                                            onFieldChange("order_quantity", e.target.value);
                                        }
                                    });
                                }
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "orderly-py-5",
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                            name: "order_quantity",
                            control: control,
                            render: ({ field })=>{
                                //
                                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_slider.Slider, {
                                    step: symbolInfo("base_tick"),
                                    min: 0,
                                    max: maxQty,
                                    color: "buy",
                                    markCount: 4,
                                    value: [
                                        Number(field.value ?? 0)
                                    ],
                                    onValueChange: (value)=>{
                                        onFieldChange("order_quantity", value[0].toString());
                                    }
                                });
                            }
                        })
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-grid orderly-grid-cols-2 orderly-gap-3 orderly-py-5",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.default, {
                                fullWidth: true,
                                variant: "contained",
                                color: "tertiary",
                                type: "button",
                                onClick: ()=>{
                                    props.onCancel?.();
                                },
                                children: "Cancel"
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_button.default, {
                                fullWidth: true,
                                type: "submit",
                                loading: isSubmitting,
                                disabled: !isDirty,
                                children: "Confirm"
                            })
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=editorForm.js.map