import { jsx as r, jsxs as d, Fragment as w } from "react/jsx-runtime";
import { useTheme as I, Box as x, Popper as P, ClickAwayListener as A, Fade as R, Paper as M, MenuList as T, MenuItem as b, LinearProgress as z, Divider as D } from "@mui/material";
import { useRef as N } from "react";
import { useMemoizedFn as p, useReactive as $, useMount as L, useCreation as F, useSize as U } from "ahooks";
import { Icon as l } from "@iconify/react";
import j from "@iconify-icons/material-symbols/add-circle-outline-rounded";
import E from "@iconify-icons/material-symbols/expand-more-rounded";
import H from "@iconify-icons/material-symbols/swap-horiz-rounded";
import _ from "lodash/pick";
import u from "./session-user-item.js";
import { getVisitorId as O } from "../../Util/index.js";
import { translate as V } from "../../Locale/util.js";
import { translations as q } from "../libs/translation.js";
function ne({
  session: s,
  onSwitch: m,
  isBlocklet: f = !0,
  locale: v = "en"
}) {
  const t = N(null), { palette: n } = I(), y = p((e, o = {}) => V(q, e, v, "en", o)), i = $({
    open: !1,
    userSessions: [],
    loadingSessionId: null
  });
  L(async () => {
    if (f) {
      const e = await s.getUserSessions();
      i.userSessions = e;
    }
  });
  const c = F(() => {
    const e = (i.userSessions || []).find(
      (o) => o.appPid === globalThis?.blocklet?.appPid && o.userDid === s?.user?.did
    );
    return e || {
      __isDefault: !0,
      appName: globalThis?.blocklet?.appName || globalThis?.env?.appName,
      appPid: globalThis?.blocklet?.appPid || globalThis?.env?.appPid,
      userDid: s?.user?.did,
      visitorId: O(),
      // passportId: '', // 无法从当前 session 获取 passportId 的值
      // updatedAt: '', // 当前 session 拼凑的信息无法得到 userSession 的更新时间
      user: _(s?.user, [
        "did",
        "sourceProvider",
        "fullName",
        "email",
        "avatar",
        "remark",
        "sourceAppPid",
        "role"
      ])
    };
  }, [i.userSessions, s?.user]), a = p((e = !i.open) => {
    i.open = e;
  }), S = U(t.current), h = p(() => {
    a(!1), m();
  }), C = p(async (e) => {
    try {
      i.loadingSessionId = e?.id, await m({ userSession: e }), a(!1);
    } finally {
      i.loadingSessionId = null;
    }
  });
  return f ? /* @__PURE__ */ d(w, { children: [
    /* @__PURE__ */ r(
      u,
      {
        sessionItem: c,
        statusContent: /* @__PURE__ */ r(
          x,
          {
            component: l,
            icon: E,
            className: "session-user-switch-icon",
            sx: {
              transform: "scale(1.5) rotate(-90deg)",
              transition: "transform 0.2s ease"
            }
          }
        ),
        sx: {
          borderRadius: 1,
          cursor: "pointer",
          py: 1.25,
          px: 2,
          "&:hover": {
            backgroundColor: `${n.grey[200]} !important`,
            ".session-user-switch-icon": {
              transform: "scale(1.5)"
            }
          }
        },
        onClick: () => a(),
        ref: t
      }
    ),
    /* @__PURE__ */ r(P, { open: i.open, anchorEl: t.current, transition: !0, sx: { zIndex: 1600 }, children: ({ TransitionProps: e }) => /* @__PURE__ */ r(
      A,
      {
        onClickAway: (o) => {
          o.preventDefault(), o.stopPropagation(), a(!1);
        },
        children: /* @__PURE__ */ r(R, { ...e, timeout: 350, children: /* @__PURE__ */ r(
          M,
          {
            variant: "outlined",
            sx: {
              borderRadius: 3,
              width: S?.width || 0,
              borderColor: "divider",
              mt: 0.5,
              border: "0 !important",
              boxShadow: `0px 8px 16px 0px ${n.grey[100]}, 0px 0px 0px 1px ${n.grey[100]}`
            },
            children: /* @__PURE__ */ d(T, { sx: { p: 0.5 }, children: [
              i.userSessions.map((o) => {
                const k = i.loadingSessionId === o.id, g = o.id === c.id;
                return /* @__PURE__ */ d(
                  b,
                  {
                    sx: {
                      position: "relative",
                      p: 0,
                      "&:hover": {
                        backgroundColor: `${n.grey[200]} !important`
                      }
                    },
                    onClick: () => {
                      g || C(o);
                    },
                    children: [
                      k && /* @__PURE__ */ r(
                        z,
                        {
                          sx: {
                            height: "2px",
                            position: "absolute",
                            top: 0,
                            left: 0,
                            right: 0
                          }
                        }
                      ),
                      /* @__PURE__ */ r(u, { sessionItem: o, active: g })
                    ]
                  },
                  o.id
                );
              }),
              i.userSessions.length > 0 ? /* @__PURE__ */ r(D, { sx: { m: "0!important", borderColor: "divider" } }) : null,
              /* @__PURE__ */ d(
                b,
                {
                  sx: {
                    color: "secondary.main",
                    borderRadius: 1,
                    "&:hover": {
                      backgroundColor: `${n.grey[200]} !important`
                    },
                    px: 1,
                    py: 1.5,
                    lineHeight: 1
                  },
                  onClick: h,
                  "data-cy": "sessionManager-switch-trigger",
                  children: [
                    /* @__PURE__ */ r(
                      x,
                      {
                        component: l,
                        icon: j,
                        sx: {
                          fontSize: 20,
                          mr: 0.5
                        }
                      }
                    ),
                    y("addAnotherAccount")
                  ]
                }
              )
            ] })
          }
        ) })
      }
    ) })
  ] }) : /* @__PURE__ */ r(
    u,
    {
      sessionItem: c,
      statusContent: /* @__PURE__ */ r(l, { icon: H, color: n.text.hint }),
      sx: {
        borderRadius: 1,
        cursor: "pointer",
        py: 1.25,
        px: 1.5
      },
      "data-cy": "sessionManager-switch-trigger",
      onClick: h,
      ref: t
    }
  );
}
export {
  ne as default
};
