import { aT as x, aL as C, b2 as B, aO as j, aJ as s, b3 as b, b4 as R, aK as k, aX as u, e as N, aq as v, b5 as O, b6 as S, aM as E, b7 as L, aY as m, B as q, A as U, K as $, aH as D } from "./index-THhC4TET.js";
import { u as w } from "./useAddAppMutation-AVqslsQL.js";
import { useRef as F, useEffect as K } from "react";
function M(e, l) {
  let n = l[e];
  if (n)
    return e;
  const t = e.substring(0, e.lastIndexOf("_"));
  if (n = l[t], n)
    return t;
  const a = e.substring(0, e.lastIndexOf("_")) + e.substring(e.lastIndexOf("_") + 1);
  if (n = l[a], n)
    return a;
  const i = e.replace(/_/g, "");
  return n = l[i], n ? i : e;
}
const V = (e) => {
  const l = w(null, e.options), n = M(e.type, b), t = b[n];
  return t ? /* @__PURE__ */ s.jsx(
    t,
    {
      render: e.render,
      onChanged: e.onChanged,
      disableInstall: e.disableInstall
    }
  ) : /* @__PURE__ */ s.jsx(s.Fragment, { children: e.render({
    useDefaultComponent: !0,
    disabled: e.disableInstall,
    onClick: () => {
      l.mutate({ type: e.type });
    },
    loading: l.isPending
  }) });
}, W = (e) => {
  const { isPending: l, data: n } = x.viewer.me.useQuery(), t = C.useRouter(), a = F(null), { isPending: i, hasTeamPlan: d } = B();
  return K(() => {
    const c = a.current;
    c && c.addEventListener(
      "click",
      (r) => {
        if (!n) {
          t.push(
            `${j}/auth/login?callbackUrl=${j + location.pathname + location.search}`
          ), r.stopPropagation();
          return;
        }
        if (e.teamsPlanRequired && !d) {
          t.push(e.teamsPlanRequired.upgradeUrl), r.stopPropagation();
          return;
        }
      },
      !0
    );
  }, [l, n, t, d, e.teamsPlanRequired]), l || i ? null : /* @__PURE__ */ s.jsx("div", { ref: a, className: e.wrapperClassName, children: /* @__PURE__ */ s.jsx(V, { ...e }) });
};
function H(e) {
  const { status: l } = R.useSession();
  return x.viewer.appById.useQuery(
    { appId: e },
    {
      enabled: l === "authenticated"
    }
  );
}
function Q({
  appId: e,
  className: l,
  returnTo: n,
  teamId: t
}) {
  const { t: a } = k(), { data: i } = H(e), d = x.useUtils(), c = w(null, {
    returnTo: n,
    onSuccess: (r) => {
      d.viewer.appById.invalidate({ appId: e }), d.viewer.integrations.invalidate({
        extendsFeature: "EventType",
        ...t && { teamId: t }
      }), !(r != null && r.setupPending) && v(a("app_successfully_installed"), "success");
    },
    onError: (r) => {
      r instanceof Error && v(r.message || a("app_could_not_be_installed"), "error");
    }
  });
  return i ? /* @__PURE__ */ s.jsx(
    W,
    {
      type: i.type,
      teamsPlanRequired: i.teamsPlanRequired,
      wrapperClassName: u("[@media(max-width:260px)]:w-full", l),
      render: ({ useDefaultComponent: r, ...o }) => (r && (o = {
        ...o,
        onClick: () => {
          c.mutate({
            type: i.type,
            variant: i.variant,
            slug: i.slug,
            ...t && { teamId: t }
          });
        }
      }), /* @__PURE__ */ s.jsx(
        N,
        {
          loading: c.isPending,
          color: "secondary",
          className: "[@media(max-width:260px)]:w-full [@media(max-width:260px)]:justify-center",
          StartIcon: "plus",
          ...o,
          children: a("add")
        }
      ))
    }
  ) : null;
}
function X({
  app: e,
  description: l,
  switchOnClick: n,
  switchChecked: t,
  children: a,
  returnTo: i,
  teamId: d,
  disableSwitch: c,
  switchTooltip: r,
  hideSettingsIcon: o = !1,
  hideAppCardOptions: I = !1
}) {
  const { t: f } = O(), [A] = S(), { setAppData: P, LockedIcon: y, disabled: _ } = E(), h = L();
  return /* @__PURE__ */ s.jsxs(
    "div",
    {
      className: u(
        "border-subtle",
        (e == null ? void 0 : e.isInstalled) && "mb-4 rounded-md border",
        !e.enabled && "grayscale"
      ),
      children: [
        /* @__PURE__ */ s.jsx("div", { className: u(e.isInstalled ? "p-4 text-sm sm:p-4" : "px-5 py-4 text-sm sm:px-5"), children: /* @__PURE__ */ s.jsxs("div", { className: "flex w-full flex-col gap-2 sm:flex-row sm:gap-0", children: [
          /* @__PURE__ */ s.jsx(
            m,
            {
              href: `/apps/${e.slug}`,
              className: u(e != null && e.isInstalled ? "mr-[11px]" : "mr-3", "h-auto w-10 rounded-sm"),
              children: /* @__PURE__ */ s.jsx(
                "img",
                {
                  className: u(
                    (e == null ? void 0 : e.logo.includes("-dark")) && "dark:invert",
                    e != null && e.isInstalled ? "min-w-[42px]" : "min-w-[40px]",
                    "w-full"
                  ),
                  src: e == null ? void 0 : e.logo,
                  alt: e == null ? void 0 : e.name
                }
              )
            }
          ),
          /* @__PURE__ */ s.jsxs("div", { className: "flex flex-col pe-3", children: [
            /* @__PURE__ */ s.jsxs("div", { className: "text-emphasis", children: [
              /* @__PURE__ */ s.jsx("span", { className: u((e == null ? void 0 : e.isInstalled) && "text-base", "font-semibold leading-4"), children: e == null ? void 0 : e.name }),
              !(e != null && e.isInstalled) && /* @__PURE__ */ s.jsx("span", { className: "bg-emphasis ml-1 rounded px-1 py-0.5 text-xs font-medium leading-3 tracking-[0.01em]", children: (e == null ? void 0 : e.categories[0].charAt(0).toUpperCase()) + (e == null ? void 0 : e.categories[0].slice(1)) })
            ] }),
            /* @__PURE__ */ s.jsx("p", { title: e == null ? void 0 : e.description, className: "text-default line-clamp-1 pt-1 text-sm font-normal", children: l || (e == null ? void 0 : e.description) })
          ] }),
          /* @__PURE__ */ s.jsxs("div", { className: "ml-auto flex items-center space-x-2", children: [
            e.credentialOwner && !h && /* @__PURE__ */ s.jsx("div", { className: "ml-auto", children: /* @__PURE__ */ s.jsx(q, { variant: "gray", children: /* @__PURE__ */ s.jsxs("div", { className: "flex items-center", children: [
              /* @__PURE__ */ s.jsx(
                U,
                {
                  className: "mr-2",
                  alt: e.credentialOwner.name || "Credential Owner Name",
                  size: "sm",
                  imageSrc: e.credentialOwner.avatar
                }
              ),
              e.credentialOwner.name
            ] }) }) }),
            e != null && e.isInstalled || e.credentialOwner ? /* @__PURE__ */ s.jsx("div", { className: "ml-auto flex items-center", children: /* @__PURE__ */ s.jsx(
              $,
              {
                disabled: !e.enabled || _ || c,
                onCheckedChange: (g) => {
                  n && n(g), P("enabled", g);
                },
                checked: t,
                LockedIcon: y,
                "data-testid": `${e.slug}-app-switch`,
                tooltip: r
              }
            ) }) : /* @__PURE__ */ s.jsx(
              Q,
              {
                className: "ml-auto flex items-center",
                appId: e.slug,
                returnTo: i,
                teamId: d
              }
            )
          ] })
        ] }) }),
        I ? null : /* @__PURE__ */ s.jsxs("div", { ref: A, children: [
          (e == null ? void 0 : e.isInstalled) && t && /* @__PURE__ */ s.jsx("hr", { className: "border-subtle" }),
          e != null && e.isInstalled && t ? e.isSetupAlready === void 0 || e.isSetupAlready ? /* @__PURE__ */ s.jsxs("div", { className: "relative p-4 pt-5 text-sm [&_input]:mb-0 [&_input]:leading-4", children: [
            !o && !h && /* @__PURE__ */ s.jsx(m, { href: `/apps/${e.slug}/setup`, className: "absolute right-4 top-4", children: /* @__PURE__ */ s.jsx(D, { name: "settings", className: "text-default h-4 w-4", "aria-hidden": "true" }) }),
            a
          ] }) : /* @__PURE__ */ s.jsxs("div", { className: "flex h-64 w-full flex-col items-center justify-center gap-4 ", children: [
            /* @__PURE__ */ s.jsx("p", { children: f("this_app_is_not_setup_already") }),
            /* @__PURE__ */ s.jsx(m, { href: `/apps/${e.slug}/setup`, children: /* @__PURE__ */ s.jsx(N, { StartIcon: "settings", children: f("setup") }) })
          ] }) : null
        ] })
      ]
    }
  );
}
export {
  X as A
};
