import { jsxs as l, jsx as r } from "react/jsx-runtime";
import { Box as t, Tooltip as o, Typography as n, Chip as d } from "@mui/material";
import f from "@arcblock/ux/lib/Avatar";
import { useCreation as c } from "ahooks";
function g({ user: i, sessionUser: e }) {
  const a = c(() => (i?.passports || [])?.find((p) => p.name === e.role), [i?.passports, e?.role]);
  return /* @__PURE__ */ l(
    t,
    {
      sx: {
        display: "flex",
        alignItems: "center",
        gap: 1
      },
      children: [
        /* @__PURE__ */ r(
          f,
          {
            size: 40,
            variant: "circle",
            shape: "circle",
            src: e.avatar,
            did: e.did,
            sx: { flexShrink: 0 }
          }
        ),
        /* @__PURE__ */ l(t, { sx: { flex: 1, overflow: "hidden" }, children: [
          /* @__PURE__ */ l(
            t,
            {
              sx: {
                display: "flex",
                alignItems: "center",
                gap: 1
              },
              children: [
                /* @__PURE__ */ r(o, { title: e.fullName, children: /* @__PURE__ */ r(
                  n,
                  {
                    sx: {
                      whiteSpace: "nowrap",
                      overflow: "hidden",
                      textOverflow: "ellipsis",
                      flex: 1
                    },
                    children: e.fullName
                  }
                ) }),
                /* @__PURE__ */ r(
                  d,
                  {
                    label: a?.title || a?.name || "Guest",
                    size: "small",
                    variant: "outlined",
                    sx: {
                      flexShrink: 0,
                      fontWeight: "bold",
                      fontSize: "12px",
                      color: "text.primary",
                      borderColor: "grey.300",
                      backgroundColor: "transparent",
                      textTransform: "capitalize",
                      pr: 0.5,
                      pl: 0,
                      height: "auto"
                    }
                  }
                )
              ]
            }
          ),
          /* @__PURE__ */ r(o, { title: e.email, children: /* @__PURE__ */ r(
            n,
            {
              variant: "body2",
              color: "grey",
              sx: {
                whiteSpace: "nowrap",
                overflow: "hidden",
                textOverflow: "ellipsis"
              },
              children: e.email
            }
          ) })
        ] })
      ]
    }
  );
}
export {
  g as default
};
