@blocklet/ui-react/lib/ComponentManager/components/add-component.js

Some useful front-end web components that can be used in Blocklets.

import { jsxs as k, Fragment as y, jsx as c } from "react/jsx-runtime";
import { use as B, useRef as F, useEffect as I } from "react";
import S from "@arcblock/ux/lib/Button";
import { useLocaleContext as j } from "@arcblock/ux/lib/Locale/context";
import { BLOCKLET_SERVICE_PATH_PREFIX as P } from "@arcblock/ux/lib/Util/constant";
import { useMemoizedFn as e, useReactive as T } from "ahooks";
import { translate as U } from "@arcblock/ux/lib/Locale/util";
import { withQuery as _, joinURL as A } from "ufo";
import { SessionContext as M } from "@arcblock/did-connect-react/lib/Session";
import f from "@arcblock/ux/lib/Toast";
import O from "./resource-dialog.js";
import { translations as z } from "../libs/locales.js";
function $({
  componentDid: s,
  resourceType: u = void 0,
  resourceDid: g = void 0,
  grantedRoles: p = ["admin", "owner"],
  autoClose: h = !0,
  selectedMeta: w = void 0,
  storeUrl: C = void 0,
  onComplete: v,
  onClose: L,
  render: a = void 0
}) {
  const { session: i } = B(M), { locale: R } = j(), t = e((n, b = {}) => U(z, n, R, "en", b)), r = F(null), o = T({
    loading: !1,
    showDialog: !1
  }), D = _(A(P, "embed/resources", s, "add"), {
    resourceDid: g,
    resourceType: u,
    mode: "dialog",
    showFromUrl: "false",
    showResourcesSwitch: "false",
    enableRunBackground: "false",
    showCategory: "false"
  }), E = e(() => {
    o.showDialog = !1, L?.();
  }), l = e(() => {
    o.showDialog = !1, v?.();
  }), m = e(() => {
    if (!i.user) {
      f.warning(t("needLogin"));
      return;
    }
    if (!p.includes(i.user?.role)) {
      f.warning(t("noPermission"));
      return;
    }
    o.loading = !0, o.showDialog = !0;
  }), x = e(() => {
    o.loading = !1, r.current && r.current?.selectBlocklet(w);
  }), d = e((n) => {
    n?.data?.event === "component.installed" && n.data.componentDid === s && (h || n.data.manual) && l();
  });
  return I(() => {
    o.showDialog ? window.addEventListener("message", d) : window.removeEventListener("message", d);
  }, [o.showDialog]), /* @__PURE__ */ k(y, { children: [
    a ? a({ onClick: m, loading: o.loading }) : /* @__PURE__ */ c(
      S,
      {
        variant: "outlined",
        color: "secondary",
        type: "button",
        className: "submit",
        onClick: m,
        loading: o.loading,
        sx: { mr: 1, ml: 1 },
        children: t("importResource")
      },
      "button"
    ),
    o.showDialog && /* @__PURE__ */ c(
      O,
      {
        ref: r,
        src: D,
        storeUrl: C,
        open: !0,
        componentDid: s,
        loading: o.loading,
        onClose: E,
        onComplete: l,
        onLoad: x
      }
    )
  ] });
}
export {
  $ as default
};