"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "DesktopSharePnLContent", {
    enumerable: true,
    get: function() {
        return DesktopSharePnLContent;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _icon = require("../../icon");
const _react = require("react");
const _reacthottoast = /*#__PURE__*/ _interop_require_default(require("react-hot-toast"));
const _divider = require("../../divider");
const _poster = require("../poster");
const _provider = require("../../provider");
const _sharePnLUtils = require("./sharePnLUtils");
const _carousel = require("./desktop/carousel");
const _pnlFormat = require("./desktop/pnlFormat");
const _options = require("./desktop/options");
const _bottomBtns = require("./desktop/bottomBtns");
const _message = require("./desktop/message");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const DesktopSharePnLContent = (props)=>{
    const localPnlConfig = (0, _sharePnLUtils.getPnlInfo)();
    const [pnlFormat, setPnlFormat] = (0, _react.useState)(localPnlConfig.pnlFormat);
    const [shareOption, setShareOption] = (0, _react.useState)(new Set(localPnlConfig.options));
    const [selectedSnap, setSelectedSnap] = (0, _react.useState)(localPnlConfig.bgIndex);
    const [message, setMessage] = (0, _react.useState)(localPnlConfig.message);
    const [check, setCheck] = (0, _react.useState)(false);
    const { shareOptions } = (0, _react.useContext)(_provider.OrderlyAppContext);
    const { backgroundImages, ...resetOptions } = shareOptions.pnl;
    const [domain, setDomain] = (0, _react.useState)("");
    const posterRef = (0, _react.useRef)(null);
    (0, _react.useEffect)(()=>{
        const currentDomain = window.location.hostname;
        setDomain(currentDomain);
    }, []);
    const curBgImg = (0, _react.useMemo)(()=>{
        return shareOptions.pnl.backgroundImages[selectedSnap];
    }, [
        shareOptions.pnl.backgroundImages,
        selectedSnap
    ]);
    const posterData = (0, _sharePnLUtils.getPnLPosterData)(props.position, props.leverage, check ? message : "", domain, pnlFormat, shareOption, props.baseDp, props.quoteDp, props.referral);
    const onCopy = ()=>{
        posterRef.current?.copy().then(()=>{
            props.hide?.();
            _reacthottoast.default.success("Image copied");
        }).catch((e)=>{
            _reacthottoast.default.error(()=>{
                return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                    children: [
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                            children: "Copy failed"
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                            className: "orderly-text-2xs orderly-max-w-[396px] orderly-mt-2 orderly-text-base-contrast-54",
                            children: "Browser version outdated, please update in order to copy image to clipboard."
                        })
                    ]
                });
            });
        });
    };
    const onDownload = ()=>{
        posterRef.current?.download("Poster.png");
        props.hide?.();
    };
    const formats = [
        "roi_pnl",
        "roi",
        "pnl"
    ];
    const options = [
        "openPrice",
        "markPrice",
        "openTime",
        "leverage",
        "quantity"
    ];
    (0, _sharePnLUtils.savePnlInfo)(pnlFormat, shareOption, selectedSnap, message);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-h-full orderly-flex orderly-flex-col orderly-relative orderly-referral",
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex-1 orderly-h-full orderly-overflow-y-auto",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-h-[422px] orderly-mt-[36px]",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_poster.Poster, {
                                className: "orderly-mx-11",
                                width: 552,
                                height: 310,
                                data: {
                                    backgroundImg: curBgImg,
                                    ...resetOptions,
                                    data: posterData
                                },
                                ratio: 3,
                                ref: posterRef
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_carousel.CarouselBackgroundImage, {
                                backgroundImages: shareOptions.pnl.backgroundImages,
                                selectedSnap: selectedSnap,
                                setSelectedSnap: setSelectedSnap
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-px-10",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-mt-4",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                                        className: "orderly-text-lg orderly-h-[26px]",
                                        children: "PnL display format"
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                                        className: "orderly-pt-4 orderly-flex orderly-justify-start orderly-gap-3",
                                        children: formats.map((e)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_pnlFormat.PnlFormatView, {
                                                setPnlFormat: setPnlFormat,
                                                type: e,
                                                curType: pnlFormat
                                            }))
                                    })
                                ]
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_divider.Divider, {
                                className: "orderly-pt-6 orderly-border-white/10"
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                                className: "orderly-mt-4",
                                children: [
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                                        className: "orderly-text-lg orderly-h-[26px]",
                                        children: "Optional information to share"
                                    }),
                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                                        className: "orderly-mt-4 orderly-flex orderly-justify-start orderly-gap-4",
                                        children: options.map((item)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_options.ShareOption, {
                                                setShareOption: setShareOption,
                                                type: item,
                                                curType: shareOption
                                            }))
                                    })
                                ]
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_message.Message, {
                                message: message,
                                setMessage: setMessage,
                                check: check,
                                setCheck: setCheck
                            })
                        ]
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_bottomBtns.BottomButtons, {
                onClickCopy: onCopy,
                onClickDownload: onDownload
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
                onClick: ()=>{
                    props.hide();
                },
                className: "orderly-absolute orderly-top-0 orderly-right-0 orderly-w-[40px] orderly-h-[40px] orderly-flex orderly-justify-center orderly-items-center",
                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.CloseIcon, {
                    size: 12,
                    className: "orderly-fill-base-contrast-54"
                })
            })
        ]
    });
};

//# sourceMappingURL=desktopSharePnl.js.map