sanity-plugin-internationalized-array 3.1.4 → 3.1.6

package/lib/index.esm.js

@@ -1,7 +1,7 @@
 import * as suspend from "suspend-react";
 import { suspend as suspend$1 } from "suspend-react";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { isSanityDocument, setIfMissing, insert, PatchEvent, useClient, useWorkspace, defineDocumentFieldAction, useFormValue, set, ArrayOfObjectsItem, MemberItemError, defineField, unset, isDocumentSchemaType, definePlugin, isObjectInputProps } from "sanity";
+import { isSanityDocument, useSchema, setIfMissing, insert, PatchEvent, useClient, useWorkspace, defineDocumentFieldAction, useFormValue, set, ArrayOfObjectsItem, MemberItemError, defineField, unset, isDocumentSchemaType, definePlugin, isObjectInputProps } from "sanity";
 import { useLanguageFilterStudioContext } from "@sanity/language-filter";
 import { Grid, Button, useToast, Stack, Box, Text, Card, Code, Spinner, Label, MenuButton, Menu, MenuItem, Flex, Tooltip } from "@sanity/ui";
 import equal from "fast-deep-equal";
@@ -9,7 +9,32 @@ import { memo, useCallback, createContext, useContext, useDeferredValue, useMemo
 import { useDocumentPane } from "sanity/structure";
 import { AddIcon, TranslateIcon, RemoveCircleIcon } from "@sanity/icons";
 import get from "lodash/get.js";
-const namespace = "sanity-plugin-internationalized-array", version = "v1", preload = (fn) => suspend.preload(() => fn(), [version, namespace]), clear = () => suspend.clear([version, namespace]), peek = (selectedValue) => suspend.peek([version, namespace, selectedValue]), MAX_COLUMNS = {
+const namespace = "sanity-plugin-internationalized-array", version = "v1", functionCache = /* @__PURE__ */ new Map(), functionKeyCache = /* @__PURE__ */ new WeakMap(), preloadWithKey = (fn, key) => suspend.preload(() => fn(), key), clear = () => suspend.clear([version, namespace]), peek = (selectedValue) => suspend.peek([version, namespace, selectedValue]), createCacheKey = (selectedValue, workspaceId) => {
+  const selectedValueHash = JSON.stringify(selectedValue);
+  return workspaceId ? [version, namespace, selectedValueHash, workspaceId] : [version, namespace, selectedValueHash];
+}, getFunctionKey = (fn) => {
+  const cachedKey = functionKeyCache.get(fn);
+  if (cachedKey)
+    return cachedKey;
+  const fnStr = fn.toString();
+  let hash = 0;
+  const maxLength = Math.min(fnStr.length, 100);
+  for (let i = 0; i < maxLength; i++) {
+    const char = fnStr.charCodeAt(i);
+    hash = (hash << 5) - hash + char, hash &= hash;
+  }
+  const key = `anonymous_${Math.abs(hash)}`;
+  return functionKeyCache.set(fn, key), key;
+}, createFunctionCacheKey = (fn, selectedValue, workspaceId) => {
+  const functionKey = getFunctionKey(fn), selectedValueHash = JSON.stringify(selectedValue);
+  return workspaceId ? `${functionKey}:${selectedValueHash}:${workspaceId}` : `${functionKey}:${selectedValueHash}`;
+}, getFunctionCache = (fn, selectedValue, workspaceId) => {
+  const key = createFunctionCacheKey(fn, selectedValue, workspaceId);
+  return functionCache.get(key);
+}, setFunctionCache = (fn, selectedValue, languages, workspaceId) => {
+  const key = createFunctionCacheKey(fn, selectedValue, workspaceId);
+  functionCache.set(key, languages);
+}, MAX_COLUMNS = {
   codeOnly: 5,
   titleOnly: 4,
   titleAndCode: 3
@@ -95,7 +120,43 @@ function AddButtons(props) {
 }
 var AddButtons$1 = memo(AddButtons);
 function DocumentAddButtons(props) {
-  const { filteredLanguages } = useInternationalizedArrayContext(), value = isSanityDocument(props.value) ? props.value : void 0, toast = useToast(), { onChange } = useDocumentPane(), documentsToTranslation = getDocumentsToTranslate(value, []), handleDocumentButtonClick = useCallback(
+  const { filteredLanguages } = useInternationalizedArrayContext(), value = isSanityDocument(props.value) ? props.value : void 0, toast = useToast(), { onChange } = useDocumentPane(), schema = useSchema(), documentsToTranslation = getDocumentsToTranslate(value, []), getInitialValueForType = useCallback(
+    (typeName) => {
+      var _a;
+      if (!typeName) return;
+      const match = typeName.match(/^internationalizedArray(.+)Value$/);
+      if (!match) return;
+      const baseTypeName = match[1].charAt(0).toLowerCase() + match[1].slice(1), arrayBasedTypes = [
+        "body",
+        "htmlContent",
+        "blockContent",
+        "portableText"
+      ];
+      if (arrayBasedTypes.includes(baseTypeName))
+        return [];
+      try {
+        const schemaType = schema.get(typeName);
+        if (schemaType) {
+          const valueField = (_a = schemaType == null ? void 0 : schemaType.fields) == null ? void 0 : _a.find(
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            (f) => f.name === "value"
+          );
+          if (valueField) {
+            const fieldType = valueField.type;
+            if ((fieldType == null ? void 0 : fieldType.jsonType) === "array" || (fieldType == null ? void 0 : fieldType.name) === "array" || (fieldType == null ? void 0 : fieldType.type) === "array" || (fieldType == null ? void 0 : fieldType.of) !== void 0 || arrayBasedTypes.includes(fieldType == null ? void 0 : fieldType.name))
+              return [];
+          }
+        }
+      } catch (error) {
+        console.warn(
+          "Could not determine field type from schema:",
+          typeName,
+          error
+        );
+      }
+    },
+    [schema]
+  ), handleDocumentButtonClick = useCallback(
     async (event) => {
       const languageId = event.currentTarget.value;
       if (!languageId) {
@@ -121,12 +182,13 @@ function DocumentAddButtons(props) {
       }
       const patches = [];
       for (const toTranslate of removeDuplicates) {
-        const path = toTranslate.path, ifMissing = setIfMissing([], path), insertValue = insert(
+        const path = toTranslate.path, initialValue = getInitialValueForType(toTranslate._type), ifMissing = setIfMissing([], path), insertValue = insert(
           [
             {
               _key: languageId,
               _type: toTranslate._type,
-              value: void 0
+              value: initialValue
+              // Use the determined initial value instead of undefined
             }
           ],
           "after",
@@ -136,7 +198,7 @@ function DocumentAddButtons(props) {
       }
       onChange(PatchEvent.from(patches.flat()));
     },
-    [documentsToTranslation, onChange, toast]
+    [documentsToTranslation, getInitialValueForType, onChange, toast]
   );
   return /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
     /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { size: 1, weight: "semibold", children: "Add translation to internationalized fields" }) }),
@@ -182,10 +244,36 @@ function InternationalizedArrayProvider(props) {
   const { internationalizedArray: internationalizedArray2 } = props, client = useClient({ apiVersion: internationalizedArray2.apiVersion }), workspace = useWorkspace(), { formState } = useDocumentPane(), deferredDocument = useDeferredValue(formState == null ? void 0 : formState.value), selectedValue = useMemo(
     () => getSelectedValue(internationalizedArray2.select, deferredDocument),
     [internationalizedArray2.select, deferredDocument]
+  ), workspaceId = useMemo(() => {
+    if (workspace != null && workspace.name)
+      return workspace.name;
+    const workspaceKey = {
+      name: workspace == null ? void 0 : workspace.name,
+      title: workspace == null ? void 0 : workspace.title
+      // Add other stable properties as needed
+    };
+    return JSON.stringify(workspaceKey);
+  }, [workspace]), cacheKey = useMemo(
+    () => createCacheKey(selectedValue, workspaceId),
+    [selectedValue, workspaceId]
   ), languages = Array.isArray(internationalizedArray2.languages) ? internationalizedArray2.languages : suspend$1(
     // eslint-disable-next-line require-await
-    async () => typeof internationalizedArray2.languages == "function" ? internationalizedArray2.languages(client, selectedValue) : internationalizedArray2.languages,
-    [version, namespace, selectedValue, workspace],
+    async () => {
+      if (typeof internationalizedArray2.languages == "function") {
+        const result = await internationalizedArray2.languages(
+          client,
+          selectedValue
+        );
+        return setFunctionCache(
+          internationalizedArray2.languages,
+          selectedValue,
+          result,
+          workspaceId
+        ), result;
+      }
+      return internationalizedArray2.languages;
+    },
+    cacheKey,
     { equal }
   ), { selectedLanguageIds, options: languageFilterOptions } = useLanguageFilterStudioContext(), filteredLanguages = useMemo(() => {
     const documentType = deferredDocument ? deferredDocument._type : void 0;
@@ -227,10 +315,13 @@ function InternationalizedField(props) {
   })) : customProps.renderDefault(customProps);
 }
 var Preload = memo(function(props) {
-  const client = useClient({ apiVersion: props.apiVersion });
-  return Array.isArray(peek({})) || preload(
-    async () => Array.isArray(props.languages) ? props.languages : props.languages(client, {})
-  ), null;
+  const client = useClient({ apiVersion: props.apiVersion }), cacheKey = createCacheKey({});
+  return Array.isArray(peek({})) || preloadWithKey(async () => {
+    if (Array.isArray(props.languages))
+      return props.languages;
+    const result = await props.languages(client, {});
+    return setFunctionCache(props.languages, {}, result), result;
+  }, cacheKey), null;
 });
 function checkAllLanguagesArePresent(languages, value) {
   const filteredLanguageIds = languages.map((l) => l.id), languagesInUseIds = value ? value.map((v) => v._key) : [];
@@ -539,24 +630,48 @@ var __defProp$4 = Object.defineProperty, __defProps$3 = Object.defineProperties,
     ],
     // @ts-expect-error - fix typings
     validation: (rule) => rule.custom(async (value, context) => {
-      if (!value)
+      var _a;
+      if (!value || value.length === 0 || value.length === 1 && !((_a = value[0]) != null && _a._key))
         return !0;
       const selectedValue = getSelectedValue(select, context.document), client = context.getClient({ apiVersion });
       let contextLanguages = [];
       const languagesFieldOption = getLanguagesFieldOption(context == null ? void 0 : context.type);
-      if (Array.isArray(languagesFieldOption) ? contextLanguages = languagesFieldOption : Array.isArray(peek(selectedValue)) ? contextLanguages = peek(selectedValue) || [] : typeof languagesFieldOption == "function" && (contextLanguages = await languagesFieldOption(client, selectedValue)), value && value.length > contextLanguages.length)
+      if (Array.isArray(languagesFieldOption))
+        contextLanguages = languagesFieldOption;
+      else if (Array.isArray(peek(selectedValue)))
+        contextLanguages = peek(selectedValue) || [];
+      else if (typeof languagesFieldOption == "function") {
+        const cachedLanguages = getFunctionCache(
+          languagesFieldOption,
+          selectedValue
+        );
+        if (Array.isArray(cachedLanguages))
+          contextLanguages = cachedLanguages;
+        else {
+          const suspendCachedLanguages = peek(selectedValue);
+          Array.isArray(suspendCachedLanguages) ? contextLanguages = suspendCachedLanguages : (contextLanguages = await languagesFieldOption(
+            client,
+            selectedValue
+          ), setFunctionCache(
+            languagesFieldOption,
+            selectedValue,
+            contextLanguages
+          ));
+        }
+      }
+      if (value && value.length > contextLanguages.length)
         return `Cannot be more than ${contextLanguages.length === 1 ? "1 item" : `${contextLanguages.length} items`}`;
-      const nonLanguageKeys = value != null && value.length ? value.filter(
-        (item) => !contextLanguages.find((language) => item._key === language.id)
-      ) : [];
+      const languageIds = new Set(contextLanguages.map((lang) => lang.id)), nonLanguageKeys = value.filter(
+        (item) => (item == null ? void 0 : item._key) && !languageIds.has(item._key)
+      );
       if (nonLanguageKeys.length)
         return {
           message: "Array item keys must be valid languages registered to the field type",
           paths: nonLanguageKeys.map((item) => [{ _key: item._key }])
         };
-      const valuesByLanguage = value != null && value.length ? value.filter((item) => !!(item != null && item._key)).reduce((acc, cur) => acc[cur._key] ? __spreadProps$3(__spreadValues$4({}, acc), { [cur._key]: [...acc[cur._key], cur] }) : __spreadProps$3(__spreadValues$4({}, acc), {
-        [cur._key]: [cur]
-      }), {}) : {}, duplicateValues = Object.values(valuesByLanguage).filter((item) => (item == null ? void 0 : item.length) > 1).flat();
+      const seenKeys = /* @__PURE__ */ new Set(), duplicateValues = [];
+      for (const item of value)
+        item != null && item._key && (seenKeys.has(item._key) ? duplicateValues.push(item) : seenKeys.add(item._key));
       return duplicateValues.length ? {
         message: "There can only be one field per language",
         paths: duplicateValues.map((item) => [{ _key: item._key }])
@@ -584,6 +699,28 @@ var __defProp$3 = Object.defineProperty, __defProps$2 = Object.defineProperties,
 function InternationalizedInput(props) {
   const parentValue = useFormValue(
     props.path.slice(0, -1)
+  ), originalOnChange = props.inputProps.onChange, wrappedOnChange = useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (patches) => {
+      var _a;
+      if (!Array.isArray(patches))
+        return originalOnChange(patches);
+      const valueField = (_a = props.value) == null ? void 0 : _a.value;
+      if ((valueField == null || Array.isArray(valueField) && valueField.length === 0) && patches.some((patch) => !patch || typeof patch != "object" ? !1 : patch.type === "insert" && patch.path && Array.isArray(patch.path) && patch.path.length > 0 ? patch.path[0] === "value" || typeof patch.path[0] == "number" : !1)) {
+        const initPatch = valueField === void 0 ? { type: "setIfMissing", path: ["value"], value: [] } : null, fixedPatches = patches.map((patch) => {
+          if (!patch || typeof patch != "object")
+            return patch;
+          if (patch.type === "insert" && patch.path && Array.isArray(patch.path)) {
+            const fixedPath = patch.path[0] === "value" ? patch.path : ["value", ...patch.path];
+            return __spreadProps$2(__spreadValues$3({}, patch), { path: fixedPath });
+          }
+          return patch;
+        }), allPatches = initPatch ? [initPatch, ...fixedPatches] : fixedPatches;
+        return originalOnChange(allPatches);
+      }
+      return originalOnChange(patches);
+    },
+    [props.value, originalOnChange]
   ), inlineProps = __spreadProps$2(__spreadValues$3({}, props.inputProps), {
     // This is the magic that makes inline editing work?
     members: props.inputProps.members.filter(
@@ -591,7 +728,9 @@ function InternationalizedInput(props) {
     ),
     // This just overrides the type
     // Remove this as it shouldn't be necessary?
-    value: props.value
+    value: props.value,
+    // Use our wrapped onChange handler
+    onChange: wrappedOnChange
   }), { validation, value, onChange, readOnly } = inlineProps, { languages, languageDisplay, defaultLanguages } = useInternationalizedArrayContext(), languageKeysInUse = useMemo(
     () => {
       var _a;
@@ -641,7 +780,7 @@ function InternationalizedInput(props) {
       }
     ) }),
     /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
-      /* @__PURE__ */ jsx(Card, { flex: 1, tone: "inherit", children: props.inputProps.renderInput(props.inputProps) }),
+      /* @__PURE__ */ jsx(Card, { flex: 1, tone: "inherit", children: props.inputProps.renderInput(inlineProps) }),
       /* @__PURE__ */ jsx(Card, { tone: "inherit", children: isDefault ? /* @__PURE__ */ jsx(
         Tooltip,
         {