import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
// import "./styles/UserInviteInfo.less";
import { Button, Col, Modal, Row } from "antd";
import { ContentLayout } from "../../Components/ContentLayout";
import { CopyClipboardHashInput } from "../../Components/CopyClipboardHashInput";
import { CrossCircle } from "../../Components/Icons/CrossCircle";
import { useAppState } from "../../overmind";
import { useState } from "react";
const UserInviteInfo = ({ invitedUsername, setStatus, form, hash, }) => {
    const state = useAppState();
    const [visible, setVisible] = useState(true);
    if (hash) {
        navigator.clipboard.writeText(window.location.origin + `?invite=${hash}`);
    }
    const user = state.api.auth.user;
    const numberOfInvites = user.availableInvites || 0;
    return (_jsx(Modal, { closeIcon: _jsx(CrossCircle, {}), visible: visible, footer: null, className: "nl-white-box-modal", onCancel: () => {
            setStatus("start");
            setVisible(false);
            form.resetFields();
        }, children: _jsx(ContentLayout, { children: _jsxs(Row, { className: "user-invite-info_modal-root-row", children: [_jsxs(Row, { style: { flexDirection: "column", justifyContent: "start" }, className: "u-margin-top-medium", children: [_jsx(Col, { className: "user-invite-info_modal-center-text-col", children: _jsxs("p", { className: "header-1b text-center", children: [numberOfInvites, " invites left"] }) }), _jsx(Col, { className: "user-invite-info_modal-center-text-col", children: invitedUsername && (_jsxs("p", { className: "paragraph-1r text-center", children: ["you invited ", _jsx("span", { className: "paragraph-1b", children: invitedUsername })] })) }), _jsx(Col, { children: _jsxs("p", { className: "paragraph-1r text-left u-margin-top-large", children: ["Copy your unique invite code to send to ", invitedUsername, ". This code is a one-off and can be used on sign up."] }) })] }), _jsxs(Col, { className: "user-invite-info_modal-footer-col", children: [hash && _jsx(CopyClipboardHashInput, { hash: hash, highlight: true }), _jsx(Button, { type: "primary", className: "u-margin-top-large", onClick: () => {
                                    setStatus("start");
                                    setVisible(false);
                                    form.resetFields();
                                }, children: "Invite more friends" }), _jsxs("p", { className: "text-left paragraph-2b u-margin-top-large", children: ["Need help? ", _jsx("span", { className: "paragraph-2u", children: "Join our telegram group" })] })] })] }) }) }));
};
export default UserInviteInfo;
//# sourceMappingURL=UserInviteInfo.js.map