import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { ADAPTER_STATUS, log } from "@web3auth/base";
import { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { LOGO, MODAL_STATUS } from "../interfaces";
import Icon from "./Icon";
import Image from "./Image";
const closeIcon = _jsx(Icon, { iconName: "close" });
export default function DetailedLoader(props) {
    const { adapter, message, adapterLogo, appLogo, modalStatus, adapterName, onClose } = props;
    const providerIcon = _jsx(Image, { imageId: `login-${adapter}` });
    const [t] = useTranslation();
    useEffect(() => {
        log.debug("adapter loader re-rendering");
        if (modalStatus === MODAL_STATUS.CONNECTED) {
            setTimeout(() => {
                onClose();
            }, 3000);
        }
    }, [modalStatus, onClose]);
    return modalStatus !== MODAL_STATUS.INITIALIZED ? (_jsxs("div", Object.assign({ className: "w3ajs-modal-loader w3a-modal__loader" }, { children: [_jsx("div", Object.assign({ className: "w3a-modal__loader-content" }, { children: _jsxs("div", Object.assign({ className: "w3a-modal__loader-info" }, { children: [modalStatus === MODAL_STATUS.CONNECTING && (_jsxs(_Fragment, { children: [_jsxs("div", Object.assign({ className: "w3a-modal__loader-bridge" }, { children: [_jsx("div", Object.assign({ className: ["w3a-modal__loader-app-logo", adapterLogo || appLogo ? "w3a-modal__loader-app-logo--default" : ""].join(" ") }, { children: _jsx("img", { src: adapterLogo || LOGO, alt: "" }) })), _jsx("div", Object.assign({ className: "w3a-modal__connector" }, { children: _jsxs("div", Object.assign({ className: "w3a-modal__connector-beat" }, { children: [_jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {})] })) })), _jsx("div", Object.assign({ className: "w3a-modal__loader-social-logo" }, { children: providerIcon }))] })), _jsxs("div", { children: [_jsx("div", Object.assign({ className: "w3a-modal__loader-bridge-message" }, { children: t("modal.adapter-loader.message1", { adapter: adapterName }) })), _jsx("div", Object.assign({ className: "w3a-modal__loader-bridge-message" }, { children: t("modal.adapter-loader.message2", { adapter: adapterName }) }))] })] })), modalStatus === ADAPTER_STATUS.CONNECTED && (_jsxs("div", Object.assign({ className: "flex flex-col items-center" }, { children: [_jsx(Icon, { iconName: "connected" }), _jsx("div", Object.assign({ className: "w3ajs-modal-loader__message w3a-spinner-message mt-4" }, { children: message }))] }))), modalStatus === ADAPTER_STATUS.ERRORED && (_jsx("div", Object.assign({ className: "w3ajs-modal-loader__message w3a-spinner-message w3a-spinner-message--error" }, { children: message })))] })) })), (modalStatus === ADAPTER_STATUS.CONNECTED || modalStatus === ADAPTER_STATUS.ERRORED) && (_jsx("button", Object.assign({ type: "button", className: "w3a-header__button w3ajs-loader-close-btn", onClick: onClose }, { children: closeIcon })))] }))) : null;
}
//# sourceMappingURL=AdapterLoader.js.map