@sanity/personalization-plugin 2.1.0-field-names.1 → 2.1.0-growthbook.1

package/dist/index.mjs

@@ -2,50 +2,49 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useClient, useWorkspace, useFormValue, defineDocumentFieldAction, set, unset, useDocumentOperation, isReference, isImage, isDocumentSchemaType, definePlugin, isObjectInputProps, defineType, defineField } from "sanity";
 import { Stack, Inline, Button, Select as Select$1 } from "@sanity/ui";
 import { uuid } from "@sanity/uuid";
-import { createContext, useMemo, useContext, useCallback, forwardRef, useState, useEffect } from "react";
+import { createContext, useState, useMemo, useContext, useCallback, forwardRef, useEffect } from "react";
 import equal from "fast-deep-equal";
 import { suspend } from "suspend-react";
 import { GiSoapExperiment } from "react-icons/gi";
+import { useSecrets, SettingsView } from "@sanity/studio-secrets";
 const CONFIG_DEFAULT = {
   fields: [],
-  apiVersion: "2024-11-07",
-  experimentNameOverride: "experiment",
-  variantNameOverride: "variant",
-  variantId: "variantId",
-  variantArrayName: "variants",
-  experimentId: "experimentId"
+  apiVersion: "2024-11-07"
 }, ExperimentContext = createContext({
   ...CONFIG_DEFAULT,
-  experiments: []
+  experiments: [],
+  setSecret: () => {
+  },
+  secret: void 0
 });
 function useExperimentContext() {
   return useContext(ExperimentContext);
 }
 function ExperimentProvider(props) {
-  const { experimentFieldPluginConfig } = props, client = useClient({ apiVersion: experimentFieldPluginConfig.apiVersion }), workspace = useWorkspace(), experiments = Array.isArray(experimentFieldPluginConfig.experiments) ? experimentFieldPluginConfig.experiments : suspend(
+  const { experimentFieldPluginConfig } = props, [secret, setSecret] = useState(), client = useClient({ apiVersion: experimentFieldPluginConfig.apiVersion }), workspace = useWorkspace(), experiments = Array.isArray(experimentFieldPluginConfig.experiments) ? experimentFieldPluginConfig.experiments : suspend(
     // eslint-disable-next-line require-await
-    async () => typeof experimentFieldPluginConfig.experiments == "function" ? experimentFieldPluginConfig.experiments(client) : experimentFieldPluginConfig.experiments,
-    [workspace],
+    async () => typeof experimentFieldPluginConfig.experiments == "function" ? experimentFieldPluginConfig.experiments(client, secret) : experimentFieldPluginConfig.experiments,
+    [workspace, secret],
     { equal }
   ), context = useMemo(
-    () => ({ ...experimentFieldPluginConfig, experiments }),
-    [experimentFieldPluginConfig, experiments]
+    () => ({ ...experimentFieldPluginConfig, experiments, secret, setSecret }),
+    [experimentFieldPluginConfig, experiments, secret, setSecret]
   );
   return /* @__PURE__ */ jsx(ExperimentContext.Provider, { value: context, children: props.renderDefault(props) });
 }
 const ArrayInput = (props) => {
-  const fieldPath = props.path.slice(0, -1), { onItemAppend, variantName, variantId, experimentId } = props, experimentValue = useFormValue([...fieldPath, experimentId]), { experiments } = useExperimentContext(), handleClick = useCallback(
+  const fieldPath = props.path.slice(0, -1), experimentId = useFormValue([...fieldPath, "experimentId"]), { experiments } = useExperimentContext(), { onItemAppend, objectName } = props, handleClick = useCallback(
     async (variant) => {
       const item = {
         _key: uuid(),
-        [variantId]: variant.id,
-        [experimentId]: experimentValue,
-        _type: variantName
+        variantId: variant.id,
+        experimentId,
+        _type: objectName
       };
       onItemAppend(item);
     },
-    [variantId, experimentId, experimentValue, variantName, onItemAppend]
-  ), filteredVariants = experiments.find((option) => option.id === experimentValue)?.variants || [], usedVariants = (props.value || [])?.map((variant) => variant[variantId]);
+    [experimentId, objectName, onItemAppend]
+  ), filteredVariants = experiments.find((option) => option.id === experimentId)?.variants || [], usedVariants = props.value?.map((variant) => variant.variantId);
   return /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
     props.renderDefault({ ...props, arrayFunctions: () => null }),
     /* @__PURE__ */ jsx(Inline, { space: 1, children: filteredVariants.map((variant) => /* @__PURE__ */ jsx(
@@ -56,7 +55,7 @@ const ArrayInput = (props) => {
         disabled: usedVariants?.includes(variant.id),
         onClick: () => handleClick(variant)
       },
-      `${experimentValue}-${variant.id}`
+      `${experimentId}-${variant.id}`
     )) })
   ] });
 }, AccessDeniedIcon = forwardRef(function(props, ref) {
@@ -6406,60 +6405,40 @@ const icons = {
 });
 Icon.displayName = "ForwardRef(Icon)";
 const useAddExperimentAction = (props) => {
-  const { onChange, experimentNameOverride } = props, handleAddAction = () => {
-    onChange([set(!0, ["active"])]);
-  };
+  const patchActiveEvent = useMemo(() => set(!0, ["active"]), []), handleAction = useCallback(() => {
+    props.onChange([patchActiveEvent]);
+  }, [patchActiveEvent, props]);
   return {
-    title: `Add ${experimentNameOverride}`,
+    title: "Add experiment",
     type: "action",
     icon: GiSoapExperiment,
-    onAction: handleAddAction,
+    onAction: handleAction,
     renderAsButton: !0
   };
 }, useRemoveExperimentAction = (props) => {
-  const { onChange, experimentId, experimentNameOverride } = props, patchActiveFalseEvent = () => set(!1, ["active"]), patchClearEvent = () => {
-    const experiment = [experimentId], variants = [experimentNameOverride];
-    return [unset(experiment), unset(variants)];
-  }, handleClearAction = () => {
-    const clearEvents = patchClearEvent(), activeEvent = patchActiveFalseEvent();
-    onChange([activeEvent, ...clearEvents]);
-  };
+  const patchActiveEvent = useMemo(() => set(!1, ["active"]), []), patchClearEvent = useMemo(() => {
+    const experimentId = ["experimentId"], variants = ["variants"];
+    return [unset(experimentId), unset(variants)];
+  }, []), handleAction = useCallback(() => {
+    props.onChange([patchActiveEvent, ...patchClearEvent]);
+  }, [patchActiveEvent, patchClearEvent, props]);
   return {
-    title: `Remove ${experimentNameOverride}`,
+    title: "Remove experiment",
     type: "action",
     icon: CloseIcon,
-    onAction: handleClearAction,
+    onAction: handleAction,
     renderAsButton: !0
   };
-}, newActions = ({
-  onChange,
-  inputId,
-  active,
-  experimentNameOverride,
-  experimentId
-}) => {
-  const removeAction = defineDocumentFieldAction({
-    name: `Remove ${experimentNameOverride}`,
-    useAction: (props) => useRemoveExperimentAction({
-      onChange,
-      experimentNameOverride,
-      experimentId
-    })
-  }), addAction = defineDocumentFieldAction({
-    name: `Add ${experimentNameOverride}`,
-    useAction: (props) => useAddExperimentAction({
-      onChange,
-      experimentNameOverride
-    })
-  });
-  return active ? removeAction : addAction;
-}, ExperimentField = (props) => {
-  const { onChange } = props.inputProps, { inputId, experimentNameOverride, experimentId } = props, active = props.value?.active, oldActions = props.actions || [], withActionProps = {
+}, newActions = ({ onChange, inputId, active }) => active ? defineDocumentFieldAction({
+  name: "Experiment",
+  useAction: (props) => useRemoveExperimentAction({ ...props, onChange, inputId })
+}) : defineDocumentFieldAction({
+  name: "Experiment",
+  useAction: (props) => useAddExperimentAction({ ...props, onChange, inputId })
+}), ExperimentField = (props) => {
+  const { onChange } = props.inputProps, { inputId } = props, active = props.value?.active, oldActions = props.actions || [], withActionProps = {
     ...props,
-    actions: [
-      newActions({ onChange, inputId, active, experimentNameOverride, experimentId }),
-      ...oldActions
-    ]
+    actions: [newActions({ onChange, inputId, active }), ...oldActions]
   };
   return props.renderDefault(withActionProps);
 }, Select = (props) => {
@@ -6491,10 +6470,7 @@ const useAddExperimentAction = (props) => {
   title: experiment.label,
   value: experiment.id
 })), ExperimentInput = (props) => {
-  const { experiments } = useExperimentContext(), id = useFormValue(["_id"]), aditionalChangePath = useMemo(
-    () => [...props.path.slice(0, -1), props.variantNameOverride],
-    [props.variantNameOverride, props.path]
-  ), subValues = useFormValue(aditionalChangePath), { patch } = useDocumentOperation(id.replace("drafts.", ""), props.schemaType.name), handleChange = useCallback(
+  const { experiments } = useExperimentContext(), id = useFormValue(["_id"]), aditionalChangePath = useMemo(() => [...props.path.slice(0, -1), "variants"], [props.path]), subValues = useFormValue(aditionalChangePath), { patch } = useDocumentOperation(id.replace("drafts.", ""), props.schemaType.name), handleChange = useCallback(
     (event, onChange) => {
       const inputValue = event.currentTarget.value;
       if (onChange(inputValue ? set(inputValue) : unset()), subValues) {
@@ -6554,27 +6530,15 @@ function extractInnerFields(fields, path, maxDepth) {
     return [...acc, thisFieldWithPath];
   }, []);
 }
-const createExperimentType = ({
-  field,
-  experimentNameOverride,
-  variantNameOverride,
-  variantId,
-  variantArrayName,
-  experimentId
+const createFieldType = ({
+  field
 }) => {
-  const typeName = typeof field == "string" ? field : field.name, usedName = String(typeName[0]).toUpperCase() + String(typeName).slice(1), variantName = `${variantNameOverride}${usedName}`;
+  const typeName = typeof field == "string" ? field : field.name, usedName = String(typeName[0]).toUpperCase() + String(typeName).slice(1), objectName = `variant${usedName}`;
   return defineType({
-    name: `${experimentNameOverride}${usedName}`,
+    name: `experiment${usedName}`,
     type: "object",
     components: {
-      field: (props) => /* @__PURE__ */ jsx(
-        ExperimentField,
-        {
-          ...props,
-          experimentId,
-          experimentNameOverride
-        }
-      )
+      field: ExperimentField
     },
     fields: [
       typeof field == "string" ? (
@@ -6596,47 +6560,37 @@ const createExperimentType = ({
         hidden: !0
       }),
       defineField({
-        name: experimentId,
+        title: "Experiment",
+        name: "experimentId",
         type: "string",
         components: {
-          input: (props) => /* @__PURE__ */ jsx(ExperimentInput, { ...props, variantNameOverride })
+          input: ExperimentInput
         },
         hidden: ({ parent }) => !parent?.active
       }),
       defineField({
-        name: variantArrayName,
+        name: "variants",
         type: "array",
-        hidden: ({ parent }) => !parent?.[experimentId],
+        hidden: ({ parent }) => !parent?.experimentId,
         components: {
-          input: (props) => /* @__PURE__ */ jsx(
-            ArrayInput,
-            {
-              ...props,
-              variantName,
-              variantId,
-              experimentId
-            }
-          )
+          input: (props) => /* @__PURE__ */ jsx(ArrayInput, { ...props, objectName })
         },
         of: [
           defineField({
-            name: variantName,
-            type: variantName
+            name: objectName,
+            type: objectName
           })
         ]
       })
     ]
   });
-}, createVariantType = ({
-  field,
-  variantNameOverride,
-  variantId,
-  experimentId
+}, createFieldObjectType = ({
+  field
 }) => {
   const typeName = typeof field == "string" ? field : field.name, usedName = String(typeName[0]).toUpperCase() + String(typeName).slice(1);
   return defineType({
-    name: `${variantNameOverride}${usedName}`,
-    title: `${variantNameOverride} array ${usedName}`,
+    name: `variant${usedName}`,
+    title: `Experiment array ${usedName}`,
     type: "object",
     components: {
       preview: VariantPreview
@@ -6644,99 +6598,148 @@ const createExperimentType = ({
     fields: [
       {
         type: "string",
-        name: variantId,
+        name: "variantId",
         readOnly: !0
       },
       {
         type: "string",
-        name: experimentId,
+        name: "experimentId",
         hidden: !0
       },
       typeof field == "string" ? (
         // Define a simple field if all we have is the name as a string
         defineField({
           name: "value",
-          type: field
-          // hidden: ({parent}) => !parent?.[`${objectNameOverride}Id`],
+          type: field,
+          hidden: ({ parent }) => !parent?.variantId
         })
       ) : (
         // Pass in the configured options, but overwrite the name
         {
           ...field,
-          name: "value"
-          // hidden: ({parent}) => !parent?.[`${objectNameOverride}Id`],
+          name: "value",
+          hidden: ({ parent }) => !parent?.variantId
         }
       )
     ],
     preview: {
       select: {
-        variant: variantId,
-        experiment: experimentId,
+        variant: "variantId",
+        experiment: "experimentId",
         value: "value"
       }
     }
   });
-}, fieldSchema = ({
-  fields,
-  experimentNameOverride,
-  variantNameOverride,
-  variantId,
-  variantArrayName,
-  experimentId
-}) => [
-  ...fields.map(
-    (field) => createVariantType({ field, variantNameOverride, variantId, experimentId })
-  ),
-  ...fields.map(
-    (field) => createExperimentType({
-      field,
-      experimentNameOverride,
-      variantNameOverride,
-      variantId,
-      variantArrayName,
-      experimentId
-    })
-  )
+}, fieldSchema = ({ fields, experiments }) => [
+  ...fields.map((field) => createFieldObjectType({ field })),
+  ...fields.map((field) => createFieldType({ field }))
 ], fieldLevelExperiments = definePlugin((config) => {
-  const pluginConfig = { ...CONFIG_DEFAULT, ...config }, { fields, experimentNameOverride, variantNameOverride } = pluginConfig, experimentId = `${experimentNameOverride}Id`, variantArrayName = `${variantNameOverride}s`, variantId = `${variantNameOverride}Id`;
+  const pluginConfig = { ...CONFIG_DEFAULT, ...config }, { fields, experiments } = pluginConfig;
   return {
     name: "sanity-personalistaion-plugin-field-level-experiments",
     schema: {
-      types: fieldSchema({
-        fields,
-        experimentNameOverride,
-        variantNameOverride,
-        variantId,
-        variantArrayName,
-        experimentId
-      })
+      types: fieldSchema({ fields, experiments })
     },
     form: {
       components: {
         input: (props) => {
           if (!(props.id === "root" && isObjectInputProps(props)) || !flattenSchemaType(props.schemaType).map(
             (field) => field.type.name
-          ).some(
-            (name) => name.startsWith(experimentNameOverride)
-          ))
+          ).some((name) => name.startsWith("experiment")))
             return props.renderDefault(props);
-          const providerProps = {
-            ...props,
-            experimentFieldPluginConfig: {
-              ...pluginConfig,
-              variantId,
-              variantArrayName,
-              experimentId
-            }
-          };
+          const providerProps = { ...props, experimentFieldPluginConfig: pluginConfig };
           return ExperimentProvider(providerProps);
         }
       }
     }
   };
+}), namespace = "growthbook", pluginConfigKeys = [
+  {
+    key: "apiKey",
+    title: "Your secret API key"
+  }
+], Secrets = (props) => {
+  const { secrets, loading } = useSecrets(namespace), { setSecret } = useExperimentContext(), [showSettings, setShowSettings] = useState(!1);
+  return useEffect(() => {
+    if (!loading)
+      return !secrets && !loading ? (setSecret(void 0), setShowSettings(!0)) : (setSecret(secrets.apiKey), setShowSettings(!1));
+  }, [secrets, loading, setSecret]), showSettings ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SettingsView,
+      {
+        title: "Growthbook secret",
+        namespace,
+        keys: pluginConfigKeys,
+        onClose: () => {
+          setShowSettings(!1);
+        }
+      }
+    ),
+    props.renderDefault(props)
+  ] }) : props.renderDefault(props);
+}, getBooleanConversion = (value) => value === "true" ? "variant" : value === "false" ? "control" : value, getExperiments = async ({
+  client,
+  environment,
+  baseUrl,
+  project,
+  convertBooleans
+}) => {
+  const secret = await client.fetch("*[_id == 'secrets.growthbook'][0].secrets.apiKey");
+  if (!secret) return [];
+  const featureExperiments = [];
+  let hasMore = !0, offset = 0;
+  const url = new URL(baseUrl ?? "https://api.growthbook.io/api/v1/features");
+  for (project && url.searchParams.set("projectId", project); hasMore; ) {
+    url.searchParams.set("offset", offset.toString());
+    const response = await fetch(url, {
+      headers: {
+        Authorization: `Bearer ${secret}`
+      }
+    }), { features, hasMore: responseHasMore, nextOffset } = await response.json();
+    hasMore = responseHasMore, offset = nextOffset, features && features.forEach((feature) => {
+      if (feature.archived)
+        return;
+      const experiments = feature.environments[environment]?.rules.filter(
+        (experiment) => experiment.type === "experiment-ref" || experiment.type === "experiment"
+      );
+      if (!experiments)
+        return;
+      const variations = /* @__PURE__ */ new Set();
+      experiments.forEach((experiment) => {
+        experiment?.variations.forEach((variant) => {
+          variations.add({
+            id: convertBooleans ? getBooleanConversion(variant.value) : variant.value,
+            label: convertBooleans ? getBooleanConversion(variant.value) : variant.value
+          });
+        });
+      });
+      const value = { id: feature.id, label: feature.id, variants: [...variations] };
+      featureExperiments.push(value);
+    });
+  }
+  return featureExperiments;
+}, growthbookFieldLevel = definePlugin((config) => {
+  const { fields, environment, project, convertBooleans, baseUrl } = config;
+  return {
+    name: "sanity-growthbook-personalistaion-plugin-field-level-experiments",
+    plugins: [
+      fieldLevelExperiments({
+        fields,
+        experiments: (client) => getExperiments({ client, environment, baseUrl, project, convertBooleans })
+      })
+    ],
+    form: {
+      components: {
+        input: (props) => !(props.id === "root" && isObjectInputProps(props)) || !flattenSchemaType(props.schemaType).map(
+          (field) => field.type.name
+        ).some((name) => name.startsWith("experiment")) ? props.renderDefault(props) : Secrets(props)
+      }
+    }
+  };
 });
 export {
   fieldLevelExperiments,
-  flattenSchemaType
+  flattenSchemaType,
+  growthbookFieldLevel
 };
 //# sourceMappingURL=index.mjs.map