@particle-network/authkit
Version:
Auth Core provides MPC (Multi-Party Computation)-based threshold signatures.
94 lines (90 loc) • 5.15 kB
JavaScript
"use client";
import {
circle_close_default2 as circle_close_default,
useAuthCoreModal,
useCustomNavigate,
useParticleAuth,
useTranslation
} from "./chunk-NTK434GA.mjs";
import "./chunk-55PCA22M.mjs";
// src/pages/account/wrongPasswordModal/index.tsx
import { useInterval } from "ahooks";
import { Button, Modal } from "antd";
import React, { useEffect, useState } from "react";
// src/pages/account/wrongPasswordModal/index.less
var wrongPasswordModal_default = ".ant-modal-content .ant-modal-footer {\n display: none;\n}\n.wrong-password-content {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.wrong-password-content .modal-title {\n font-size: 22px;\n font-weight: bold;\n position: relative;\n top: 7px;\n margin-bottom: 12px;\n}\n.wrong-password-content .tip {\n padding-right: 10px;\n padding-left: 10px;\n margin-top: 16px;\n margin-bottom: 20px;\n font-weight: 400;\n font-size: 17px;\n line-height: 1.3;\n text-align: center;\n color: var(--secondary-text-color);\n}\n.wrong-password-content .frozen-countdown {\n margin-top: 12px;\n margin-bottom: 22px;\n font-weight: bold;\n font-size: 24px;\n color: var(--text-color);\n}\n.wrong-password-content .btn {\n width: 100%;\n height: 47px;\n margin-top: 10px;\n border-radius: var(--primary-btn-border-radius);\n font-size: var(--primary-btn-font-size);\n color: var(--primary-btn-color);\n background: var(--primary-btn-background-color);\n opacity: 1;\n}\n.wrong-password-content .close-icon {\n align-self: flex-end;\n}\n";
// src/pages/account/wrongPasswordModal/index.tsx
var WrongPasswordModal = ({ info }) => {
var _a;
const { t } = useTranslation();
const { setWrongPassword, setPaymentVerify, userInfo, showSelectSecurityAccount } = useParticleAuth();
const navigate = useCustomNavigate();
const forgotPassword = () => {
setWrongPassword({ visible: false });
setPaymentVerify({ visible: false });
chooseVerifyType();
};
const { authCoreModal } = useAuthCoreModal();
const chooseVerifyType = () => {
var _a2, _b, _c, _d;
if (((_a2 = userInfo == null ? void 0 : userInfo.security_account) == null ? void 0 : _a2.email) && ((_b = userInfo == null ? void 0 : userInfo.security_account) == null ? void 0 : _b.phone)) {
showSelectSecurityAccount(true);
} else {
navigate("/account/set-password", {
state: {
account: ((_c = userInfo == null ? void 0 : userInfo.security_account) == null ? void 0 : _c.email) || ((_d = userInfo == null ? void 0 : userInfo.security_account) == null ? void 0 : _d.phone)
}
});
}
};
const retry = () => {
setWrongPassword({ visible: false });
};
const [interval, setInterval] = useState();
const [countdown, setCountdown] = useState(((_a = info.accountFrozen) == null ? void 0 : _a.seconds) || 0);
useInterval(() => {
const result = countdown - 1;
setCountdown(result);
if (result <= 0) {
setInterval(void 0);
retry();
}
}, interval);
useEffect(() => {
if (info.accountFrozen) {
setCountdown(info.accountFrozen.seconds);
setInterval(1e3);
}
return () => {
setInterval(void 0);
};
}, [info.accountFrozen]);
const formatTime = (seconds) => {
let h = Math.floor(seconds / 60 / 60);
h = h < 10 ? "0" + h : h;
let m = Math.floor(seconds / 60 % 60);
m = m < 10 ? "0" + m : m;
let s = Math.floor(seconds % 60);
s = s < 10 ? "0" + s : s;
return h + ":" + m + ":" + s;
};
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("style", null, wrongPasswordModal_default), /* @__PURE__ */ React.createElement(
Modal,
{
open: info.visible,
closable: false,
centered: true,
okButtonProps: { style: { display: "none" } },
cancelButtonProps: { style: { display: "none" } },
getContainer: () => {
return authCoreModal.rootBody;
}
},
/* @__PURE__ */ React.createElement("div", { className: "wrong-password-content" }, /* @__PURE__ */ React.createElement(circle_close_default, { className: "close-icon", onClick: retry }), info.accountFrozen ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "modal-title" }, t("account.incorrect_payment_password")), /* @__PURE__ */ React.createElement("div", { className: "tip m-margin-top-20" }, t("account.incorrect_tip2"))) : /* @__PURE__ */ React.createElement("div", { className: "tip m-margin-top-20" }, t("account.incorrect_tip1")), info.accountFrozen && /* @__PURE__ */ React.createElement("div", { className: "frozen-countdown" }, formatTime(countdown)), /* @__PURE__ */ React.createElement(Button, { className: "btn", onClick: forgotPassword }, t("account.forgot_password")), !info.accountFrozen && /* @__PURE__ */ React.createElement(Button, { className: "btn", onClick: retry }, t("account.retry")))
));
};
var wrongPasswordModal_default2 = WrongPasswordModal;
export {
wrongPasswordModal_default2 as default
};
//# sourceMappingURL=wrongPasswordModal-YTPV3SS6.mjs.map