fix(admin): mark form modified when adding/removing product images

Calling dispatchFields({ type: 'ADD_ROW' }) directly bypasses
setModified(true), so the form never registered uploads as changes —
no autosave, no publish. Switch to addFieldRow/removeFieldRow helpers
from useForm, which dispatch and mark modified in one step.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

nextjs/src/components/admin/ImageUploadSlot.tsx

@@ -20,7 +20,7 @@ function extractMediaId(value: unknown): string | number | null {
 
 export function ImageUploadSlot({ displayName }: Props) {
   const { rows } = useField<unknown>({ path: 'images', hasRows: true })
-  const { dispatchFields, getDataByPath } = useForm()
+  const { addFieldRow, removeFieldRow, getDataByPath } = useForm()
   const fileInput = useRef<HTMLInputElement | null>(null)
   const [uploading, setUploading] = useState(false)
   const [error, setError] = useState<string | null>(null)
@@ -78,8 +78,7 @@ export function ImageUploadSlot({ displayName }: Props) {
 
   const appendRow = useCallback(
     (mediaId: number | string) => {
-      dispatchFields({
-        type: 'ADD_ROW',
+      addFieldRow({
         path: 'images',
         rowIndex: rowCount,
         subFieldState: {
@@ -87,18 +86,17 @@ export function ImageUploadSlot({ displayName }: Props) {
         },
       })
     },
-    [dispatchFields, rowCount],
+    [addFieldRow, rowCount],
   )
 
   const removeRow = useCallback(
     (rowIndex: number) => {
-      dispatchFields({
-        type: 'REMOVE_ROW',
+      removeFieldRow({
         path: 'images',
         rowIndex,
       })
     },
-    [dispatchFields],
+    [removeFieldRow],
   )
 
   const onFile = async (e: React.ChangeEvent<HTMLInputElement>) => {