import { jsxs as i, Fragment as I, jsx as r } from "react/jsx-runtime";
import { useTheme as P, IconButton as A, Popper as B, Fade as F, Paper as R, Box as U, MenuList as z, MenuItem as T, LinearProgress as M, Divider as $ } from "@mui/material";
import { Icon as D } from "@iconify/react";
import W from "@iconify-icons/tabler/user";
import { useRef as _, useEffect as j, Fragment as N } from "react";
import { useMemoizedFn as s, useReactive as O } from "ahooks";
import Q from "lodash/noop";
import H from "@arcblock/icons/lib/DidBrandLogo";
import { useBrowser as K } from "@arcblock/react-hooks";
import { joinURL as V } from "ufo";
import X from "../../CloseButton/index.js";
import { translate as q } from "../../Locale/util.js";
import { translations as G } from "../libs/translation.js";
import J from "../../Typography/index.js";
import Y from "./quick-login-item.js";
import { getFederatedEnabled as Z, getMaster as oo } from "../../Util/federated.js";
import { BLOCKLET_SERVICE_PATH_PREFIX as eo } from "../../Util/constant.js";
function wo({ session: a, onLogin: f = Q, size: g = 24, dark: h = !1, locale: p = "en" }) {
  const { palette: u } = P(), x = s((o, n = {}) => q(G, o, p, "en", n)), b = new URLSearchParams(window.location.search), L = K(), d = _(null), e = O({
    open: !1,
    userSessions: [],
    loadingSessionId: null,
    loadAppLogoError: !1
  }), w = s((o = !e.open) => {
    e.open = o;
  }), v = s(({ openMode: o } = {}) => {
    a.login(f, { openMode: o });
  }), t = window?.blocklet, S = Z(t), c = oo(t), l = S && c ? c : t, y = l?.appName || "DID Connect", m = V(
    l?.appUrl || "/",
    l?.appLogo || `${eo}/blocklet/logo?imageFilter=convert&f=png&h=80`
  );
  j(() => {
    let o;
    return !L.arcSphere && b.get("showQuickConnect") !== "false" && (o = setTimeout(async () => {
      e.userSessions = await a.getUserSessions(), e.userSessions.length > 0 && (e.open = !0);
    }, 1500)), () => {
      clearTimeout(o);
    };
  }, []);
  const k = s(async (o) => {
    e.loadingSessionId = o.id;
    try {
      await a.loginUserSession({ ...o, appPid: t?.appPid });
    } catch (n) {
      console.error("session.loginUserSession.error", n);
    } finally {
      e.loadingSessionId = null;
    }
  });
  return /* @__PURE__ */ i(I, { children: [
    /* @__PURE__ */ r(
      A,
      {
        ref: d,
        "data-cy": "sessionManager-login",
        className: "arc-session-user-unlogin",
        size: "medium",
        onClick: v,
        "aria-label": "Login button",
        children: /* @__PURE__ */ r(
          D,
          {
            icon: W,
            fontSize: g,
            color: h ? "#fff" : "inherit",
            style: { transform: "scale(1.25)" }
          }
        )
      }
    ),
    /* @__PURE__ */ r(
      B,
      {
        open: e.open,
        anchorEl: d.current,
        transition: !0,
        sx: {
          zIndex: (o) => o.zIndex.appBar
        },
        placement: "bottom-end",
        modifiers: [
          {
            name: "offset",
            options: {
              offset: [0, 10]
              // [水平偏移, 垂直偏移]
            }
          }
        ],
        children: ({ TransitionProps: o }) => /* @__PURE__ */ r(F, { ...o, children: /* @__PURE__ */ i(
          R,
          {
            variant: "outlined",
            sx: {
              borderRadius: 1,
              width: 400,
              maxWidth: "90vw",
              borderColor: "divider",
              border: "0 !important",
              boxShadow: 4,
              overflow: "hidden"
            },
            children: [
              /* @__PURE__ */ i(
                U,
                {
                  sx: {
                    display: "flex",
                    alignItems: "center",
                    gap: 1,
                    p: 2,
                    borderBottom: "1px solid",
                    borderColor: "divider"
                  },
                  children: [
                    m && !e.loadAppLogoError ? /* @__PURE__ */ r(
                      "img",
                      {
                        src: m,
                        style: {
                          height: 20,
                          maxWidth: 100
                        },
                        onError: () => {
                          e.loadAppLogoError = !0;
                        },
                        alt: "Login App Logo"
                      }
                    ) : /* @__PURE__ */ r(H, { height: 24, width: 24 }),
                    /* @__PURE__ */ r(
                      J,
                      {
                        fontSize: "auto",
                        sx: {
                          fontSize: "16",
                          flex: 1,
                          color: "text.secondary",
                          // 最多展示三行
                          overflow: "hidden",
                          textOverflow: "ellipsis",
                          display: "-webkit-box",
                          WebkitLineClamp: 3,
                          WebkitBoxOrient: "vertical"
                        },
                        children: x("useQuickLogin", { name: y })
                      }
                    ),
                    /* @__PURE__ */ r(X, { onClose: () => w(!1) })
                  ]
                }
              ),
              /* @__PURE__ */ r(z, { sx: { p: 0, overflow: "hidden" }, children: e.userSessions.map((n, E) => {
                const C = e.loadingSessionId === n.id;
                return /* @__PURE__ */ i(N, { children: [
                  /* @__PURE__ */ i(
                    T,
                    {
                      sx: {
                        overflow: "hidden",
                        position: "relative",
                        p: 0,
                        bgcolor: "background.paper",
                        "&:hover": {
                          bgcolor: `${u.action.hover} !important`
                        }
                      },
                      onClick: () => {
                        k(n);
                      },
                      children: [
                        C && /* @__PURE__ */ r(
                          M,
                          {
                            sx: {
                              height: "2px",
                              position: "absolute",
                              top: 0,
                              left: 0,
                              right: 0
                            }
                          }
                        ),
                        /* @__PURE__ */ r(Y, { userSession: n, locale: p })
                      ]
                    },
                    n.id
                  ),
                  E < e.userSessions.length - 1 ? /* @__PURE__ */ r(
                    $,
                    {
                      sx: {
                        mx: 2,
                        my: "0px !important"
                      }
                    },
                    `${n.id}-divider`
                  ) : null
                ] }, `${n.id}-root`);
              }) })
            ]
          }
        ) })
      }
    )
  ] });
}
export {
  wo as default
};
