@byline/admin 4.3.0 → 4.4.1

package/src/fields/file/file-field.tsx

@@ -57,8 +57,6 @@ function triggerDownload(url: string, filename?: string) {
 
 interface FileFieldProps {
   field: FieldType
-  /** Collection path required to call the /upload endpoint. */
-  collectionPath?: string
   value?: StoredFileValue | null
   defaultValue?: StoredFileValue | null
   onChange?: (value: StoredFileValue | null) => void
@@ -67,7 +65,6 @@ interface FileFieldProps {
 
 export const FileField = ({
   field,
-  collectionPath,
   value,
   defaultValue,
   onChange: _onChange,
@@ -79,7 +76,10 @@ export const FileField = ({
   const isDirty = useIsDirty(fieldPath)
   const fieldValue = useFieldValue<StoredFileValue | null | undefined>(fieldPath)
   const isUploading = useIsFieldUploading(fieldPath)
-  const { removePendingUpload, documentId } = useFormContext()
+  // `collectionPath` comes from form context rather than a prop: it is
+  // constant for the form, and prop-drilling it meant any container that
+  // forgot to forward it silently rendered this widget read-only.
+  const { removePendingUpload, documentId, collectionPath } = useFormContext()
 
   const handleChange = useFieldChangeHandler(field, fieldPath)
 

package/src/fields/file/file-upload-field.tsx

@@ -71,11 +71,15 @@ export const FileUploadField = ({
 
       const pendingValue = createPendingStoredFileValue(file, previewUrl)
 
-      addPendingUpload(fieldPath, {
-        file,
-        previewUrl,
-        collectionPath,
-      })
+      if (
+        !addPendingUpload(fieldPath, {
+          file,
+          previewUrl,
+          collectionPath,
+        })
+      ) {
+        return
+      }
 
       setStatus('idle')
       onUploaded(pendingValue)

package/src/fields/group/group-field.tsx

@@ -43,12 +43,6 @@ interface GroupFieldProps {
    * listeners.
    */
   disableSorting?: boolean
-  /**
-   * Collection path forwarded to upload-capable child fields (`file` / `image`),
-   * which need it to reach the `/upload` endpoint. Without it those fields fall
-   * back to their empty placeholder and never render an upload widget.
-   */
-  collectionPath?: string
   /**
    * Active content locale, forwarded to child fields so localized widgets
    * nested inside the group (e.g. a `localized` richText) can render their
@@ -73,7 +67,6 @@ export const GroupField = ({
   defaultValue,
   path,
   disableSorting = true,
-  collectionPath,
   contentLocale,
   fieldAdmin,
 }: GroupFieldProps) => {
@@ -116,7 +109,6 @@ export const GroupField = ({
               defaultValue={groupData[innerField.name]}
               basePath={path}
               disableSorting={disableSorting}
-              collectionPath={collectionPath}
               contentLocale={contentLocale}
               components={fieldAdmin?.[innerField.name]?.components}
               editor={fieldAdmin?.[innerField.name]?.editor}

package/src/fields/image/image-field.tsx

@@ -38,8 +38,6 @@ import { ImageUploadField } from './image-upload-field'
 
 interface ImageFieldProps {
   field: FieldType
-  /** Collection path required to call the /upload endpoint. */
-  collectionPath?: string
   // Stored value is currently a plain object with file/image metadata
   // coming from the seed data / storage layer.
   value?: StoredFileValue | null
@@ -50,7 +48,6 @@ interface ImageFieldProps {
 
 export const ImageField = ({
   field,
-  collectionPath,
   value,
   defaultValue,
   onChange: _onChange,
@@ -61,7 +58,10 @@ export const ImageField = ({
   const isDirty = useIsDirty(fieldPath)
   const fieldValue = useFieldValue<StoredFileValue | null | undefined>(fieldPath)
   const isUploading = useIsFieldUploading(fieldPath)
-  const { removePendingUpload, documentId } = useFormContext()
+  // `collectionPath` comes from form context rather than a prop: it is
+  // constant for the form, and prop-drilling it meant any container that
+  // forgot to forward it silently rendered this widget read-only.
+  const { removePendingUpload, documentId, collectionPath } = useFormContext()
   const { t } = useTranslation('byline-admin')
 
   // Re-use the standard field change handler so patches are emitted correctly.

package/src/fields/image/image-upload-field.tsx

@@ -18,7 +18,7 @@
  */
 
 import type { ChangeEvent, DragEvent } from 'react'
-import { useCallback, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 
 import {
   createPendingStoredFileValue,
@@ -62,12 +62,20 @@ export const ImageUploadField = ({
   accept = 'image/*',
 }: ImageUploadFieldProps) => {
   const inputRef = useRef<HTMLInputElement>(null)
+  const mountedRef = useRef(true)
   const [status, setStatus] = useState<SelectionStatus>('idle')
   const [errorMessage, setErrorMessage] = useState<string | null>(null)
   const [isDragOver, setIsDragOver] = useState(false)
   const { addPendingUpload } = useFormContext()
   const { t } = useTranslation('byline-admin')
 
+  useEffect(() => {
+    mountedRef.current = true
+    return () => {
+      mountedRef.current = false
+    }
+  }, [])
+
   // -------------------------------------------------------------------------
   // Core file selection logic (deferred upload)
   // -------------------------------------------------------------------------
@@ -90,6 +98,11 @@ export const ImageUploadField = ({
       // Extract image dimensions for the pending value
       const img = new Image()
       img.onload = () => {
+        if (!mountedRef.current) {
+          URL.revokeObjectURL(previewUrl)
+          return
+        }
+
         // SVGs without explicit width/height attrs (viewBox-only) report naturalWidth/Height = 0.
         // Skip dimensions when zero so they are stored as null (scalable, no fixed size).
         const w = img.naturalWidth
@@ -100,11 +113,15 @@ export const ImageUploadField = ({
         const pendingValue = createPendingStoredFileValue(file, previewUrl, dimensions)
 
         // Register the pending upload in form context
-        addPendingUpload(fieldPath, {
-          file,
-          previewUrl,
-          collectionPath,
-        })
+        if (
+          !addPendingUpload(fieldPath, {
+            file,
+            previewUrl,
+            collectionPath,
+          })
+        ) {
+          return
+        }
 
         setStatus('idle')
         onUploaded(pendingValue)
@@ -112,6 +129,7 @@ export const ImageUploadField = ({
 
       img.onerror = () => {
         URL.revokeObjectURL(previewUrl)
+        if (!mountedRef.current) return
         setStatus('error')
         setErrorMessage(t('fields.image.upload.errors.cannotRead'))
       }

package/src/forms/form-context.tsx

@@ -19,7 +19,12 @@ import type { DocumentPatch, FieldSetPatch } from '@byline/core/patches'
 // outright. A bare `from 'lodash-es'` import otherwise pools into a single
 // ~85KB chunk that leaks onto the public frontend bundle (form-context is
 // reachable from the layout graph).
-import { get as getNestedValue, set as setNestedValue } from './nested-path'
+import {
+  get as getNestedValue,
+  hasExistingIdTargets,
+  setWithResult as setNestedValue,
+} from './nested-path'
+import { deletePendingUploadsUnderPath } from './pending-uploads'
 import { useTrackedSlot } from './use-tracked-slot'
 
 interface FormError {
@@ -90,6 +95,19 @@ interface FormContextType {
    * `@byline/core`).
    */
   documentId: string | null
+  /**
+   * Path of the collection this form edits, `null` when the form is rendered
+   * without one. Upload widgets need it to address the upload endpoint.
+   *
+   * It lives here rather than being passed down because it is constant for
+   * the whole form: threading it as a prop meant every nesting-capable
+   * container (`array`, `group`, `blocks`) had to remember to forward it,
+   * and a container that forgot silently rendered upload fields read-only —
+   * no error, just a missing drop zone. That happened twice, in `array` /
+   * `group` and then in `blocks`. A value read from context cannot be
+   * dropped by a container that never carries it.
+   */
+  collectionPath: string | null
   setFieldValue: (name: string, value: any) => void
   setFieldStore: (name: string, value: any) => void
   getFieldValue: (name: string) => any
@@ -117,8 +135,9 @@ interface FormContextType {
   subscribeErrors: (listener: ErrorsListener) => () => void
   subscribeMeta: (listener: MetaListener) => () => void
   // Pending uploads (deferred until save)
-  addPendingUpload: (fieldPath: string, upload: PendingUpload) => void
+  addPendingUpload: (fieldPath: string, upload: PendingUpload) => boolean
   removePendingUpload: (fieldPath: string) => void
+  removePendingUploadsUnder: (itemPath: string) => void
   getPendingUploads: () => Map<string, PendingUpload>
   hasPendingUploads: () => boolean
   clearPendingUploads: () => void
@@ -158,6 +177,7 @@ export const FormProvider = ({
   children,
   initialData = {},
   documentId = null,
+  collectionPath = null,
 }: {
   children: React.ReactNode
   initialData?: Record<string, any>
@@ -166,6 +186,12 @@ export const FormProvider = ({
    * the context for upload widgets honouring `upload.requireSavedDocument`.
    */
   documentId?: string | null
+  /**
+   * Path of the collection being edited. Exposed on the context so upload
+   * widgets can reach the upload endpoint from any nesting depth without
+   * every container forwarding it — see `FormContextType.collectionPath`.
+   */
+  collectionPath?: string | null
 }) => {
   const fieldValues = useRef<Record<string, any>>(
     JSON.parse(JSON.stringify(initialData?.fields ?? initialData))
@@ -264,13 +290,14 @@ export const FormProvider = ({
       const newFieldValues = { ...fieldValues.current }
 
       // Keep nested path values up to date for generic usage and patches.
-      setNestedValue(newFieldValues, name, value)
+      if (!setNestedValue(newFieldValues, name, value)) return false
 
       fieldValues.current = newFieldValues
       dirtyFields.current.add(name)
 
       notifyFieldListeners(name, value)
       notifyMetaListeners()
+      return true
     },
     [notifyFieldListeners, notifyMetaListeners]
   )
@@ -284,7 +311,7 @@ export const FormProvider = ({
 
   const setFieldValue = useCallback(
     (name: string, value: any) => {
-      updateFieldStoreInternal(name, value)
+      if (!updateFieldStoreInternal(name, value)) return
 
       const patch: FieldSetPatch = {
         kind: 'field.set',
@@ -401,6 +428,14 @@ export const FormProvider = ({
 
   const addPendingUpload = useCallback(
     (fieldPath: string, upload: PendingUpload) => {
+      // Image metadata extraction is asynchronous. If its containing item was
+      // removed while decoding, discard the late registration rather than
+      // allowing submit to recreate or overwrite an item through a stale path.
+      if (!hasExistingIdTargets(fieldValues.current, fieldPath)) {
+        URL.revokeObjectURL(upload.previewUrl)
+        return false
+      }
+
       // If there's an existing pending upload for this path, revoke its blob URL
       const existing = pendingUploadsRef.current.get(fieldPath)
       if (existing) {
@@ -409,6 +444,7 @@ export const FormProvider = ({
       pendingUploadsRef.current.set(fieldPath, upload)
       dirtyFields.current.add(fieldPath)
       notifyMetaListeners()
+      return true
     },
     [notifyMetaListeners]
   )
@@ -425,6 +461,16 @@ export const FormProvider = ({
     [notifyMetaListeners]
   )
 
+  const removePendingUploadsUnder = useCallback(
+    (itemPath: string) => {
+      const deleted = deletePendingUploadsUnderPath(pendingUploadsRef.current, itemPath, (url) =>
+        URL.revokeObjectURL(url)
+      )
+      if (deleted) notifyMetaListeners()
+    },
+    [notifyMetaListeners]
+  )
+
   const getPendingUploads = useCallback(() => {
     return new Map(pendingUploadsRef.current)
   }, [])
@@ -662,6 +708,7 @@ export const FormProvider = ({
     <FormContext.Provider
       value={{
         documentId,
+        collectionPath,
         setFieldValue,
         setFieldStore,
         getFieldValue,
@@ -687,6 +734,7 @@ export const FormProvider = ({
         subscribeMeta,
         addPendingUpload,
         removePendingUpload,
+        removePendingUploadsUnder,
         getPendingUploads,
         hasPendingUploads,
         clearPendingUploads,

package/src/forms/form-renderer.tsx

@@ -485,7 +485,6 @@ const FormContent = ({
         key={field.name}
         field={field}
         defaultValue={initialData?.fields?.[field.name]}
-        collectionPath={collectionPath}
         contentLocale={contentLocale}
         components={adminConfig?.fields?.[field.name]?.components}
         editor={adminConfig?.fields?.[field.name]?.editor}
@@ -552,6 +551,8 @@ const FormContent = ({
       noValidate
       onSubmit={handleSubmit}
       className={cx('byline-form', styles.form)}
+      inert={isUploading ? true : undefined}
+      aria-busy={isUploading}
     >
       <div className={cx('byline-form-heading-row', styles['heading-row'])}>
         <h1 className={cx('byline-form-heading', styles.heading)}>{heading}</h1>
@@ -778,6 +779,7 @@ export const FormRenderer = ({
       key={`${initialLocale ?? 'default'}-${initialData?.versionId ?? ''}`}
       initialData={initialData}
       documentId={mode === 'edit' && typeof initialData?.id === 'string' ? initialData.id : null}
+      collectionPath={collectionPath ?? null}
     >
       <FormContent
         mode={mode}

package/src/forms/nested-path.test.node.ts

@@ -8,7 +8,7 @@
 
 import { describe, expect, it } from 'vitest'
 
-import { get, set, toPath } from './nested-path'
+import { get, hasExistingIdTargets, set, setWithResult, toPath } from './nested-path'
 
 describe('toPath', () => {
   it('parses dot and bracket notation', () => {
@@ -28,6 +28,22 @@ describe('get', () => {
     expect(get(obj, 'items[1].title')).toBe('y')
   })
 
+  it('selects nested repeating items by stable id', () => {
+    const value = {
+      content: [
+        {
+          _id: 'block-b',
+          gallery: [
+            { _id: 'image-1', alt: 'one' },
+            { _id: 'image-2', alt: 'two' },
+          ],
+        },
+      ],
+    }
+    expect(get(value, 'content[id=block-b].gallery[id=image-2].alt')).toBe('two')
+    expect(get(value, 'content[id=missing].gallery[id=image-2].alt')).toBeUndefined()
+  })
+
   it('preserves falsy values (does not conflate with missing)', () => {
     expect(get(obj, 'a.zero')).toBe(0)
     expect(get(obj, 'a.empty')).toBe('')
@@ -78,8 +94,41 @@ describe('set', () => {
     expect(Array.isArray(o.items)).toBe(true)
   })
 
+  it('writes through nested stable-id selectors without changing array order', () => {
+    const o = {
+      content: [
+        { _id: 'a', gallery: [{ _id: 'x', alt: 'keep' }] },
+        { _id: 'b', gallery: [{ _id: 'y', alt: 'old' }] },
+      ],
+    }
+    set(o, 'content[id=b].gallery[id=y].alt', 'new')
+    expect(o.content.map((item) => item._id)).toEqual(['a', 'b'])
+    expect(o.content[0]?.gallery[0]?.alt).toBe('keep')
+    expect(o.content[1]?.gallery[0]?.alt).toBe('new')
+  })
+
+  it('does not create a ghost item for an unknown stable id', () => {
+    const o = { items: [{ _id: 'a', title: 'keep' }] }
+    expect(setWithResult(o, 'items[id=gone].title', 'new')).toBe(false)
+    expect(o).toEqual({ items: [{ _id: 'a', title: 'keep' }] })
+
+    const missingContainer: { group: { items?: unknown[] } } = { group: {} }
+    expect(setWithResult(missingContainer, 'group.items[id=gone].title', 'new')).toBe(false)
+    expect(missingContainer).toEqual({ group: {} })
+  })
+
   it('returns the mutated root', () => {
     const o: any = {}
     expect(set(o, 'x', 1)).toBe(o)
   })
 })
+
+describe('hasExistingIdTargets', () => {
+  const value = { items: [{ _id: 'a', nested: [{ _id: 'b' }] }] }
+
+  it('accepts live nested identities and rejects removed ones', () => {
+    expect(hasExistingIdTargets(value, 'items[id=a].nested[id=b].title')).toBe(true)
+    expect(hasExistingIdTargets(value, 'items[id=a].nested[id=gone].title')).toBe(false)
+    expect(hasExistingIdTargets(value, 'title')).toBe(true)
+  })
+})

package/src/forms/nested-path.ts

@@ -8,7 +8,7 @@
  * Minimal nested `get`/`set` over string field paths, replacing lodash-es
  * (which pulled a large shared chunk onto unrelated bundles). Supports the
  * dot + bracket notation produced by the form field-path builders, e.g.
- * `title`, `a.b.c`, `items[0].title`, `blocks[2].nested[1].field`.
+ * `title`, `a.b.c`, `items[0].title`, `blocks[id=abc].nested[1].field`.
  *
  * `set` mirrors lodash semantics: it creates intermediate **arrays** when the
  * next path segment is a numeric index and plain **objects** otherwise, and it
@@ -19,42 +19,130 @@
  * form paths ever produce. See nested-path.test.node.ts for the covered cases.
  */
 
-const isIndexKey = (key: string): boolean => /^(?:0|[1-9]\d*)$/.test(key)
+import { type PathSegment, parseInstancePath } from '@byline/core'
 
 /** Split a field path into segments: `items[0].title` -> ['items','0','title']. */
 export function toPath(path: string): string[] {
   return path.match(/[^.[\]]+/g) ?? []
 }
 
+function selectId(value: unknown, id: string): number {
+  if (!Array.isArray(value)) return -1
+  return value.findIndex((item) => item != null && typeof item === 'object' && item._id === id)
+}
+
+function newContainer(next: PathSegment | undefined): any[] | Record<string, unknown> {
+  return next?.kind === 'index' || next?.kind === 'id' ? [] : {}
+}
+
 // Returns `any` (not `T | undefined`) to match lodash's loose `get` contract,
 // so existing call sites that treat the result as `any` keep type-checking.
 export function get<T = any>(object: unknown, path: string): T {
   if (object == null) return undefined as T
+  const parsed = parseInstancePath(path)
+  if (!parsed.ok) return undefined as T
+
   let current: any = object
-  for (const key of toPath(path)) {
+  for (const segment of parsed.segments) {
     if (current == null) return undefined as T
-    current = current[key]
+    if (segment.kind === 'field') {
+      current = current[segment.name]
+    } else if (segment.kind === 'index') {
+      current = current[segment.index]
+    } else if (segment.kind === 'id') {
+      const index = selectId(current, segment.id)
+      if (index === -1) return undefined as T
+      current = current[index]
+    } else {
+      return undefined as T
+    }
   }
   return current as T
 }
 
-export function set<T extends object>(object: T, path: string, value: unknown): T {
-  if (object == null) return object
-  const keys = toPath(path)
-  if (keys.length === 0) return object
+/** Whether every stable-id selector in a path still identifies a live item. */
+export function hasExistingIdTargets(object: unknown, path: string): boolean {
+  const parsed = parseInstancePath(path)
+  if (!parsed.ok) return false
+
+  let current: any = object
+  for (const segment of parsed.segments) {
+    if (segment.kind === 'field') {
+      current = current?.[segment.name]
+    } else if (segment.kind === 'index') {
+      current = current?.[segment.index]
+    } else if (segment.kind === 'id') {
+      const index = selectId(current, segment.id)
+      if (index === -1) return false
+      current = current[index]
+    } else {
+      return false
+    }
+  }
+  return true
+}
+
+/** Set a path and report whether all stable-id selectors resolved. */
+export function setWithResult<T extends object>(object: T, path: string, value: unknown): boolean {
+  if (object == null) return false
+  const parsed = parseInstancePath(path)
+  if (!parsed.ok || parsed.segments.length === 0) return false
 
   let current: any = object
-  for (let i = 0; i < keys.length - 1; i++) {
-    // Bounded by the loop condition, so these indexed reads are always defined.
-    const key = keys[i] as string
-    const nextKey = keys[i + 1] as string
-    const existing = current[key]
-    if (existing == null || typeof existing !== 'object') {
-      // Create the container the next segment needs: array for an index, else object.
-      current[key] = isIndexKey(nextKey) ? [] : {}
+  for (let i = 0; i < parsed.segments.length; i++) {
+    const segment = parsed.segments[i] as PathSegment
+    const next = parsed.segments[i + 1]
+    const last = i === parsed.segments.length - 1
+
+    if (segment.kind === 'field') {
+      if (last) {
+        current[segment.name] = value
+        return true
+      }
+      const existing = current[segment.name]
+      if (existing == null || typeof existing !== 'object') {
+        // Do not create a partial container on the way to an item identity
+        // that may no longer exist. Normal non-ID lodash-style writes still
+        // create their intermediate structure below.
+        if (parsed.segments.slice(i + 1).some((candidate) => candidate.kind === 'id')) return false
+        current[segment.name] = newContainer(next)
+      }
+      current = current[segment.name]
+      continue
     }
-    current = current[key]
+
+    if (segment.kind === 'index') {
+      if (!Array.isArray(current)) return false
+      if (last) {
+        current[segment.index] = value
+        return true
+      }
+      const existing = current[segment.index]
+      if (existing == null || typeof existing !== 'object') {
+        if (parsed.segments.slice(i + 1).some((candidate) => candidate.kind === 'id')) return false
+        current[segment.index] = newContainer(next)
+      }
+      current = current[segment.index]
+      continue
+    }
+
+    if (segment.kind === 'id') {
+      const index = selectId(current, segment.id)
+      if (index === -1) return false
+      if (last) {
+        current[index] = value
+        return true
+      }
+      current = current[index]
+      continue
+    }
+
+    return false
   }
-  current[keys[keys.length - 1] as string] = value
+  return false
+}
+
+export function set<T extends object>(object: T, path: string, value: unknown): T {
+  setWithResult(object, path, value)
   return object
 }

package/src/forms/pending-uploads.test.node.ts

@@ -0,0 +1,23 @@
+import { describe, expect, it, vi } from 'vitest'
+
+import { deletePendingUploadsUnderPath } from './pending-uploads'
+
+describe('deletePendingUploadsUnderPath', () => {
+  it('removes and revokes only uploads beneath the removed item', () => {
+    const uploads = new Map([
+      ['content[id=a].image', { previewUrl: 'blob:a' }],
+      ['content[id=b].image', { previewUrl: 'blob:b' }],
+      ['content[id=b].gallery[id=x].image', { previewUrl: 'blob:nested' }],
+    ])
+    const revoke = vi.fn()
+
+    expect(deletePendingUploadsUnderPath(uploads, 'content[id=b]', revoke)).toBe(true)
+    expect([...uploads.keys()]).toEqual(['content[id=a].image'])
+    expect(revoke.mock.calls).toEqual([['blob:b'], ['blob:nested']])
+  })
+
+  it('reports when no pending upload matched', () => {
+    const uploads = new Map([['content[id=a].image', { previewUrl: 'blob:a' }]])
+    expect(deletePendingUploadsUnderPath(uploads, 'content[id=b]', vi.fn())).toBe(false)
+  })
+})

package/src/forms/pending-uploads.ts

@@ -0,0 +1,22 @@
+interface PendingUploadLike {
+  previewUrl: string
+}
+
+/** Remove deferred uploads belonging to one repeating item and its descendants. */
+export function deletePendingUploadsUnderPath<T extends PendingUploadLike>(
+  uploads: Map<string, T>,
+  itemPath: string,
+  revokeObjectURL: (url: string) => void
+): boolean {
+  const descendantPrefix = `${itemPath}.`
+  let deleted = false
+
+  for (const [fieldPath, upload] of uploads) {
+    if (fieldPath !== itemPath && !fieldPath.startsWith(descendantPrefix)) continue
+    revokeObjectURL(upload.previewUrl)
+    uploads.delete(fieldPath)
+    deleted = true
+  }
+
+  return deleted
+}

package/src/forms/repeating-items.test.node.ts

@@ -0,0 +1,36 @@
+import { describe, expect, it } from 'vitest'
+
+import { moveRepeatingItems, repeatingItemId, repeatingItemPath } from './repeating-items'
+
+describe('repeatingItemPath', () => {
+  it('uses stable storage identity when available', () => {
+    expect(repeatingItemPath('content', { _id: 'block-b' }, 1)).toBe('content[id=block-b]')
+  })
+
+  it('falls back to position for id-less or path-unsafe identities', () => {
+    expect(repeatingItemPath('content', {}, 1)).toBe('content[1]')
+    expect(repeatingItemPath('content', { _id: 'unsafe.id' }, 1)).toBe('content[1]')
+    expect(repeatingItemPath('content', { _id: null }, 1)).toBe('content[1]')
+    expect(repeatingItemId({ _id: 42 })).toBeUndefined()
+  })
+})
+
+describe('moveRepeatingItems', () => {
+  const ids = (items: { _id: string }[]) => items.map((item) => item._id)
+
+  it('keeps consecutive moves aligned with the current form-store order', () => {
+    const first = moveRepeatingItems([{ _id: 'a' }, { _id: 'b' }, { _id: 'c' }], 2, 0)
+    expect(first?.itemId).toBe('c')
+    expect(ids(first?.items ?? [])).toEqual(['c', 'a', 'b'])
+
+    const second = moveRepeatingItems(first?.items ?? [], 2, 1)
+    expect(second?.itemId).toBe('b')
+    expect(ids(second?.items ?? [])).toEqual(['c', 'b', 'a'])
+  })
+
+  it('retains the positional patch fallback for id-less items', () => {
+    const moved = moveRepeatingItems([{ value: 'a' }, { value: 'b' }], 1, 0)
+    expect(moved?.itemId).toBe('1')
+    expect(moved?.items.map((item) => item.value)).toEqual(['b', 'a'])
+  })
+})