import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useRef, useState } from "react";
import { Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "../../../dialog";
import { LeverageEditor } from "../sections/leverageEditor";
import Button from "../../../button";
import { useLeverage } from "@orderly.network/hooks";
import { toast } from "../../../toast";
import { useMarginRatio } from "@orderly.network/hooks";
import { Numeral } from "../../../text/numeral";
export const LeverageDialog = (props)=>{
    const [open, setOpen] = useState(false);
    const { currentLeverage } = useMarginRatio();
    const [maxLeverage, { update, config: leverageLevers, isMutating }] = useLeverage();
    const nextLeverage = useRef(maxLeverage ?? 0);
    const onSave = (value)=>{
        return Promise.resolve().then(()=>{
            //   console.log("value", value);
            nextLeverage.current = value.leverage;
        });
    };
    const onSubmit = ()=>{
        if (nextLeverage.current === maxLeverage) return;
        update({
            leverage: nextLeverage.current
        }).then((res)=>{
            setOpen(false);
            toast.success("Leverage updated");
        }, (err)=>{
            ;
            toast.error(err.message);
        });
    };
    return /*#__PURE__*/ _jsxs(Dialog, {
        open: open,
        onOpenChange: setOpen,
        children: [
            /*#__PURE__*/ _jsx(DialogTrigger, {
                asChild: true,
                children: props.children
            }),
            /*#__PURE__*/ _jsxs(DialogContent, {
                onOpenAutoFocus: (e)=>e.preventDefault(),
                closable: true,
                children: [
                    /*#__PURE__*/ _jsx(DialogHeader, {
                        children: /*#__PURE__*/ _jsx(DialogTitle, {
                            children: "Account Leverage"
                        })
                    }),
                    /*#__PURE__*/ _jsxs(DialogBody, {
                        children: [
                            /*#__PURE__*/ _jsxs("div", {
                                className: "orderly-flex orderly-text-base-contrast-54 orderly-py-5 desktop:orderly-text-xs",
                                children: [
                                    /*#__PURE__*/ _jsx("div", {
                                        className: "orderly-flex-1",
                                        children: "Max account leverage"
                                    }),
                                    /*#__PURE__*/ _jsxs("div", {
                                        className: "orderly-flex orderly-gap-1",
                                        children: [
                                            /*#__PURE__*/ _jsx("span", {
                                                children: "Current:"
                                            }),
                                            /*#__PURE__*/ _jsx(Numeral, {
                                                className: "orderly-text-base-contrast",
                                                surfix: "x",
                                                children: currentLeverage
                                            })
                                        ]
                                    })
                                ]
                            }),
                            /*#__PURE__*/ _jsx("div", {
                                className: "ordelry-my-5 orderly-h-[80px]",
                                children: /*#__PURE__*/ _jsx(LeverageEditor, {
                                    maxLeverage: maxLeverage,
                                    leverageLevers: leverageLevers,
                                    onSave: onSave
                                })
                            })
                        ]
                    }),
                    /*#__PURE__*/ _jsxs(DialogFooter, {
                        children: [
                            /*#__PURE__*/ _jsx(Button, {
                                fullWidth: true,
                                color: "tertiary",
                                onClick: ()=>{
                                    setOpen(false);
                                },
                                children: "Cancel"
                            }),
                            /*#__PURE__*/ _jsx(Button, {
                                fullWidth: true,
                                onClick: ()=>onSubmit(),
                                loading: isMutating,
                                children: "Save"
                            })
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=leverageDialog.js.map