fix: forward received onItemPrepend/onItemAppend to ArrayFunctions (#…

…7516)
sanity-io · Sep 17, 2024 · 4a50023 · 4a50023
1 parent 1a33125
commit 4a50023
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 45 deletions.
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx
@@ -24,7 +24,8 @@ export function GridArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
     elementProps,
     members,
     onChange,
-    onInsert,
+    onItemPrepend,
+    onItemAppend,
     onItemMove,
     onUpload,
     readOnly,
@@ -40,20 +41,6 @@ export function GridArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
   } = props
   const {t} = useTranslation()
 
-  const handlePrepend = useCallback(
-    (item: Item) => {
-      onInsert({items: [item], position: 'before', referenceItem: 0})
-    },
-    [onInsert],
-  )
-
-  const handleAppend = useCallback(
-    (item: Item) => {
-      onInsert({items: [item], position: 'after', referenceItem: -1})
-    },
-    [onInsert],
-  )
-
   const sortable = schemaType.options?.sortable !== false
 
   const renderItem = useCallback(({key, ...itemProps}: Omit<ObjectItemProps, 'renderDefault'>) => {
@@ -118,8 +105,8 @@ export function GridArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
 
       <ArrayFunctions
         onChange={onChange}
-        onItemAppend={handleAppend}
-        onItemPrepend={handlePrepend}
+        onItemAppend={onItemAppend}
+        onItemPrepend={onItemPrepend}
         onValueCreate={createProtoArrayValue}
         readOnly={readOnly}
         schemaType={schemaType}

diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx
@@ -35,6 +35,8 @@ export function ListArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
     onUpload,
     focusPath,
     readOnly,
+    onItemAppend,
+    onItemPrepend,
     renderAnnotation,
     renderBlock,
     renderField,
@@ -52,20 +54,6 @@ export function ListArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
   const [activeDragItemIndex, setActiveDragItemIndex] = useState<number | null>(null)
   const {space} = useTheme().sanity
 
-  const handlePrepend = useCallback(
-    (item: Item) => {
-      onInsert({items: [item], position: 'before', referenceItem: 0})
-    },
-    [onInsert],
-  )
-
-  const handleAppend = useCallback(
-    (item: Item) => {
-      onInsert({items: [item], position: 'after', referenceItem: -1})
-    },
-    [onInsert],
-  )
-
   const memberKeys = useMemoCompare(
     useMemo(() => members.map((member) => member.key), [members]),
     shallowEquals,
@@ -277,8 +265,8 @@ export function ListArrayInput<Item extends ObjectItem>(props: ArrayOfObjectsInp
       </UploadTargetCard>
       <ArrayFunctions
         onChange={onChange}
-        onItemAppend={handleAppend}
-        onItemPrepend={handlePrepend}
+        onItemAppend={onItemAppend}
+        onItemPrepend={onItemPrepend}
         onValueCreate={createProtoArrayValue}
         readOnly={readOnly}
         schemaType={schemaType}

diff --git a/packages/sanity/src/core/form/members/object/fields/ArrayOfObjectsField.tsx b/packages/sanity/src/core/form/members/object/fields/ArrayOfObjectsField.tsx
@@ -262,17 +262,26 @@ export function ArrayOfObjectsField(props: {
     [handleChange, member.field.value],
   )
 
-  const handlePrependItem = useCallback(
-    (item: any) => {
-      handleChange([setIfMissing([]), insert([ensureKey(item)], 'before', [0])])
+  const handleItemPrepend = useCallback(
+    (item: ObjectItem) => {
+      handleInsert({
+        items: [item],
+        position: 'before',
+        referenceItem: 0,
+      })
     },
-    [handleChange],
+    [handleInsert],
   )
-  const handleAppendItem = useCallback(
-    (item: any) => {
-      handleChange([setIfMissing([]), insert([ensureKey(item)], 'after', [-1])])
+
+  const handleItemAppend = useCallback(
+    (item: ObjectItem) => {
+      handleInsert({
+        items: [item],
+        position: 'after',
+        referenceItem: -1,
+      })
     },
-    [handleChange],
+    [handleInsert],
   )
 
   const handleRemoveItem = useCallback(
@@ -379,8 +388,8 @@ export function ArrayOfObjectsField(props: {
       onInsert: handleInsert,
       onItemMove: handleMoveItem,
       onItemRemove: handleRemoveItem,
-      onItemAppend: handleAppendItem,
-      onItemPrepend: handlePrependItem,
+      onItemAppend: handleItemAppend,
+      onItemPrepend: handleItemPrepend,
       onPathFocus: handleFocusChildPath,
       resolveInitialValue,
       onUpload: handleUpload,
@@ -417,8 +426,8 @@ export function ArrayOfObjectsField(props: {
     handleInsert,
     handleMoveItem,
     handleRemoveItem,
-    handleAppendItem,
-    handlePrependItem,
+    handleItemAppend,
+    handleItemPrepend,
     handleFocusChildPath,
     resolveInitialValue,
     handleUpload,