import { N, aU as X, j as e, a as q, b as f, u as K, V as Q, aV as U, aW as D, aX as ee, d as te, e as Z, aY as ne, M as ie, s as _, n as oe, W as Y, a5 as S, z as O, aZ as R, Y as W, a_ as se, T as m, B as V, H as ae, L as le, C as M, X as re, J as G, Z as z, aj as ce, i as j, af as de, a$ as ue } from "./index-c65ca4a4.mjs";
import { M as me } from "./Menu-6f7d6f3e.mjs";
import { R as he } from "./Radio-155d4c50.mjs";
import "./Popover-016ae0d0.mjs";
const L = ({ children: n }) => /* @__PURE__ */ e.jsx(O, { level: 4, children: n }), pe = ({ user: n, setUserData: i }) => {
  const { data: { roles: o } = {} } = de();
  return ue(n) ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
    /* @__PURE__ */ e.jsx(O, { level: 6, children: "Role" }),
    /* @__PURE__ */ e.jsxs("div", { className: "flex h-[295px] flex-col items-center justify-center gap-3 bg-grey-75 px-10 py-20 text-center text-sm text-grey-800", children: [
      /* @__PURE__ */ e.jsx(S, { colorClass: "text-grey-800", name: "crown", size: "lg" }),
      "This user is the owner of the site. To change their role, you need to transfer the ownership first."
    ] })
  ] }) : /* @__PURE__ */ e.jsx(
    he,
    {
      id: "role",
      options: [
        {
          hint: "Can create and edit their own posts, but cannot publish. An Editor needs to approve and publish for them.",
          label: "Contributor",
          value: "contributor"
        },
        {
          hint: "A trusted user who can create, edit and publish their own posts, but can’t modify others.",
          label: "Author",
          value: "author"
        },
        {
          hint: "Can invite and manage other Authors and Contributors, as well as edit and publish any posts on the site.",
          label: "Editor",
          value: "editor"
        },
        {
          hint: "Trusted staff user who should be able to manage all content and users, as well as site settings and options.",
          label: "Administrator",
          value: "administrator"
        }
      ],
      selectedOption: n.roles[0].name.toLowerCase(),
      title: "Role",
      onSelect: (t) => {
        const a = o == null ? void 0 : o.find((u) => u.name.toLowerCase() === t.toLowerCase());
        a && (i == null || i({ ...n, roles: [a] }));
      }
    }
  );
}, ge = ({ errors: n, validators: i, user: o, setUserData: t }) => /* @__PURE__ */ e.jsxs(z, { children: [
  /* @__PURE__ */ e.jsx(
    m,
    {
      error: !!(n != null && n.name),
      hint: (n == null ? void 0 : n.name) || "Use real name so people can recognize you",
      title: "Full name",
      value: o.name,
      onBlur: (a) => {
        i == null || i.name(a.target.value);
      },
      onChange: (a) => {
        t == null || t({ ...o, name: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      error: !!(n != null && n.email),
      hint: (n == null ? void 0 : n.email) || "",
      title: "Email",
      value: o.email,
      onBlur: (a) => {
        i == null || i.email(a.target.value);
      },
      onChange: (a) => {
        t == null || t({ ...o, email: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(pe, { setUserData: t, user: o })
] }), fe = ({ errors: n, validators: i, user: o, setUserData: t }) => /* @__PURE__ */ e.jsx(
  R,
  {
    border: !1,
    customHeader: /* @__PURE__ */ e.jsx(L, { children: "Basic info" }),
    title: "Basic",
    children: /* @__PURE__ */ e.jsx(ge, { errors: n, setUserData: t, user: o, validators: i })
  }
), we = ({ errors: n, validators: i, user: o, setUserData: t }) => /* @__PURE__ */ e.jsxs(z, { children: [
  /* @__PURE__ */ e.jsx(
    m,
    {
      hint: "https://example.com/author",
      title: "Slug",
      value: o.slug,
      onChange: (a) => {
        t == null || t({ ...o, slug: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      title: "Location",
      value: o.location,
      onChange: (a) => {
        t == null || t({ ...o, location: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      error: !!(n != null && n.url),
      hint: (n == null ? void 0 : n.url) || "",
      title: "Website",
      value: o.website,
      onBlur: (a) => {
        i == null || i.url(a.target.value);
      },
      onChange: (a) => {
        t == null || t({ ...o, website: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      title: "Facebook profile",
      value: o.facebook,
      onChange: (a) => {
        t == null || t({ ...o, facebook: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      title: "Twitter profile",
      value: o.twitter,
      onChange: (a) => {
        t == null || t({ ...o, twitter: a.target.value });
      }
    }
  ),
  /* @__PURE__ */ e.jsx(
    m,
    {
      hint: "Recommended: 200 characters.",
      title: "Bio",
      value: o.bio,
      onChange: (a) => {
        t == null || t({ ...o, bio: a.target.value });
      }
    }
  )
] }), be = ({ errors: n, validators: i, user: o, setUserData: t }) => /* @__PURE__ */ e.jsx(
  R,
  {
    border: !1,
    customHeader: /* @__PURE__ */ e.jsx(L, { children: "Details" }),
    title: "Details",
    children: /* @__PURE__ */ e.jsx(we, { errors: n, setUserData: t, user: o, validators: i })
  }
), xe = ({ user: n, setUserData: i }) => {
  const o = ce("webmentions");
  return /* @__PURE__ */ e.jsxs(z, { children: [
    /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.comment_notifications,
        direction: "rtl",
        hint: "Every time a member comments on one of your posts",
        label: "Comments",
        onChange: (t) => {
          i == null || i({ ...n, comment_notifications: t.target.checked });
        }
      }
    ),
    o && /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.mention_notifications,
        direction: "rtl",
        hint: "Every time another site links to your work",
        label: "Mentions",
        onChange: (t) => {
          i == null || i({ ...n, mention_notifications: t.target.checked });
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.free_member_signup_notification,
        direction: "rtl",
        hint: "Every time a new free member signs up",
        label: "New signups",
        onChange: (t) => {
          i == null || i({ ...n, free_member_signup_notification: t.target.checked });
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.paid_subscription_started_notification,
        direction: "rtl",
        hint: "Every time a member starts a new paid subscription",
        label: "New paid members",
        onChange: (t) => {
          i == null || i({ ...n, paid_subscription_started_notification: t.target.checked });
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.paid_subscription_canceled_notification,
        direction: "rtl",
        hint: "Every time a member cancels their paid subscription",
        label: "Paid member cancellations",
        onChange: (t) => {
          i == null || i({ ...n, paid_subscription_canceled_notification: t.target.checked });
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      j,
      {
        checked: n.milestone_notifications,
        direction: "rtl",
        hint: "Occasional summaries of your audience & revenue growth",
        label: "Milestones",
        onChange: (t) => {
          i == null || i({ ...n, milestone_notifications: t.target.checked });
        }
      }
    )
  ] });
}, ve = ({ user: n, setUserData: i }) => /* @__PURE__ */ e.jsx(
  R,
  {
    border: !1,
    customHeader: /* @__PURE__ */ e.jsx(L, { children: "Email notifications" }),
    title: "Email notifications",
    children: /* @__PURE__ */ e.jsx(xe, { setUserData: i, user: n })
  }
);
function je({ password: n, confirmPassword: i }) {
  const o = {};
  return n !== i && (o.newPassword = "Your new passwords do not match", o.confirmNewPassword = "Your new passwords do not match"), n.length < 10 && (o.newPassword = "Password must be at least 10 characters"), o;
}
const ye = ({ user: n }) => {
  const [i, o] = f(!1), [t, a] = f(""), [u, w] = f(""), [h, d] = f(""), [l, b] = f({}), y = W(null), p = W(null), { mutateAsync: I } = se();
  Z(() => {
    h === "saved" && setTimeout(() => {
      d(""), o(!1);
    }, 2500);
  }, [h]);
  const T = () => {
    o(!0);
  }, C = /* @__PURE__ */ e.jsx(
    V,
    {
      color: "grey",
      label: "Change password",
      onClick: T
    }
  );
  let x = "Change password";
  h === "saving" ? x = "Updating..." : h === "saved" ? x = "Updated" : h === "error" && (x = "Retry");
  const A = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
    /* @__PURE__ */ e.jsx(
      m,
      {
        error: !!l.newPassword,
        hint: l.newPassword,
        inputRef: y,
        title: "New password",
        type: "password",
        value: t,
        onChange: (g) => {
          a(g.target.value);
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      m,
      {
        error: !!l.confirmNewPassword,
        hint: l.confirmNewPassword,
        inputRef: p,
        title: "Verify password",
        type: "password",
        value: u,
        onChange: (g) => {
          w(g.target.value);
        }
      }
    ),
    /* @__PURE__ */ e.jsx(
      V,
      {
        color: "red",
        label: x,
        onClick: async () => {
          d("saving");
          const g = je({ password: t, confirmPassword: u });
          if (b(g), Object.keys(g).length > 0) {
            a(""), w(""), y.current && (y.current.value = ""), p.current && (p.current.value = ""), d("");
            return;
          }
          try {
            await I({
              newPassword: t,
              confirmNewPassword: u,
              oldPassword: "",
              userId: n == null ? void 0 : n.id
            }), d("saved");
          } catch {
            d("error");
          }
        }
      }
    )
  ] });
  return /* @__PURE__ */ e.jsx(
    R,
    {
      border: !1,
      customHeader: /* @__PURE__ */ e.jsx(L, { children: "Password" }),
      title: "Password",
      children: i ? A : C
    }
  );
}, Ce = () => /* @__PURE__ */ e.jsxs("button", { className: "flex h-8 cursor-pointer items-center justify-center rounded bg-[rgba(0,0,0,0.75)] px-3 opacity-80 hover:opacity-100", type: "button", children: [
  /* @__PURE__ */ e.jsx(S, { colorClass: "text-white", name: "ellipsis", size: "md" }),
  /* @__PURE__ */ e.jsx("span", { className: "sr-only", children: "Actions" })
] }), ke = ({ user: n }) => {
  const { updateRoute: i } = q(), { ownerUser: o } = X(), [t, a] = f(n), [u, w] = f(""), [h, d] = f({}), l = (s) => {
    a(s), w("unsaved");
  }, b = K(), { mutateAsync: y } = Q(), { mutateAsync: p } = U(), { mutateAsync: I } = D(), { mutateAsync: T } = ee(), C = te();
  Z(() => {
    u === "saved" && setTimeout(() => {
      b.remove(), i("users");
    }, 300);
  }, [b, u, i]);
  const x = async (s) => {
    if (s.status === "inactive" && s.roles[0].name !== "Contributor")
      try {
        await (C == null ? void 0 : C.errorIfWouldGoOverLimit("staff"));
      } catch (r) {
        if (r instanceof ae) {
          N.show(le, {
            formSheet: !0,
            prompt: r.message || "Your current plan doesn't support more users."
          });
          return;
        } else
          throw r;
      }
    let c = "This user will no longer be able to log in but their posts will be kept.";
    s.status === "inactive" && (c = "This user will be able to log in again and will have the same permissions they had previously."), N.show(M, {
      title: "Are you sure you want to suspend this user?",
      prompt: /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
        /* @__PURE__ */ e.jsx("strong", { children: "WARNING:" }),
        " ",
        c
      ] }),
      okLabel: s.status === "inactive" ? "Un-suspend" : "Suspend",
      okRunningLabel: s.status === "inactive" ? "Un-suspending..." : "Suspending...",
      okColor: "red",
      onOk: async (r) => {
        const v = {
          ...s,
          status: s.status === "inactive" ? "active" : "inactive"
        };
        await p(v), l(v), r == null || r.remove(), _({
          message: s.status === "inactive" ? "User un-suspended" : "User suspended",
          type: "success"
        });
      }
    });
  }, A = (s, { owner: c }) => {
    N.show(M, {
      title: "Are you sure you want to delete this user?",
      prompt: /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
        /* @__PURE__ */ e.jsxs("p", { className: "mb-3", children: [
          /* @__PURE__ */ e.jsx("span", { className: "font-bold", children: s.name || s.email }),
          " will be permanently deleted and all their posts will be automatically assigned to the ",
          /* @__PURE__ */ e.jsx("span", { className: "font-bold", children: c.name }),
          "."
        ] }),
        /* @__PURE__ */ e.jsxs("p", { children: [
          "To make these easy to find in the future, each post will be given an internal tag of ",
          /* @__PURE__ */ e.jsxs("span", { className: "font-bold", children: [
            "#",
            n.slug
          ] })
        ] })
      ] }),
      okLabel: "Delete user",
      okColor: "red",
      onOk: async (r) => {
        await I(s == null ? void 0 : s.id), r == null || r.remove(), b == null || b.remove(), _({
          message: "User deleted",
          type: "success"
        });
      }
    });
  }, g = () => {
    N.show(M, {
      title: "Transfer Ownership",
      prompt: "Are you sure you want to transfer the ownership of this blog? You will not be able to undo this action.",
      okLabel: "Yep — I'm sure",
      okColor: "red",
      onOk: async (s) => {
        await T(n.id), s == null || s.remove(), _({
          message: "Ownership transferred",
          type: "success"
        });
      }
    });
  }, B = async (s, c) => {
    try {
      const r = re(await y({ file: c }));
      switch (s) {
        case "cover_image":
          l == null || l((v) => ({ ...v, cover_image: r }));
          break;
        case "profile_image":
          l == null || l((v) => ({ ...v, profile_image: r }));
          break;
      }
    } catch {
    }
  }, F = (s) => {
    switch (s) {
      case "cover_image":
        l == null || l((c) => ({ ...c, cover_image: "" }));
        break;
      case "profile_image":
        l == null || l((c) => ({ ...c, profile_image: "" }));
        break;
    }
  };
  let $ = (t == null ? void 0 : t.status) === "inactive" ? "Un-suspend user" : "Suspend user", P = [];
  ne(t) && P.push({
    id: "make-owner",
    label: "Make owner",
    onClick: g
  }), P = P.concat([
    {
      id: "delete-user",
      label: "Delete user",
      onClick: () => {
        A(n, { owner: o });
      }
    },
    {
      id: "suspend-user",
      label: $,
      onClick: () => {
        x(t);
      }
    },
    {
      id: "view-user-activity",
      label: "View user activity",
      onClick: () => {
      }
    }
  ]);
  let E = u === "saved" ? "Saved" : "Save & close";
  u === "saving" ? E = "Saving..." : u === "saved" && (E = "Saved");
  const H = "absolute left-12 md:left-auto md:right-[104px] bottom-12 bg-[rgba(0,0,0,0.75)] rounded text-sm text-white flex items-center justify-center px-3 h-8 opacity-80 hover:opacity-100 transition cursor-pointer font-medium z-10", J = t.status === "inactive" ? " (Suspended)" : "", k = {
    name: (s) => (d == null || d((c) => ({ ...c, name: s ? "" : "Please enter a name" })), !!s),
    email: (s) => {
      const c = G.isEmail(s);
      return d == null || d((r) => ({ ...r, email: c ? "" : "Please enter a valid email address" })), c;
    },
    url: (s) => {
      const c = !s || G.isURL(s);
      return d == null || d((r) => ({ ...r, url: c ? "" : "Please enter a valid URL" })), c;
    }
  };
  return /* @__PURE__ */ e.jsx(
    ie,
    {
      afterClose: () => i("users"),
      dirty: u === "unsaved",
      okLabel: E,
      size: "lg",
      stickyFooter: !0,
      testId: "user-detail-modal",
      onOk: async () => {
        w("saving");
        let s = !1;
        if ((!k.name(t.name) || !k.email(t.email) || !k.url(t.website)) && (s = !0), s) {
          _({
            type: "pageError",
            message: "Can't save user! One or more fields have errors, please doublecheck you filled all mandatory fields"
          }), w("");
          return;
        }
        oe.dismiss(), await (p == null ? void 0 : p(t)), w("saved");
      },
      children: /* @__PURE__ */ e.jsxs("div", { children: [
        /* @__PURE__ */ e.jsxs("div", { className: "relative -mx-12 -mt-12 rounded-t bg-gradient-to-tr from-grey-900 to-black", children: [
          /* @__PURE__ */ e.jsx(
            Y,
            {
              deleteButtonClassName: H,
              deleteButtonContent: "Delete cover image",
              fileUploadClassName: H,
              height: t.cover_image ? "100%" : "32px",
              id: "cover-image",
              imageClassName: "w-full h-full object-cover",
              imageContainerClassName: "absolute inset-0 bg-cover group bg-center rounded-t overflow-hidden",
              imageURL: t.cover_image || "",
              unstyled: !0,
              onDelete: () => {
                F("cover_image");
              },
              onUpload: (s) => {
                B("cover_image", s);
              },
              children: "Upload cover image"
            }
          ),
          /* @__PURE__ */ e.jsx("div", { className: "absolute bottom-12 right-12 z-10", children: /* @__PURE__ */ e.jsx(me, { items: P, position: "right", trigger: /* @__PURE__ */ e.jsx(Ce, {}) }) }),
          /* @__PURE__ */ e.jsxs("div", { className: "relative flex flex-col items-start gap-4 px-12 pb-60 pt-10 md:flex-row md:items-center md:pb-7 md:pt-60", children: [
            /* @__PURE__ */ e.jsx(
              Y,
              {
                deleteButtonClassName: "md:invisible absolute -right-2 -top-2 flex h-8 w-8 cursor-pointer items-center justify-center rounded-full bg-[rgba(0,0,0,0.75)] text-white hover:bg-black group-hover:!visible",
                deleteButtonContent: /* @__PURE__ */ e.jsx(S, { colorClass: "text-white", name: "trash", size: "sm" }),
                fileUploadClassName: "rounded-full bg-black flex items-center justify-center opacity-80 transition hover:opacity-100 -ml-2 cursor-pointer h-[80px] w-[80px]",
                id: "avatar",
                imageClassName: "w-full h-full object-cover rounded-full",
                imageContainerClassName: "relative group bg-cover bg-center -ml-2 h-[80px] w-[80px]",
                imageURL: t.profile_image,
                unstyled: !0,
                width: "80px",
                onDelete: () => {
                  F("profile_image");
                },
                onUpload: (s) => {
                  B("profile_image", s);
                },
                children: /* @__PURE__ */ e.jsx(S, { colorClass: "text-white", name: "user-add", size: "lg" })
              }
            ),
            /* @__PURE__ */ e.jsxs("div", { children: [
              /* @__PURE__ */ e.jsxs(O, { styles: "text-white", children: [
                n.name,
                J
              ] }),
              /* @__PURE__ */ e.jsx("span", { className: "text-md font-semibold capitalize text-white", children: n.roles[0].name.toLowerCase() })
            ] })
          ] })
        ] }),
        /* @__PURE__ */ e.jsxs("div", { className: "mt-10 grid grid-cols-1 gap-x-12 gap-y-20 md:grid-cols-2", children: [
          /* @__PURE__ */ e.jsx(fe, { errors: h, setUserData: l, user: t, validators: k }),
          /* @__PURE__ */ e.jsx(be, { errors: h, setUserData: l, user: t, validators: k }),
          /* @__PURE__ */ e.jsx(ve, { setUserData: l, user: t }),
          /* @__PURE__ */ e.jsx(ye, { user: t })
        ] })
      ] })
    }
  );
}, Ne = ({ params: n }) => {
  const { users: i } = X(), o = i.find(({ slug: t }) => t === (n == null ? void 0 : n.slug));
  return o ? /* @__PURE__ */ e.jsx(ke, { user: o }) : null;
}, Le = N.create(Ne);
export {
  Le as default
};
//# sourceMappingURL=UserDetailModal-506daf24.mjs.map
