import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { AppearingComponent } from "../../Components/Appearing";
import { ContentLayout } from "../../Components/ContentLayout";
import { MaskedInput } from "antd-mask-input";
import { NextButton } from "./NextButton";
import { useEffect, useRef } from "react";
import { SpaceSpin } from "../../Components/Spin";
import { Tag, Tooltip } from "antd";
import { estimateUsernamePrice } from "../../utils/username";
import { useActions, useAppState } from "../../overmind";
import Paragraph from "antd/lib/typography/Paragraph";
export const DomainSelector = () => {
    const actions = useActions();
    const state = useAppState();
    const fuia = state.flows.user.create.formUsernameIsAvailable;
    const el = useRef({});
    const username = state.flows.user.create.form.username || "";
    useEffect(() => {
        if (state.flows.user.create.isLegacyUpdateOngoing) {
            actions.flows.user.create.updateForm({ ...state.api.auth.user });
        }
    }, []);
    const domainPrice = () => estimateUsernamePrice(username);
    const isPaidUsername = () => {
        const len = username.replace(/\.io/, "").length;
        return len > 1 && len <= 5 && !state.api.auth.user?.subscriptionStatus?.startsWith("io-domain-sale");
    };
    const isOneChar = () => {
        const len = username.replace(/\.io/, "").length;
        return len === 1 && !state.api.auth.user?.subscriptionStatus?.startsWith("io-domain-sale");
    };
    return (_jsxs(ContentLayout, { children: [_jsx(MaskedInput, { ref: el, className: fuia === "unavailable" ? "nl-domain-presale__masked-input masked-input-error" : "nl-domain-presale__masked-input", defaultValue: state.flows.user.create.form.username?.replace(/\.io$/, "") || "", size: "large", mask: "xxxxxxxxx.IO", placeholderChar: "\u200C", onChange: (v) => {
                    actions.flows.user.create.updateForm({
                        username: v.target.value.replace(/\u200c/g, "").toLowerCase(),
                    });
                }, formatCharacters: {
                    x: {
                        validate: function (char) {
                            return /^[a-z1-5\.]$/.test(char);
                        },
                        transform: function (char) {
                            return char.toLowerCase();
                        },
                    },
                } }), _jsx(SpaceSpin, { isRotating: fuia === "checking" }), fuia === "unavailable" && _jsxs(Tag, { className: "u-margin-top-medium", children: ["Name is ", fuia] }), _jsxs(Paragraph, { className: "paragraph-2r nl-domain-presale__footer-paragraph", children: [isOneChar() ? (_jsxs(AppearingComponent, { seconds: 1, children: ["To purchase a one character domain please", " ", _jsx("a", { href: "https://t.me/joinchat/Ezz_sQzaOK2j977siawwGQ", target: "_new", children: "contact us" }), "."] })) : (_jsx(_Fragment, {})), isPaidUsername() && !state.flows.user.create.legacyToken ? (_jsxs(AppearingComponent, { seconds: 1, children: [_jsx("br", {}), state.config.featureFlags.onboarding.premiumDomains ? (_jsxs(_Fragment, { children: ["Premium usernames of 5 and fewer characters must be purchased.", _jsx("br", {}), "Estimated price: ", domainPrice(), _jsx("br", {}), "Click Next to continue."] })) : (_jsxs(_Fragment, { children: ["For early access please contact\u00A0", _jsx("a", { href: "https://t.me/joinchat/Ezz_sQzaOK2j977siawwGQ", target: "_new", children: "our support team" }), "."] }))] })) : (""), state.flows.user.create.legacyToken &&
                        (state.flows.user.create.form.displayName !== state.flows.user.create.form.username || fuia === "unavailable") ? (_jsxs(_Fragment, { children: [_jsx(Tooltip, { title: _jsx(_Fragment, { children: "Your Newlife identity is now a part of the Newcoin ecosystem and provides access to many exciting services. You may keep your current username as the display name on Newlife on the next dialog." }), children: _jsx("span", { children: "Why is my username changing?" }) }), "\u00A0", _jsxs("a", { href: "/", onClick: () => actions.flows.user.create.stopLegacyImport(), children: ["I am not ", state.flows.user.create.legacyUsername] })] })) : ("")] }), _jsx(NextButton, {})] }));
};
//# sourceMappingURL=DomainSelector.js.map