sanity-plugin-internationalized-array 2.0.0 → 2.0.1-canary.0

package/lib/index.js

@@ -5,8 +5,7 @@ function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
 function _interopNamespaceCompat(e) {
-  if (e && typeof e == "object" && "default" in e)
-    return e;
+  if (e && typeof e == "object" && "default" in e) return e;
   var n = /* @__PURE__ */ Object.create(null);
   return e && Object.keys(e).forEach(function(k) {
     if (k !== "default") {
@@ -29,10 +28,35 @@ const namespace = "sanity-plugin-internationalized-array", version = "v0", prelo
   apiVersion: "2022-11-27",
   buttonLocations: ["field"],
   buttonAddAll: !0
+}, getDocumentsToTranslate = (value, rootPath = []) => {
+  if (Array.isArray(value)) {
+    const arrayRootPath = [...rootPath], internationalizedValues = value.filter((item) => {
+      if (Array.isArray(item)) return !1;
+      if (typeof item == "object") {
+        const type = item?._type;
+        return type?.startsWith("internationalizedArray") && type?.endsWith("Value");
+      }
+      return !1;
+    });
+    return internationalizedValues.length > 0 ? internationalizedValues.map((internationalizedValue) => ({
+      ...internationalizedValue,
+      path: arrayRootPath,
+      pathString: arrayRootPath.join(".")
+    })) : value.length > 0 ? value.map(
+      (item, index) => getDocumentsToTranslate(item, [...arrayRootPath, index])
+    ).flat() : [];
+  }
+  if (typeof value == "object" && value) {
+    const startsWithUnderscoreRegex = /^_/;
+    return Object.keys(value).filter(
+      (key) => !key.match(startsWithUnderscoreRegex)
+    ).map((item) => {
+      const selectedValue = value[item], path = [...rootPath, item];
+      return getDocumentsToTranslate(selectedValue, path);
+    }).flat();
+  }
+  return [];
 };
-function createValueSchemaTypeName(schemaType) {
-  return `${schemaType.name}Value`;
-}
 function AddButtons(props) {
   const { languages, readOnly, value, onClick } = props;
   return languages.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Grid, { columns: Math.min(languages.length, MAX_COLUMNS), gap: 2, children: languages.map((language) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -41,7 +65,7 @@ function AddButtons(props) {
       tone: "primary",
       mode: "ghost",
       fontSize: 1,
-      disabled: readOnly || !!(value != null && value.find((item) => item._key === language.id)),
+      disabled: readOnly || !!value?.find((item) => item._key === language.id),
       text: language.id.toUpperCase(),
       icon: languages.length > MAX_COLUMNS ? void 0 : icons.AddIcon,
       value: language.id,
@@ -51,13 +75,8 @@ function AddButtons(props) {
   )) }) : null;
 }
 function DocumentAddButtons(props) {
-  const { filteredLanguages } = useInternationalizedArrayContext(), { fields } = props.schemaType, value = sanity.isSanityDocument(props.value) ? props.value : void 0, toast = ui.useToast(), { onChange } = structure.useDocumentPane(), internationalizedArrayFields = react.useMemo(
-    () => fields.filter(
-      (field) => field.type.name.startsWith("internationalizedArray")
-    ),
-    [fields]
-  ), handleDocumentButtonClick = react.useCallback(
-    (event) => {
+  const { filteredLanguages } = useInternationalizedArrayContext(), value = sanity.isSanityDocument(props.value) ? props.value : void 0, toast = ui.useToast(), { onChange } = structure.useDocumentPane(), documentsToTranslation = getDocumentsToTranslate(value, []), handleDocumentButtonClick = react.useCallback(
+    async (event) => {
       const languageId = event.currentTarget.value;
       if (!languageId) {
         toast.push({
@@ -66,37 +85,38 @@ function DocumentAddButtons(props) {
         });
         return;
       }
-      if (internationalizedArrayFields.length === 0) {
+      const alreadyTranslated = documentsToTranslation.filter(
+        (translation) => translation?._key === languageId
+      ), removeDuplicates = documentsToTranslation.reduce((filteredTranslations, translation) => alreadyTranslated.filter(
+        (alreadyTranslation) => alreadyTranslation.pathString === translation.pathString
+      ).length > 0 || filteredTranslations.filter(
+        (filteredTranslation) => filteredTranslation.path === translation.path
+      ).length > 0 ? filteredTranslations : [...filteredTranslations, translation], []);
+      if (removeDuplicates.length === 0) {
         toast.push({
           status: "error",
           title: "No internationalizedArray fields found in document root"
         });
         return;
       }
-      const patches = internationalizedArrayFields.filter(
-        (field) => {
-          const fieldValue = value == null ? void 0 : value[field.name];
-          return !(fieldValue && Array.isArray(fieldValue) && fieldValue.find((v) => v._key === languageId));
-        }
-      ).map((field) => {
-        const fieldKey = field.name;
-        return [
-          sanity.setIfMissing([], [fieldKey]),
-          sanity.insert(
-            [
-              {
-                _key: languageId,
-                _type: createValueSchemaTypeName(field.type)
-              }
-            ],
-            "after",
-            [fieldKey, -1]
-          )
-        ];
-      }).flat();
-      onChange(sanity.PatchEvent.from(patches));
+      const patches = [];
+      for (const toTranslate of removeDuplicates) {
+        const path = toTranslate.path, ifMissing = sanity.setIfMissing([], path), insertValue = sanity.insert(
+          [
+            {
+              _key: languageId,
+              _type: toTranslate._type,
+              value: void 0
+            }
+          ],
+          "after",
+          [...path, -1]
+        );
+        patches.push(ifMissing), patches.push(insertValue);
+      }
+      onChange(sanity.PatchEvent.from(patches.flat()));
     },
-    [internationalizedArrayFields, onChange, toast, value]
+    [documentsToTranslation, onChange, toast]
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
     /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, weight: "semibold", children: "Add translation to internationalized fields" }) }),
@@ -118,7 +138,7 @@ const getSelectedValue = (select, document) => {
   for (const [key, path] of Object.entries(selection)) {
     let value = get__default.default(document, path);
     Array.isArray(value) && (value = value.filter(
-      (item) => typeof item == "object" ? (item == null ? void 0 : item._type) === "reference" && "_ref" in item : !0
+      (item) => typeof item == "object" ? item?._type === "reference" && "_ref" in item : !0
     )), selectedValue[key] = value;
   }
   return selectedValue;
@@ -131,7 +151,9 @@ function useInternationalizedArrayContext() {
   return react.useContext(InternationalizedArrayContext);
 }
 function InternationalizedArrayProvider(props) {
-  const { internationalizedArray: internationalizedArray2 } = props, client = sanity.useClient({ apiVersion: internationalizedArray2.apiVersion }), workspace = sanity.useWorkspace(), { value: document } = sanity.useFormBuilder(), deferredDocument = react.useDeferredValue(document), selectedValue = react.useMemo(
+  const { internationalizedArray: internationalizedArray2 } = props, client = sanity.useClient({ apiVersion: internationalizedArray2.apiVersion }), workspace = sanity.useWorkspace(), { value: document } = sanity.useFormBuilder();
+  console.log({ document }, sanity.useFormBuilder());
+  const deferredDocument = react.useDeferredValue(document), selectedValue = react.useMemo(
     () => getSelectedValue(internationalizedArray2.select, deferredDocument),
     [internationalizedArray2.select, deferredDocument]
   ), languages = Array.isArray(internationalizedArray2.languages) ? internationalizedArray2.languages : suspend.suspend(
@@ -145,7 +167,7 @@ function InternationalizedArrayProvider(props) {
       (language) => selectedLanguageIds.includes(language.id)
     ) : languages;
   }, [deferredDocument, languageFilterOptions, languages, selectedLanguageIds]), showDocumentButtons = internationalizedArray2.buttonLocations.includes("document");
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return console.log({ showDocumentButtons }), /* @__PURE__ */ jsxRuntime.jsx(
     InternationalizedArrayContext.Provider,
     {
       value: {
@@ -154,13 +176,7 @@ function InternationalizedArrayProvider(props) {
         filteredLanguages
       },
       children: showDocumentButtons ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 5, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          DocumentAddButtons,
-          {
-            schemaType: props.schemaType,
-            value: props.value
-          }
-        ),
+        /* @__PURE__ */ jsxRuntime.jsx(DocumentAddButtons, { value: props.value }),
         props.renderDefault(props)
       ] }) : props.renderDefault(props)
     }
@@ -177,7 +193,10 @@ function checkAllLanguagesArePresent(languages, value) {
   return languagesInUseIds.length === filteredLanguageIds.length && languagesInUseIds.every((l) => filteredLanguageIds.includes(l));
 }
 function createAddAllTitle(value, languages) {
-  return value != null && value.length ? `Add missing ${languages.length - value.length === 1 ? "language" : "languages"}` : languages.length === 1 ? `Add ${languages[0].title} Field` : "Add all languages";
+  return value?.length ? `Add missing ${languages.length - value.length === 1 ? "language" : "languages"}` : languages.length === 1 ? `Add ${languages[0].title} Field` : "Add all languages";
+}
+function createValueSchemaTypeName(schemaType) {
+  return `${schemaType.name}Value`;
 }
 function createAddLanguagePatches(config) {
   const {
@@ -187,15 +206,15 @@ function createAddLanguagePatches(config) {
     filteredLanguages,
     value,
     path = []
-  } = config, itemBase = { _type: createValueSchemaTypeName(schemaType) }, newItems = Array.isArray(addLanguageKeys) && addLanguageKeys.length > 0 ? (
-    // Just one for this language
-    addLanguageKeys.map((id) => ({ ...itemBase, _key: id }))
-  ) : (
-    // Or one for every missing language
-    filteredLanguages.filter(
-      (language) => value != null && value.length ? !value.find((v) => v._key === language.id) : !0
-    ).map((language) => ({ ...itemBase, _key: language.id }))
-  ), languagesInUse = value != null && value.length ? value.map((v) => v) : [];
+  } = config, itemBase = { _type: createValueSchemaTypeName(schemaType) }, newItems = Array.isArray(addLanguageKeys) && addLanguageKeys.length > 0 ? addLanguageKeys.map((id) => ({
+    ...itemBase,
+    _key: id
+  })) : filteredLanguages.filter(
+    (language) => value?.length ? !value.find((v) => v._key === language.id) : !0
+  ).map((language) => ({
+    ...itemBase,
+    _key: language.id
+  })), languagesInUse = value?.length ? value.map((v) => v) : [];
   return newItems.map((item) => {
     const languageIndex = languages.findIndex((l) => item._key === l.id), remainingLanguages = languages.slice(languageIndex + 1), nextLanguageIndex = languagesInUse.findIndex(
       (l) => (
@@ -213,7 +232,7 @@ function createAddLanguagePatches(config) {
   });
 }
 const createTranslateFieldActions = (fieldActionProps, { languages, filteredLanguages }) => languages.map((language) => {
-  const value = sanity.useFormValue(fieldActionProps.path), disabled = value && Array.isArray(value) ? !!(value != null && value.find((item) => item._key === language.id)) : !1, hidden = !filteredLanguages.some((f) => f.id === language.id), { onChange } = structure.useDocumentPane(), onAction = react.useCallback(() => {
+  const value = sanity.useFormValue(fieldActionProps.path), disabled = value && Array.isArray(value) ? !!value?.find((item) => item._key === language.id) : !1, hidden = !filteredLanguages.some((f) => f.id === language.id), { onChange } = structure.useDocumentPane(), onAction = react.useCallback(() => {
     const { schemaType, path } = fieldActionProps, addLanguageKeys = [language.id], patches = createAddLanguagePatches({
       addLanguageKeys,
       schemaType,
@@ -255,8 +274,7 @@ const createTranslateFieldActions = (fieldActionProps, { languages, filteredLang
 }, internationalizedArrayFieldAction = sanity.defineDocumentFieldAction({
   name: "internationalizedArray",
   useAction(fieldActionProps) {
-    var _a, _b;
-    const isInternationalizedArrayField = (_b = (_a = fieldActionProps == null ? void 0 : fieldActionProps.schemaType) == null ? void 0 : _a.type) == null ? void 0 : _b.name.startsWith(
+    const isInternationalizedArrayField = fieldActionProps?.schemaType?.type?.name.startsWith(
       "internationalizedArray"
     ), { languages, filteredLanguages } = useInternationalizedArrayContext(), translateFieldActions = createTranslateFieldActions(
       fieldActionProps,
@@ -332,11 +350,10 @@ function InternationalizedArray(props) {
     }) : members,
     [languageFilterEnabled, members, languageFilterOptions, selectedLanguageIds]
   ), handleAddLanguage = react.useCallback(
-    (param) => {
-      var _a;
-      if (!(filteredLanguages != null && filteredLanguages.length))
+    async (param) => {
+      if (!filteredLanguages?.length)
         return;
-      const addLanguageKeys = Array.isArray(param) ? param : [(_a = param == null ? void 0 : param.currentTarget) == null ? void 0 : _a.value].filter(Boolean), patches = createAddLanguagePatches({
+      const addLanguageKeys = Array.isArray(param) ? param : [param?.currentTarget?.value].filter(Boolean), patches = createAddLanguagePatches({
         addLanguageKeys,
         schemaType,
         languages,
@@ -354,23 +371,23 @@ function InternationalizedArray(props) {
     };
   }, [defaultLanguages, documentCreatedAt, handleAddLanguage, value]);
   const handleRestoreOrder = react.useCallback(() => {
-    if (!(value != null && value.length) || !(languages != null && languages.length))
+    if (!value?.length || !languages?.length)
       return;
     const updatedValue = value.reduce((acc, v) => {
-      const newIndex = languages.findIndex((l) => l.id === (v == null ? void 0 : v._key));
+      const newIndex = languages.findIndex((l) => l.id === v?._key);
       return newIndex > -1 && (acc[newIndex] = v), acc;
     }, []).filter(Boolean);
-    (value == null ? void 0 : value.length) !== updatedValue.length && toast.push({
+    value?.length !== updatedValue.length && toast.push({
       title: "There was an error reordering languages",
       status: "warning"
     }), onChange(sanity.set(updatedValue));
-  }, [toast, languages, onChange, value]), allKeysAreLanguages = react.useMemo(() => !(value != null && value.length) || !(languages != null && languages.length) ? !0 : value == null ? void 0 : value.every((v) => languages.find((l) => (l == null ? void 0 : l.id) === (v == null ? void 0 : v._key))), [value, languages]), languagesInUse = react.useMemo(
-    () => languages && languages.length > 1 ? languages.filter((l) => value == null ? void 0 : value.find((v) => v._key === l.id)) : [],
+  }, [toast, languages, onChange, value]), allKeysAreLanguages = react.useMemo(() => !value?.length || !languages?.length ? !0 : value?.every((v) => languages.find((l) => l?.id === v?._key)), [value, languages]), languagesInUse = react.useMemo(
+    () => languages && languages.length > 1 ? languages.filter((l) => value?.find((v) => v._key === l.id)) : [],
     [languages, value]
-  ), languagesOutOfOrder = react.useMemo(() => !(value != null && value.length) || !languagesInUse.length ? [] : value.map(
+  ), languagesOutOfOrder = react.useMemo(() => !value?.length || !languagesInUse.length ? [] : value.map(
     (v, vIndex) => vIndex === languagesInUse.findIndex((l) => l.id === v._key) ? null : v
   ).filter(Boolean), [value, languagesInUse]), languagesAreValid = react.useMemo(
-    () => !(languages != null && languages.length) || (languages == null ? void 0 : languages.length) && languages.every((item) => item.id && item.title),
+    () => !languages?.length || languages?.length && languages.every((item) => item.id && item.title),
     [languages]
   );
   react.useEffect(() => {
@@ -385,9 +402,9 @@ function InternationalizedArray(props) {
   const addButtonsAreVisible = (
     // Plugin was configured to display buttons here (default!)
     buttonLocations.includes("field") && // There's at least one language visible
-    (filteredLanguages == null ? void 0 : filteredLanguages.length) > 0 && // Not every language has a value yet
+    filteredLanguages?.length > 0 && // Not every language has a value yet
     !allLanguagesArePresent
-  ), fieldHasMembers = (members == null ? void 0 : members.length) > 0;
+  ), fieldHasMembers = members?.length > 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
     fieldHasMembers ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: filteredMembers.map((member) => member.kind === "item" ? /* @__PURE__ */ react.createElement(
       sanity.ArrayOfObjectsItem,
@@ -423,8 +440,7 @@ function InternationalizedArray(props) {
   ] });
 }
 function getLanguagesFieldOption(schemaType) {
-  var _a;
-  return schemaType ? ((_a = schemaType.options) == null ? void 0 : _a.languages) || getLanguagesFieldOption(schemaType.type) : void 0;
+  return schemaType ? schemaType.options?.languages || getLanguagesFieldOption(schemaType.type) : void 0;
 }
 var array = (config) => {
   const { apiVersion, select, languages, type } = config, typeName = typeof type == "string" ? type : type.name, arrayName = createFieldName(typeName), objectName = createFieldName(typeName, !0);
@@ -436,7 +452,12 @@ var array = (config) => {
       input: InternationalizedArray
     },
     // These options are required for validation rules – not the custom input component
-    options: { apiVersion, select, languages },
+    options: {
+      // @ts-expect-error - find out why it fails
+      apiVersion,
+      select,
+      languages
+    },
     of: [
       sanity.defineField({
         ...typeof type == "string" ? {} : type,
@@ -444,15 +465,16 @@ var array = (config) => {
         type: objectName
       })
     ],
+    // @ts-expect-error - find out why it fails
     validation: (rule) => rule.custom(async (value, context) => {
       if (!value)
         return !0;
       const selectedValue = getSelectedValue(select, context.document), client = context.getClient({ apiVersion });
       let contextLanguages = [];
-      const languagesFieldOption = getLanguagesFieldOption(context == null ? void 0 : context.type);
+      const languagesFieldOption = getLanguagesFieldOption(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)
         return `Cannot be more than ${contextLanguages.length === 1 ? "1 item" : `${contextLanguages.length} items`}`;
-      const nonLanguageKeys = value != null && value.length ? value.filter(
+      const nonLanguageKeys = value?.length ? value.filter(
         (item) => !contextLanguages.find((language) => item._key === language.id)
       ) : [];
       if (nonLanguageKeys.length)
@@ -460,10 +482,10 @@ var array = (config) => {
           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] ? { ...acc, [cur._key]: [...acc[cur._key], cur] } : {
+      const valuesByLanguage = value?.length ? value.filter((item) => !!item?._key).reduce((acc, cur) => acc[cur._key] ? { ...acc, [cur._key]: [...acc[cur._key], cur] } : {
         ...acc,
         [cur._key]: [cur]
-      }, {}) : {}, duplicateValues = Object.values(valuesByLanguage).filter((item) => (item == null ? void 0 : item.length) > 1).flat();
+      }, {}) : {}, duplicateValues = Object.values(valuesByLanguage).filter((item) => item?.length > 1).flat();
       return duplicateValues.length ? {
         message: "There can only be one field per language",
         paths: duplicateValues.map((item) => [{ _key: item._key }])
@@ -479,7 +501,7 @@ function InternationalizedField(props) {
   }) : props.children;
 }
 function getToneFromValidation(validations) {
-  if (!(validations != null && validations.length))
+  if (!validations?.length)
     return;
   const validationLevels = validations.map((v) => v.level);
   if (validationLevels.includes("error"))
@@ -500,16 +522,12 @@ function InternationalizedInput(props) {
     // TODO: Remove this as it shouldn't be necessary?
     value: props.value
   }, { validation, value, onChange, readOnly } = inlineProps, { languages } = useInternationalizedArrayContext(), languageKeysInUse = react.useMemo(
-    () => {
-      var _a;
-      return (_a = parentValue == null ? void 0 : parentValue.map((v) => v._key)) != null ? _a : [];
-    },
+    () => parentValue?.map((v) => v._key) ?? [],
     [parentValue]
-  ), keyIsValid = languages != null && languages.length ? languages.find((l) => l.id === value._key) : !1, handleKeyChange = react.useCallback(
+  ), keyIsValid = languages?.length ? languages.find((l) => l.id === value._key) : !1, handleKeyChange = react.useCallback(
     (event) => {
-      var _a;
-      const languageId = (_a = event == null ? void 0 : event.currentTarget) == null ? void 0 : _a.value;
-      !value || !(languages != null && languages.length) || !languages.find((l) => l.id === languageId) || onChange([sanity.set(languageId, ["_key"])]);
+      const languageId = event?.currentTarget?.value;
+      !value || !languages?.length || !languages.find((l) => l.id === languageId) || onChange([sanity.set(languageId, ["_key"])]);
     },
     [onChange, value, languages]
   ), handleUnset = react.useCallback(() => {
@@ -557,9 +575,9 @@ var object = (config) => {
     title: `Internationalized array ${type}`,
     type: "object",
     components: {
+      // @ts-expect-error - find out why it fails
       item: InternationalizedInput
     },
-    // @ts-expect-error - Address this typing issue with the inner object
     fields: [
       typeof type == "string" ? (
         // Define a simple field if all we have is the name as a string