import { L as k } from "./LoginIcon-409b27ef.mjs";
import e, { useState as C, useRef as y, useEffect as I } from "react";
import { Trans as g } from "react-i18next";
import { b as h, u as w, F as f } from "./FetchConfigsUtils-476a602b.mjs";
import { B as S, b, c as U } from "./Button-c97a7217.mjs";
import { IamUserAuthorizationClient as F, EligibleUser as T } from "@accelbyte/sdk-iam";
import { C as B } from "./CommonError-e27d39d7.mjs";
import { A, a as R } from "./ArrowIcon-647b10f0.mjs";
import { L as H } from "./Loading-16af3910.mjs";
import { P as W } from "./ProfileImage-6c73026b.mjs";
import m from "classnames";
import { L as $ } from "./LogoutIcon-947c7425.mjs";
import { u as G } from "./useDiscoveryConfigs-cf63cd60.mjs";
import { N as O } from "./index-0462597a.mjs";
import { a as x, u as E } from "./useUserInfo-ad7006e5.mjs";
import { a as z } from "./useAppState-d73a6c6c.mjs";
const D = ({ currentLocation: t, returnPath: i }) => {
  const { state: r } = h(), [o] = w(), a = !t.includes(r.error.index.link) && t || null, s = () => {
    const l = new F(o).createLoginURL(i || a);
    window.location.replace(l);
  };
  return /* @__PURE__ */ e.createElement("div", { className: "loginButtonContainer" }, /* @__PURE__ */ e.createElement(S, { className: "loginButton", buttonType: b.TEXT, buttonStyle: U.WHITE, onClick: s }, /* @__PURE__ */ e.createElement(k, null), /* @__PURE__ */ e.createElement(g, { i18nKey: "Navigation.links.login" }, "Login")));
};
const K = ({
  user: t,
  userProfile: i,
  isFetching: r,
  wallet: o,
  error: n,
  toggleMenu: a,
  isMenuShown: s,
  isDisableUsername: l
}) => {
  const c = () => T.safeParse(t).success ? l ? t.displayName || t.userName : t.userName || t.displayName : null;
  return /* @__PURE__ */ e.createElement("div", { className: m("userProfileDropdown", s && "open"), onClick: () => a() }, !r && n && /* @__PURE__ */ e.createElement(B, { error: n }), !r && !n && i ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(W, { imageLink: i && i.avatarUrl || "", className: "userProfileImage" }), /* @__PURE__ */ e.createElement("div", { className: "userProfileContainer" }, /* @__PURE__ */ e.createElement("p", { className: "userProfileDisplayName" }, c()), o && /* @__PURE__ */ e.createElement("p", { className: "userProfileWallet" }, o.currencySymbol, " ", o.balance)), /* @__PURE__ */ e.createElement(A, { className: m(R.down, "arrowSize") })) : /* @__PURE__ */ e.createElement(H, null));
};
const M = ({ onLogout: t, showMenu: i, onClick: r, userDropdownMenus: o }) => {
  const n = !i, {
    state: { flags: a }
  } = G(), s = a == null ? void 0 : a.isGetLauncherVisible;
  return /* @__PURE__ */ e.createElement("nav", { className: m("userProfileNavContainer", n && "closed", !s && "right-0") }, o == null ? void 0 : o.map((l, c) => /* @__PURE__ */ e.createElement("div", { key: `menuLink-${c}` }, /* @__PURE__ */ e.createElement(O, { className: "userProfileNavLink", to: l.pathname, onClick: r }, l.icon && /* @__PURE__ */ e.createElement("i", { className: "userProfileNavLinkIcon" }, l.icon), /* @__PURE__ */ e.createElement("span", null, l.label)), l.isWithDivider && /* @__PURE__ */ e.createElement("div", { className: "navigationDivider" }))), /* @__PURE__ */ e.createElement(
    "button",
    {
      className: "userProfileNavLink",
      onClick: () => {
        t(), r();
      }
    },
    /* @__PURE__ */ e.createElement($, { className: "userProfileNavLinkIcon" }),
    /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(g, { i18nKey: "Navigation.links.logout" }, "Logout"))
  ));
};
function le({ onLogout: t, returnPath: i, isDisableUsername: r, userDropdownMenus: o }) {
  const {
    state: { location: n }
  } = x(), a = n.pathname, {
    state: { user: s }
  } = E();
  return /* @__PURE__ */ e.createElement(e.Fragment, null, !s && /* @__PURE__ */ e.createElement(D, { currentLocation: a, returnPath: i }), s && /* @__PURE__ */ e.createElement(V, { user: s, userDropdownMenus: o, onLogout: t, isDisableUsername: r }));
}
function V({ userDropdownMenus: t, user: i, onLogout: r, isDisableUsername: o }) {
  const [n, a] = C(!1), s = y(null), {
    state: { userProfile: l, userProfileFetchStatus: c, userFetchStatus: p }
  } = E(), N = z(), d = c === f.FETCHING || p === f.FETCHING;
  I(() => {
    const u = (P) => {
      n && !P.composedPath().includes(s.current) && a(!1);
    };
    return window.addEventListener("click", u), () => {
      window.removeEventListener("click", u);
    };
  }, [n]);
  const L = async () => {
    await N.logout(), r && r();
  }, v = () => {
    a(!n);
  };
  return /* @__PURE__ */ e.createElement("div", { className: "userAccountContainer", ref: s }, /* @__PURE__ */ e.createElement(
    K,
    {
      user: i,
      userProfile: l,
      wallet: null,
      error: null,
      isFetching: d,
      toggleMenu: v,
      isMenuShown: n,
      isDisableUsername: o
    }
  ), /* @__PURE__ */ e.createElement(
    M,
    {
      onClick: () => a(!1),
      onLogout: L,
      showMenu: n,
      userDropdownMenus: t
    }
  ));
}
export {
  le as L
};
