import { jsx as o, jsxs as h } from "react/jsx-runtime";
import { useEffect as y } from "react";
import { Box as s, Typography as v } from "@mui/material";
import { ROLES as x } from "@abtnode/constant";
import { useMemoizedFn as b, useCreation as l } from "ahooks";
import { translate as S } from "@arcblock/ux/lib/Locale/util";
import { useLocaleContext as C } from "@arcblock/ux/lib/Locale/context";
import { mergeSx as w } from "@arcblock/ux/lib/Util/style";
import L from "@arcblock/react-hooks/lib/useBrowser";
import { translations as P } from "../libs/locales.js";
import D from "./notification.js";
import T from "./privacy.js";
import B from "../../UserSessions/components/user-sessions.js";
import E from "./third-party-login/index.js";
import M from "./config-profile.js";
import W from "./danger-zone.js";
import { client as O } from "../../libs/client.js";
function Y({
  user: r,
  settings: a,
  onSave: m,
  isMobile: c,
  ...i
}) {
  const { locale: p } = C(), d = L().arcSphere, n = b((e, t = {}) => S(P, e, p, "en", t)), u = l(() => r.passports?.some((e) => e.role === x.OWNER), [r]), f = l(() => (a?.userCenterTabs || []).map((t) => ({
    key: t.value,
    name: t.label,
    value: t.protected,
    isPrivate: t.isPrivate
  })), [a?.userCenterTabs]), g = l(() => [
    d ? void 0 : {
      label: n("commonSetting.title"),
      value: "common",
      content: /* @__PURE__ */ o(M, { user: r, onSave: m })
    },
    {
      label: n("notificationManagement"),
      value: "notification",
      content: /* @__PURE__ */ o(D, { user: r, isMobile: c })
    },
    {
      label: n("thirdPartyLogin.title"),
      value: "thirdPartyLogin",
      content: /* @__PURE__ */ o(E, { user: r })
    },
    {
      label: n("privacyManagement"),
      value: "privacy",
      // @ts-ignore
      content: /* @__PURE__ */ o(T, { configList: f, onSave: m })
    },
    {
      label: n("sessionManagement"),
      value: "session",
      content: /* @__PURE__ */ o(
        B,
        {
          user: r,
          showUser: !1,
          getUserSessions: (e) => O.userSession.getMyLoginSessions({}, e)
        }
      )
    },
    !u && i.onDestroySelf && typeof i.onDestroySelf == "function" ? {
      label: n("dangerZone.title"),
      value: "dangerZone",
      content: /* @__PURE__ */ o(W, { onDestroySelf: i.onDestroySelf }),
      sx: {
        borderColor: "error.main"
      }
    } : null
  ].filter(Boolean), [r, f, c]);
  return y(() => {
    const e = window.location.hash.slice(1);
    e && document.getElementById(e)?.scrollIntoView({ behavior: "smooth" });
  }, []), /* @__PURE__ */ o(
    s,
    {
      ...i,
      sx: {
        ...i?.sx,
        display: "flex",
        flexDirection: "column",
        gap: 2.5,
        minWidth: {
          md: 500
        },
        maxWidth: "100%"
      },
      children: g.map((e) => e ? /* @__PURE__ */ h(
        s,
        {
          id: e.value,
          sx: w(
            {
              border: "1px solid",
              borderColor: "divider",
              borderRadius: 1,
              p: 2,
              "&:last-child": {
                mb: 5
              }
            },
            e.sx
          ),
          children: [
            /* @__PURE__ */ o(
              v,
              {
                sx: {
                  color: "text.primary",
                  fontWeight: 600
                },
                children: e.label
              }
            ),
            /* @__PURE__ */ o(
              s,
              {
                sx: {
                  mt: 2.5
                },
                children: e.content
              }
            )
          ]
        },
        e.value
      ) : null)
    }
  );
}
export {
  Y as default
};
