import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useModal } from "../../modal";
import { create } from "../../modal/modalHelper";
import { Sheet, SheetContent, SheetHeader } from "../../sheet/sheet";
import { Dialog, DialogContent } from "../../dialog/dialog";
import { useLeverage, useMediaQuery, useSymbolsInfo } from "@orderly.network/hooks";
import { MEDIA_TABLET } from "@orderly.network/types";
import { useEffect, useState } from "react";
import { DesktopSharePnLContent } from "./desktopSharePnl";
import { MobileSharePnLContent } from "./mobileSharePnl";
export const SharePoisitionView = create((props)=>{
    const isTablet = useMediaQuery(MEDIA_TABLET);
    const { position } = props;
    const [leverage] = useLeverage();
    const symbolInfo = useSymbolsInfo();
    if (symbolInfo.isNil) return null;
    const base_dp = symbolInfo[position.symbol]("base_dp");
    const quote_dp = symbolInfo[position.symbol]("quote_dp");
    return isTablet ? /*#__PURE__*/ _jsx(MobileSharePnL, {
        position: position,
        leverage: leverage,
        baseDp: base_dp,
        quoteDp: quote_dp
    }) : /*#__PURE__*/ _jsx(DesktopSharePnL, {
        position: position,
        leverage: leverage,
        baseDp: base_dp,
        quoteDp: quote_dp
    });
});
const MobileSharePnL = (props)=>{
    const { leverage, position, baseDp, quoteDp } = props;
    const { visible, hide, resolve, reject, onOpenChange } = useModal();
    return /*#__PURE__*/ _jsx(Sheet, {
        open: visible,
        onOpenChange: onOpenChange,
        children: /*#__PURE__*/ _jsxs(SheetContent, {
            id: "orderly-referral-mweb-bg",
            className: "orderly-px-4",
            onOpenAutoFocus: (e)=>e.preventDefault(),
            onCloseAutoFocus: (e)=>e.preventDefault(),
            children: [
                /*#__PURE__*/ _jsx(SheetHeader, {
                    id: "orderly-asset-and-margin-sheet-title",
                    children: "PnL Sharing"
                }),
                /*#__PURE__*/ _jsx(MobileSharePnLContent, {
                    position: position,
                    leverage: leverage,
                    hide: hide,
                    baseDp: baseDp,
                    quoteDp: quoteDp
                })
            ]
        })
    });
};
const DesktopSharePnL = (props)=>{
    const { leverage, position, baseDp, quoteDp } = props;
    const { visible, hide, resolve, reject, onOpenChange } = useModal();
    const [viewportHeight, setViewportHeight] = useState(window.innerHeight < 900 ? 660 : 807);
    useEffect(()=>{
        const handleResize = ()=>{
            setViewportHeight(window.innerHeight < 900 ? 660 : 807);
        };
        window.addEventListener("resize", handleResize);
        return ()=>{
            window.removeEventListener("resize", handleResize);
        };
    }, []);
    return /*#__PURE__*/ _jsx(Dialog, {
        open: visible,
        onOpenChange: onOpenChange,
        children: /*#__PURE__*/ _jsx(DialogContent, {
            className: "orderly-shadow-lg orderly-w-[640px] orderly-bg-base-800 desktop:orderly-max-w-[640px] orderly-py-0",
            style: {
                height: `${viewportHeight}px`
            },
            autoFocus: false,
            onOpenAutoFocus: (e)=>e.preventDefault(),
            onCloseAutoFocus: (e)=>e.preventDefault(),
            children: /*#__PURE__*/ _jsx("div", {
                id: "orderly-referral-desktop-bg",
                style: {
                    height: `${viewportHeight}px`
                },
                children: /*#__PURE__*/ _jsx(DesktopSharePnLContent, {
                    position: position,
                    leverage: leverage,
                    hide: hide,
                    baseDp: baseDp,
                    quoteDp: quoteDp
                })
            })
        })
    });
};

//# sourceMappingURL=sharePosition.js.map