@particle-network/authkit
Version:
Auth Core provides MPC (Multi-Party Computation)-based threshold signatures.
105 lines (101 loc) • 5.94 kB
JavaScript
"use client";
import {
loading2_default
} from "./chunk-LXWNDWF5.mjs";
import {
getAccountList
} from "./chunk-ILZTEM77.mjs";
import {
header_default
} from "./chunk-55LX7B3D.mjs";
import "./chunk-C3QCRACD.mjs";
import "./chunk-PPCDDBBD.mjs";
import {
getLoginLogos,
useCustomNavigate,
useMessage_default,
useParticleAuth,
useTranslation,
useUserInfo
} from "./chunk-H5PUG6U3.mjs";
import "./chunk-55PCA22M.mjs";
// src/pages/account/loginAccountBindLoading/index.tsx
import { bindLoginAccount } from "@particle-network/auth-core";
import { useDebounceEffect } from "ahooks";
import { Button } from "antd";
import React, { useMemo, useState } from "react";
// src/pages/account/loginAccountBindLoading/index.less
var loginAccountBindLoading_default = ".account-bind-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.account-bind-container .particle-connect-form-contaier {\n flex: 1;\n}\n.account-bind-container .particle-loading,\n.account-bind-container .result-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n padding-bottom: 100px;\n font-size: 18px;\n color: var(--text-color);\n position: relative;\n}\n.account-bind-container .particle-loading .loading-wrap,\n.account-bind-container .result-content .loading-wrap {\n position: relative;\n}\n.account-bind-container .particle-loading .loading-wrap .logo-img,\n.account-bind-container .result-content .loading-wrap .logo-img {\n width: 100px;\n height: 100px;\n font-size: 110px;\n}\n.account-bind-container .particle-loading .loading-wrap .particle-loading-img,\n.account-bind-container .result-content .loading-wrap .particle-loading-img {\n width: 100%;\n height: 100%;\n animation: loading-inner 1.5s linear infinite;\n}\n.account-bind-container .particle-loading .loading-wrap h3,\n.account-bind-container .result-content .loading-wrap h3 {\n color: var(--text-color);\n}\n.account-bind-container .particle-loading .loading-wrap p,\n.account-bind-container .result-content .loading-wrap p {\n font-size: 14px;\n color: var(--secondary-text-color);\n position: absolute;\n width: 110%;\n height: 110%;\n margin: 0;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.account-bind-container .link_btn {\n width: auto;\n height: 32px;\n font-size: 14px;\n}\n.account-bind-container .result-content .back {\n margin-top: 40px;\n}\n.account-bind-container .result-content .back button {\n display: flex;\n align-items: center;\n}\n@keyframes loading-inner {\n 0% {\n transform: rotate(0deg);\n }\n 50% {\n transform: rotate(180deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n";
// src/pages/account/loginAccountBindLoading/index.tsx
var LoginAccountBindLoading = (props) => {
const state = props;
const { authType = "google", verifyToken, code } = state;
const navigate = useCustomNavigate();
const { modalOptions } = useParticleAuth();
const { t } = useTranslation();
const [loading, setLoading] = useState(true);
const { userInfo } = useUserInfo();
const message = useMessage_default();
const accountList = useMemo(() => {
return getAccountList({ userInfo, t });
}, [userInfo, t]);
const authItem = useMemo(() => {
const item = accountList.find((item2) => item2.type.replace(/v1$/, "") == authType) || {};
return {
...item
};
}, [accountList, state]);
useDebounceEffect(
() => {
if (authType && verifyToken) {
bindLoginAccount({
provider: authType,
thirdparty_code: code,
security_account_verify_token: verifyToken,
version: "v2"
}).then((res) => {
setLoading(false);
}).catch((error) => {
let msg = error.message;
if ((error == null ? void 0 : error.error_code) === 20109) {
const tKey = `error.server_${authType}_20109`;
const details = t(tKey);
if (details && details != tKey) {
msg = details;
}
}
message.error(msg);
setTimeout(() => {
navigate("/account/security", { replace: true });
});
});
}
},
[authType, verifyToken],
{
wait: 50
}
);
return /* @__PURE__ */ React.createElement("div", { className: "account-bind-container" }, /* @__PURE__ */ React.createElement("style", null, loginAccountBindLoading_default), /* @__PURE__ */ React.createElement(header_default, { displayBackBtn: true }), /* @__PURE__ */ React.createElement("div", { className: "particle-connect-form-contaier center-center flex-column" }, loading ? /* @__PURE__ */ React.createElement("div", { className: "particle-loading" }, /* @__PURE__ */ React.createElement("div", { className: "loading-wrap" }, /* @__PURE__ */ React.createElement(
"img",
{
src: getLoginLogos(modalOptions.themeType)[authType] || "",
className: "logo-img logo-img-2",
alt: "logo"
}
), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("img", { className: "particle-loading-img", src: loading2_default, alt: "" })))) : /* @__PURE__ */ React.createElement("div", { className: "result-content resultsuccess" }, /* @__PURE__ */ React.createElement("img", { src: authItem == null ? void 0 : authItem.icon, alt: "" }), /* @__PURE__ */ React.createElement("div", { className: "info" }, "Binding succeeded\uFF01"), /* @__PURE__ */ React.createElement("div", { className: "back" }, /* @__PURE__ */ React.createElement(
Button,
{
type: "primary",
onClick: () => {
navigate("/account/security", { replace: true });
}
},
"Back"
)))));
};
var loginAccountBindLoading_default2 = LoginAccountBindLoading;
export {
loginAccountBindLoading_default2 as default
};
//# sourceMappingURL=loginAccountBindLoading-7CTCV4TN.mjs.map