strapi-plugin-hubspot 0.4.2 → 0.6.0

package/dist/_chunks/{HubspotObjectInput-DutelVp6.mjs → HubspotObjectInput-CpxeM2J0.mjs}

@@ -1,26 +1,14 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { u as useIntl, o as objectLabel } from "./objectLabels-dM4o67Fz.mjs";
+import { u as useIntl, o as objectLabel } from "./objectLabels-D9UEuOGr.mjs";
 import { Field, Flex, Loader, SingleSelect, SingleSelectOption } from "@strapi/design-system";
-import { useFetchClient } from "@strapi/strapi/admin";
-import { P as PLUGIN_ID, g as getTranslation } from "./index-CKoBcX1T.mjs";
+import { g as getTranslation } from "./index-DkGOTp8p.mjs";
+import { u as useHubspotSchema } from "./useHubspotSchema-DQkQcA_V.mjs";
 const HubspotObjectInput = React.forwardRef(
   ({ name, value, onChange, disabled, error, required, label, hint, labelAction }, ref) => {
     const intl = useIntl();
     const { formatMessage } = intl;
-    const { get } = useFetchClient();
-    const [schema, setSchema] = React.useState(null);
-    React.useEffect(() => {
-      let cancelled = false;
-      get(`/${PLUGIN_ID}/properties`).then(({ data }) => {
-        if (!cancelled) setSchema(data);
-      }).catch(() => {
-        if (!cancelled) setSchema({ configured: false, objects: [], unavailable: [] });
-      });
-      return () => {
-        cancelled = true;
-      };
-    }, [get]);
+    const { schema } = useHubspotSchema();
     const emit = (next) => onChange({ target: { name, value: String(next ?? ""), type: "string" } });
     const known = [
       ...schema?.objects ?? [],

package/dist/_chunks/{HubspotObjectInput-Br2jTFkG.js → HubspotObjectInput-hjAYWtaU.js}

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const objectLabels = require("./objectLabels-B76t8qqg.js");
+const objectLabels = require("./objectLabels-Th7aYW-B.js");
 const designSystem = require("@strapi/design-system");
-const admin = require("@strapi/strapi/admin");
-const index = require("./index-BUlB1rK9.js");
+const index = require("./index-CMzg-x5i.js");
+const useHubspotSchema = require("./useHubspotSchema-Bgrgg8Mt.js");
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -28,19 +28,7 @@ const HubspotObjectInput = React__namespace.forwardRef(
   ({ name, value, onChange, disabled, error, required, label, hint, labelAction }, ref) => {
     const intl = objectLabels.useIntl();
     const { formatMessage } = intl;
-    const { get } = admin.useFetchClient();
-    const [schema, setSchema] = React__namespace.useState(null);
-    React__namespace.useEffect(() => {
-      let cancelled = false;
-      get(`/${index.PLUGIN_ID}/properties`).then(({ data }) => {
-        if (!cancelled) setSchema(data);
-      }).catch(() => {
-        if (!cancelled) setSchema({ configured: false, objects: [], unavailable: [] });
-      });
-      return () => {
-        cancelled = true;
-      };
-    }, [get]);
+    const { schema } = useHubspotSchema.useHubspotSchema();
     const emit = (next) => onChange({ target: { name, value: String(next ?? ""), type: "string" } });
     const known = [
       ...schema?.objects ?? [],

package/dist/_chunks/HubspotPropertyInput-C-52Lu24.mjs

@@ -0,0 +1,227 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { u as useIntl, o as objectLabel } from "./objectLabels-D9UEuOGr.mjs";
+import { Field, Flex, Loader, Combobox, ComboboxOption, IconButton, Button, Typography, Link } from "@strapi/design-system";
+import { ArrowClockwise } from "@strapi/icons";
+import { useField } from "@strapi/strapi/admin";
+import { g as getTranslation } from "./index-DkGOTp8p.mjs";
+import { u as useHubspotSchema } from "./useHubspotSchema-DQkQcA_V.mjs";
+const oneLine = {
+  display: "block",
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+};
+const HubspotPropertyInput = React.forwardRef(
+  ({
+    name,
+    value,
+    onChange,
+    attribute,
+    disabled,
+    error,
+    required,
+    label,
+    hint,
+    labelAction
+  }, ref) => {
+    const intl = useIntl();
+    const { formatMessage } = intl;
+    const { schema, loadError, refresh, refreshing } = useHubspotSchema();
+    const objectFieldName = attribute?.options?.objectField || "hsObject";
+    const siblingPath = React.useMemo(
+      () => name.replace(/[^.]+$/, objectFieldName),
+      [name, objectFieldName]
+    );
+    const siblingField = useField(siblingPath);
+    const selectedObject = siblingField?.value;
+    const optionsFieldName = attribute?.options?.optionsField || "options";
+    const optionsPath = React.useMemo(
+      () => name.replace(/[^.]+$/, optionsFieldName),
+      [name, optionsFieldName]
+    );
+    const optionsField = useField(optionsPath);
+    const [imported, setImported] = React.useState(false);
+    const emit = (next) => onChange({ target: { name, value: next ?? "", type: "string" } });
+    const previousObject = React.useRef(selectedObject);
+    React.useEffect(() => {
+      const previous = previousObject.current;
+      previousObject.current = selectedObject;
+      if (!previous || previous === selectedObject || !selectedObject) return;
+      if (!value || !schema?.configured) return;
+      const validHere = schema.properties.some(
+        (p) => p.object === selectedObject && p.name === value
+      );
+      if (!validHere) emit("");
+    }, [selectedObject]);
+    const options = React.useMemo(() => {
+      const all = schema?.properties ?? [];
+      const scoped = selectedObject ? all.filter((p) => p.object === selectedObject) : all;
+      const sorted = selectedObject ? [...scoped].sort(
+        (a, b) => (a.group ?? "").localeCompare(b.group ?? "") || a.label.localeCompare(b.label)
+      ) : scoped;
+      const shown = sorted.map((p) => ({
+        value: p.name,
+        label: selectedObject ? `${p.group ? `${p.group} • ` : ""}${p.label} (${p.name})` : `${objectLabel(intl, p.object)} • ${p.label} (${p.name})`
+      }));
+      if (value && !scoped.some((p) => p.name === value)) {
+        const elsewhere = all.find((p) => p.name === value);
+        shown.unshift({
+          value,
+          label: elsewhere ? formatMessage(
+            {
+              id: getTranslation("picker.belongs-to"),
+              defaultMessage: "{property} — belongs to {object}"
+            },
+            {
+              property: value,
+              object: objectLabel(intl, elsewhere.object)
+            }
+          ) : formatMessage(
+            {
+              id: getTranslation("picker.unknown"),
+              defaultMessage: "{property} — unknown to the portal"
+            },
+            { property: value }
+          )
+        });
+      }
+      return shown;
+    }, [schema, selectedObject, value, intl, formatMessage]);
+    const describe = () => {
+      if (loadError !== null) {
+        return loadError || formatMessage({
+          id: getTranslation("picker.load-error"),
+          defaultMessage: "HubSpot properties unavailable"
+        });
+      }
+      if (schema && !schema.configured) {
+        return formatMessage({
+          id: getTranslation("picker.not-configured"),
+          defaultMessage: "No HubSpot API key — free text. Set it in Settings → HubSpot."
+        });
+      }
+      if (selectedObject && schema?.unavailable.some((u) => u.object === selectedObject)) {
+        return formatMessage(
+          {
+            id: getTranslation("picker.object-unavailable"),
+            defaultMessage: "Properties of “{object}” unreadable — missing scope on the token."
+          },
+          { object: objectLabel(intl, selectedObject) }
+        );
+      }
+      return hint;
+    };
+    const crmLink = schema?.portalId && value && schema.properties.some((p) => p.name === value) ? `https://${schema.uiDomain || "app.hubspot.com"}/property-settings/${schema.portalId}/properties?search=${encodeURIComponent(value)}` : null;
+    const selectedProperty = value && schema ? schema.properties.find(
+      (p) => p.name === value && (!selectedObject || p.object === selectedObject)
+    ) : void 0;
+    const importable = selectedProperty?.type === "enumeration" && (selectedProperty.options?.length ?? 0) > 0;
+    React.useEffect(() => setImported(false), [value]);
+    const importOptions = () => {
+      if (!selectedProperty || !optionsField) return;
+      const rows = selectedProperty.options.map((o, i) => ({
+        __temp_key__: `a${i}`,
+        value: o.value,
+        label: o.label ?? o.value
+      }));
+      optionsField.onChange({
+        target: { name: optionsPath, value: rows, type: "json" }
+      });
+      setImported(true);
+    };
+    return /* @__PURE__ */ jsxs(
+      Field.Root,
+      {
+        name,
+        error,
+        hint: describe(),
+        required,
+        children: [
+          /* @__PURE__ */ jsx(Field.Label, { action: labelAction, children: label }),
+          !schema ? /* @__PURE__ */ jsx(Flex, { paddingTop: 2, paddingBottom: 2, children: /* @__PURE__ */ jsx(Loader, { small: true, children: formatMessage({
+            id: getTranslation("picker.loading"),
+            defaultMessage: "Loading HubSpot properties…"
+          }) }) }) : schema.configured ? /* @__PURE__ */ jsx(
+            Combobox,
+            {
+              ref,
+              value: value || "",
+              onChange: emit,
+              onClear: () => emit(""),
+              disabled,
+              placeholder: formatMessage({
+                id: getTranslation("picker.placeholder"),
+                defaultMessage: "Search a property…"
+              }),
+              autocomplete: { type: "list", filter: "contains" },
+              noOptionsMessage: () => formatMessage({
+                id: getTranslation("picker.no-results"),
+                defaultMessage: "No matching property — properties are managed in HubSpot."
+              }),
+              children: options.map((o) => /* @__PURE__ */ jsx(ComboboxOption, { value: o.value, textValue: o.label, children: /* @__PURE__ */ jsx("span", { title: o.label, style: oneLine, children: o.label }) }, o.value))
+            }
+          ) : /* @__PURE__ */ jsx(
+            Field.Input,
+            {
+              ref,
+              value: value || "",
+              onChange: (e) => emit(e.target.value),
+              disabled,
+              placeholder: formatMessage({
+                id: getTranslation("picker.free-placeholder"),
+                defaultMessage: "e.g. hs_role, numberofemployees"
+              })
+            }
+          ),
+          schema?.configured ? /* @__PURE__ */ jsxs(Flex, { paddingTop: 1, gap: 3, alignItems: "center", wrap: "wrap", children: [
+            /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                label: formatMessage({
+                  id: getTranslation("picker.refresh"),
+                  defaultMessage: "Refresh the properties from HubSpot"
+                }),
+                variant: "ghost",
+                size: "XS",
+                onClick: refresh,
+                disabled: disabled || refreshing,
+                children: /* @__PURE__ */ jsx(ArrowClockwise, {})
+              }
+            ),
+            importable ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "tertiary",
+                size: "S",
+                onClick: importOptions,
+                disabled,
+                children: formatMessage(
+                  {
+                    id: getTranslation("picker.import"),
+                    defaultMessage: "Import the {count} options from HubSpot"
+                  },
+                  { count: selectedProperty?.options.length ?? 0 }
+                )
+              }
+            ) : null,
+            imported ? /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "success600", children: formatMessage({
+              id: getTranslation("picker.imported"),
+              defaultMessage: "Options imported — save to keep them."
+            }) }) : null,
+            crmLink ? /* @__PURE__ */ jsx(Link, { href: crmLink, isExternal: true, children: formatMessage({
+              id: getTranslation("picker.view"),
+              defaultMessage: "View in HubSpot"
+            }) }) : null
+          ] }) : null,
+          /* @__PURE__ */ jsx(Field.Hint, {}),
+          /* @__PURE__ */ jsx(Field.Error, {})
+        ]
+      }
+    );
+  }
+);
+HubspotPropertyInput.displayName = "HubspotPropertyInput";
+export {
+  HubspotPropertyInput as default
+};

package/dist/_chunks/HubspotPropertyInput-OSeIBaRC.js

@@ -0,0 +1,245 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const objectLabels = require("./objectLabels-Th7aYW-B.js");
+const designSystem = require("@strapi/design-system");
+const icons = require("@strapi/icons");
+const admin = require("@strapi/strapi/admin");
+const index = require("./index-CMzg-x5i.js");
+const useHubspotSchema = require("./useHubspotSchema-Bgrgg8Mt.js");
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespace(React);
+const oneLine = {
+  display: "block",
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+};
+const HubspotPropertyInput = React__namespace.forwardRef(
+  ({
+    name,
+    value,
+    onChange,
+    attribute,
+    disabled,
+    error,
+    required,
+    label,
+    hint,
+    labelAction
+  }, ref) => {
+    const intl = objectLabels.useIntl();
+    const { formatMessage } = intl;
+    const { schema, loadError, refresh, refreshing } = useHubspotSchema.useHubspotSchema();
+    const objectFieldName = attribute?.options?.objectField || "hsObject";
+    const siblingPath = React__namespace.useMemo(
+      () => name.replace(/[^.]+$/, objectFieldName),
+      [name, objectFieldName]
+    );
+    const siblingField = admin.useField(siblingPath);
+    const selectedObject = siblingField?.value;
+    const optionsFieldName = attribute?.options?.optionsField || "options";
+    const optionsPath = React__namespace.useMemo(
+      () => name.replace(/[^.]+$/, optionsFieldName),
+      [name, optionsFieldName]
+    );
+    const optionsField = admin.useField(optionsPath);
+    const [imported, setImported] = React__namespace.useState(false);
+    const emit = (next) => onChange({ target: { name, value: next ?? "", type: "string" } });
+    const previousObject = React__namespace.useRef(selectedObject);
+    React__namespace.useEffect(() => {
+      const previous = previousObject.current;
+      previousObject.current = selectedObject;
+      if (!previous || previous === selectedObject || !selectedObject) return;
+      if (!value || !schema?.configured) return;
+      const validHere = schema.properties.some(
+        (p) => p.object === selectedObject && p.name === value
+      );
+      if (!validHere) emit("");
+    }, [selectedObject]);
+    const options = React__namespace.useMemo(() => {
+      const all = schema?.properties ?? [];
+      const scoped = selectedObject ? all.filter((p) => p.object === selectedObject) : all;
+      const sorted = selectedObject ? [...scoped].sort(
+        (a, b) => (a.group ?? "").localeCompare(b.group ?? "") || a.label.localeCompare(b.label)
+      ) : scoped;
+      const shown = sorted.map((p) => ({
+        value: p.name,
+        label: selectedObject ? `${p.group ? `${p.group} • ` : ""}${p.label} (${p.name})` : `${objectLabels.objectLabel(intl, p.object)} • ${p.label} (${p.name})`
+      }));
+      if (value && !scoped.some((p) => p.name === value)) {
+        const elsewhere = all.find((p) => p.name === value);
+        shown.unshift({
+          value,
+          label: elsewhere ? formatMessage(
+            {
+              id: index.getTranslation("picker.belongs-to"),
+              defaultMessage: "{property} — belongs to {object}"
+            },
+            {
+              property: value,
+              object: objectLabels.objectLabel(intl, elsewhere.object)
+            }
+          ) : formatMessage(
+            {
+              id: index.getTranslation("picker.unknown"),
+              defaultMessage: "{property} — unknown to the portal"
+            },
+            { property: value }
+          )
+        });
+      }
+      return shown;
+    }, [schema, selectedObject, value, intl, formatMessage]);
+    const describe = () => {
+      if (loadError !== null) {
+        return loadError || formatMessage({
+          id: index.getTranslation("picker.load-error"),
+          defaultMessage: "HubSpot properties unavailable"
+        });
+      }
+      if (schema && !schema.configured) {
+        return formatMessage({
+          id: index.getTranslation("picker.not-configured"),
+          defaultMessage: "No HubSpot API key — free text. Set it in Settings → HubSpot."
+        });
+      }
+      if (selectedObject && schema?.unavailable.some((u) => u.object === selectedObject)) {
+        return formatMessage(
+          {
+            id: index.getTranslation("picker.object-unavailable"),
+            defaultMessage: "Properties of “{object}” unreadable — missing scope on the token."
+          },
+          { object: objectLabels.objectLabel(intl, selectedObject) }
+        );
+      }
+      return hint;
+    };
+    const crmLink = schema?.portalId && value && schema.properties.some((p) => p.name === value) ? `https://${schema.uiDomain || "app.hubspot.com"}/property-settings/${schema.portalId}/properties?search=${encodeURIComponent(value)}` : null;
+    const selectedProperty = value && schema ? schema.properties.find(
+      (p) => p.name === value && (!selectedObject || p.object === selectedObject)
+    ) : void 0;
+    const importable = selectedProperty?.type === "enumeration" && (selectedProperty.options?.length ?? 0) > 0;
+    React__namespace.useEffect(() => setImported(false), [value]);
+    const importOptions = () => {
+      if (!selectedProperty || !optionsField) return;
+      const rows = selectedProperty.options.map((o, i) => ({
+        __temp_key__: `a${i}`,
+        value: o.value,
+        label: o.label ?? o.value
+      }));
+      optionsField.onChange({
+        target: { name: optionsPath, value: rows, type: "json" }
+      });
+      setImported(true);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      designSystem.Field.Root,
+      {
+        name,
+        error,
+        hint: describe(),
+        required,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { action: labelAction, children: label }),
+          !schema ? /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { paddingTop: 2, paddingBottom: 2, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Loader, { small: true, children: formatMessage({
+            id: index.getTranslation("picker.loading"),
+            defaultMessage: "Loading HubSpot properties…"
+          }) }) }) : schema.configured ? /* @__PURE__ */ jsxRuntime.jsx(
+            designSystem.Combobox,
+            {
+              ref,
+              value: value || "",
+              onChange: emit,
+              onClear: () => emit(""),
+              disabled,
+              placeholder: formatMessage({
+                id: index.getTranslation("picker.placeholder"),
+                defaultMessage: "Search a property…"
+              }),
+              autocomplete: { type: "list", filter: "contains" },
+              noOptionsMessage: () => formatMessage({
+                id: index.getTranslation("picker.no-results"),
+                defaultMessage: "No matching property — properties are managed in HubSpot."
+              }),
+              children: options.map((o) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.ComboboxOption, { value: o.value, textValue: o.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { title: o.label, style: oneLine, children: o.label }) }, o.value))
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            designSystem.Field.Input,
+            {
+              ref,
+              value: value || "",
+              onChange: (e) => emit(e.target.value),
+              disabled,
+              placeholder: formatMessage({
+                id: index.getTranslation("picker.free-placeholder"),
+                defaultMessage: "e.g. hs_role, numberofemployees"
+              })
+            }
+          ),
+          schema?.configured ? /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { paddingTop: 1, gap: 3, alignItems: "center", wrap: "wrap", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              designSystem.IconButton,
+              {
+                label: formatMessage({
+                  id: index.getTranslation("picker.refresh"),
+                  defaultMessage: "Refresh the properties from HubSpot"
+                }),
+                variant: "ghost",
+                size: "XS",
+                onClick: refresh,
+                disabled: disabled || refreshing,
+                children: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowClockwise, {})
+              }
+            ),
+            importable ? /* @__PURE__ */ jsxRuntime.jsx(
+              designSystem.Button,
+              {
+                variant: "tertiary",
+                size: "S",
+                onClick: importOptions,
+                disabled,
+                children: formatMessage(
+                  {
+                    id: index.getTranslation("picker.import"),
+                    defaultMessage: "Import the {count} options from HubSpot"
+                  },
+                  { count: selectedProperty?.options.length ?? 0 }
+                )
+              }
+            ) : null,
+            imported ? /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", textColor: "success600", children: formatMessage({
+              id: index.getTranslation("picker.imported"),
+              defaultMessage: "Options imported — save to keep them."
+            }) }) : null,
+            crmLink ? /* @__PURE__ */ jsxRuntime.jsx(designSystem.Link, { href: crmLink, isExternal: true, children: formatMessage({
+              id: index.getTranslation("picker.view"),
+              defaultMessage: "View in HubSpot"
+            }) }) : null
+          ] }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, {}),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Error, {})
+        ]
+      }
+    );
+  }
+);
+HubspotPropertyInput.displayName = "HubspotPropertyInput";
+exports.default = HubspotPropertyInput;