import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { TradingView, TradingViewSDKLocalstorageKey } from "@orderly.network/trading-view";
import { Popover, PopoverContent, PopoverTrigger } from "../../../../popover";
import { useState } from "react";
import { SymbolProvider } from "../../../../provider/symbolProvider";
import { toast } from "../../../../toast";
import { useOrderEntry, useSymbolsInfo } from "@orderly.network/hooks";
import { CloseBaseConfirm } from "../../../../block/positions/full/marketConfirmDialog";
import { OrderSide, OrderType } from "@orderly.network/types";
import { Decimal } from "@orderly.network/utils";
import { Spinner } from "../../../../spinner";
import TopBar from "../../../../page/trading/desktop/myTradingview/topBar";
export default function MyTradingView({ symbol, tradingViewConfig }) {
    const [open, setOpen] = useState(false);
    const [side, setSide] = useState(OrderSide.BUY);
    const { helper, onSubmit, submitting } = useOrderEntry(symbol, side, true);
    const symbolInfo = useSymbolsInfo()[symbol];
    const [orderData, setOrderData] = useState();
    const [openSetting, setOpenSetting] = useState(false);
    const [openIndicators, setOpenIndicators] = useState(false);
    const [interval, setInterval] = useState(()=>{
        const lastUsedInterval = localStorage.getItem(TradingViewSDKLocalstorageKey.interval);
        if (!lastUsedInterval) {
            return "1";
        }
        return lastUsedInterval;
    });
    const [lineType, setLineType] = useState(()=>{
        const lastUsedLineType = localStorage.getItem(TradingViewSDKLocalstorageKey.lineType);
        if (!lastUsedLineType) {
            return "1";
        }
        return lastUsedLineType;
    });
    const [displayControlState, setDisplayControlState] = useState(()=>{
        const displaySettingInfo = localStorage.getItem(TradingViewSDKLocalstorageKey.displayControlSetting);
        if (displaySettingInfo) {
            return JSON.parse(displaySettingInfo);
        }
        return {
            position: true,
            buySell: true,
            limitOrders: true,
            stopOrders: true,
            tpsl: true,
            positionTpsl: true
        };
    });
    const positionControlCallback = ()=>{
        setOpen(true);
    };
    const closePositionConfirmCallback = (data)=>{
        const side = new Decimal(data.balance).greaterThan(0) ? OrderSide.SELL : OrderSide.BUY;
        const order = {
            //   order_price: undefined,
            order_quantity: data.balance,
            symbol: symbol,
            order_type: OrderType.MARKET,
            side,
            reduce_only: true
        };
        setOrderData(order);
        setSide(side);
        setOpen(true);
    };
    const onConfirm = async ()=>{
        orderData.order_quantity = Math.abs(orderData.order_quantity);
        return onSubmit(orderData).then((res)=>{
            setOpen(false);
        }, (error)=>{
            if (typeof error === "string") {
                toast.error(error);
                return;
            }
            toast.error(error.message);
        });
    };
    const changeInterval = (newInterval)=>{
        localStorage.setItem(TradingViewSDKLocalstorageKey.interval, newInterval);
        setInterval(newInterval);
    };
    const changeLineType = (newLineType)=>{
        localStorage.setItem(TradingViewSDKLocalstorageKey.lineType, newLineType);
        setLineType(newLineType);
    };
    const changeDisplaySetting = (newSetting)=>{
        localStorage.setItem(TradingViewSDKLocalstorageKey.displayControlSetting, JSON.stringify(newSetting));
        setDisplayControlState(newSetting);
    };
    const onClose = ()=>{
        setOpen(false);
    };
    return /*#__PURE__*/ _jsx("div", {
        className: "orderly-flex orderly-flex-col",
        style: {
            position: "relative",
            width: "100%",
            height: "100%"
        },
        children: /*#__PURE__*/ _jsxs(SymbolProvider, {
            symbol: symbol,
            children: [
                /*#__PURE__*/ _jsx(TopBar, {
                    changeInterval: (interval)=>changeInterval(interval),
                    openSettingDialog: ()=>setOpenSetting(!openSetting),
                    openIndicatorsDialog: ()=>setOpenIndicators(!openIndicators),
                    changeLineType: (type)=>changeLineType(type),
                    interval: interval,
                    lineType: lineType,
                    displayControlState: displayControlState,
                    changeDisplaySetting: changeDisplaySetting
                }),
                /*#__PURE__*/ _jsxs("div", {
                    className: "orderly-flex-1",
                    children: [
                        /*#__PURE__*/ _jsx(TradingView, {
                            symbol: symbol,
                            interval: interval.toString(),
                            libraryPath: tradingViewConfig?.library_path,
                            tradingViewScriptSrc: tradingViewConfig?.scriptSRC,
                            tradingViewCustomCssUrl: tradingViewConfig?.customCssUrl,
                            overrides: tradingViewConfig?.overrides,
                            studiesOverrides: tradingViewConfig?.studiesOverrides,
                            closePositionConfirmCallback: closePositionConfirmCallback,
                            topToolbarOpenSetting: openSetting,
                            topToolbarOpenIndicators: openIndicators,
                            topToolbarLineType: lineType,
                            onToast: toast,
                            loadingElement: /*#__PURE__*/ _jsx(Spinner, {}),
                            positionControlCallback: positionControlCallback,
                            displayControlSetting: displayControlState,
                            colorConfig: tradingViewConfig?.colorConfig
                        }),
                        /*#__PURE__*/ _jsxs(Popover, {
                            onOpenChange: setOpen,
                            open: open,
                            children: [
                                /*#__PURE__*/ _jsx(PopoverTrigger, {
                                    asChild: true,
                                    children: /*#__PURE__*/ _jsx("div", {
                                        style: {
                                            position: "absolute",
                                            width: "0",
                                            height: "0",
                                            left: "50%",
                                            top: "50%"
                                        }
                                    })
                                }),
                                /*#__PURE__*/ _jsx(PopoverContent, {
                                    align: "start",
                                    side: "top",
                                    className: "orderly-w-[340px]",
                                    children: /*#__PURE__*/ _jsx(CloseBaseConfirm, {
                                        base: symbolInfo("base"),
                                        quantity: orderData?.order_quantity ?? 0,
                                        onClose: onClose,
                                        onConfirm: onConfirm,
                                        submitting: submitting
                                    })
                                })
                            ]
                        })
                    ]
                })
            ]
        })
    });
}

//# sourceMappingURL=index.js.map