"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const antd_1 = require("antd");
const react_1 = require("react");
const sign_up_1 = require("components/auth/sign-up");
const sso_1 = __importDefault(require("components/auth/sso"));
const misc_1 = require("@cocalc/util/misc");
const icon_1 = require("@cocalc/frontend/components/icon");
const post_1 = __importDefault(require("lib/api/post"));
const router_1 = require("next/router");
const awaiting_1 = require("awaiting");
function Upgrade({ style }) {
    const [terms, setTerms] = (0, react_1.useState)(false);
    return ((0, jsx_runtime_1.jsxs)("div", { style: style, children: [(0, jsx_runtime_1.jsx)(sign_up_1.TermsCheckbox, { onChange: setTerms, checked: terms }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), terms && (0, jsx_runtime_1.jsx)(EmailPassword, {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), terms && ((0, jsx_runtime_1.jsx)(sso_1.default, { style: { margin: "5px 0" }, header: (0, jsx_runtime_1.jsx)("h3", { style: { marginBottom: "10px" }, children: "Or Use Single Sign On" }) }))] }));
}
exports.default = Upgrade;
function EmailPassword() {
    const router = (0, router_1.useRouter)();
    const [success, setSuccess] = (0, react_1.useState)(false);
    const [error, setError] = (0, react_1.useState)("");
    const [email_address, setEmailAddress] = (0, react_1.useState)("");
    const [password, setPassword] = (0, react_1.useState)("");
    async function setEmailAndPassword() {
        setError("");
        try {
            await (0, post_1.default)("/accounts/set-email-address", {
                email_address,
                password,
            });
            setSuccess(true);
            // send them to configure their name, which is a good next step...
            router.push("/config/account/name");
            await (0, awaiting_1.delay)(1000);
            // need to force reload to know that they are no longer anonymous.
            router.reload();
        }
        catch (err) {
            setError(err.message);
        }
    }
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h3", { children: "Set an Email Address and Password" }), error && ((0, jsx_runtime_1.jsx)(antd_1.Alert, { type: "error", showIcon: true, message: error, style: { marginTop: "15px" } })), (0, jsx_runtime_1.jsxs)(antd_1.Space, { style: { width: "100%" }, children: [(0, jsx_runtime_1.jsx)(antd_1.Input, { disabled: success, style: { fontSize: "12pt" }, placeholder: "Email address", autoComplete: "username", value: email_address, onChange: (e) => {
                            setEmailAddress(e.target.value);
                            setError("");
                        } }), (0, jsx_runtime_1.jsx)(antd_1.Input.Password, { disabled: success, style: { fontSize: "12pt" }, value: password, placeholder: "Password", autoComplete: "new-password", onChange: (e) => {
                            setPassword(e.target.value);
                            setError("");
                        }, onPressEnter: setEmailAndPassword }), (0, jsx_runtime_1.jsx)(antd_1.Button, { type: "primary", disabled: success || !email_address || password.length < 6, style: { height: "35px" }, onClick: setEmailAndPassword, children: success ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(icon_1.Icon, { name: "check", style: { marginRight: "5px" } }), " Saved"] })) : email_address.length > 0 &&
                            !(0, misc_1.is_valid_email_address)(email_address) ? ("Enter valid email") : password.length > 0 && password.length < 6 ? ("At least 6 characters") : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(icon_1.Icon, { name: "check", style: { marginRight: "5px" } }), " Save"] })) })] })] }));
}
//# sourceMappingURL=upgrade.js.map