fix(admin): mark form modified when adding/removing product images
Some checks failed
Build & Deploy to K3s / build-and-deploy (push) Failing after 52s
Some checks failed
Build & Deploy to K3s / build-and-deploy (push) Failing after 52s
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>
This commit is contained in:
parent
d44bad4c68
commit
aa87b6da8a
@ -20,7 +20,7 @@ function extractMediaId(value: unknown): string | number | null {
|
|||||||
|
|
||||||
export function ImageUploadSlot({ displayName }: Props) {
|
export function ImageUploadSlot({ displayName }: Props) {
|
||||||
const { rows } = useField<unknown>({ path: 'images', hasRows: true })
|
const { rows } = useField<unknown>({ path: 'images', hasRows: true })
|
||||||
const { dispatchFields, getDataByPath } = useForm()
|
const { addFieldRow, removeFieldRow, getDataByPath } = useForm()
|
||||||
const fileInput = useRef<HTMLInputElement | null>(null)
|
const fileInput = useRef<HTMLInputElement | null>(null)
|
||||||
const [uploading, setUploading] = useState(false)
|
const [uploading, setUploading] = useState(false)
|
||||||
const [error, setError] = useState<string | null>(null)
|
const [error, setError] = useState<string | null>(null)
|
||||||
@ -78,8 +78,7 @@ export function ImageUploadSlot({ displayName }: Props) {
|
|||||||
|
|
||||||
const appendRow = useCallback(
|
const appendRow = useCallback(
|
||||||
(mediaId: number | string) => {
|
(mediaId: number | string) => {
|
||||||
dispatchFields({
|
addFieldRow({
|
||||||
type: 'ADD_ROW',
|
|
||||||
path: 'images',
|
path: 'images',
|
||||||
rowIndex: rowCount,
|
rowIndex: rowCount,
|
||||||
subFieldState: {
|
subFieldState: {
|
||||||
@ -87,18 +86,17 @@ export function ImageUploadSlot({ displayName }: Props) {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[dispatchFields, rowCount],
|
[addFieldRow, rowCount],
|
||||||
)
|
)
|
||||||
|
|
||||||
const removeRow = useCallback(
|
const removeRow = useCallback(
|
||||||
(rowIndex: number) => {
|
(rowIndex: number) => {
|
||||||
dispatchFields({
|
removeFieldRow({
|
||||||
type: 'REMOVE_ROW',
|
|
||||||
path: 'images',
|
path: 'images',
|
||||||
rowIndex,
|
rowIndex,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[dispatchFields],
|
[removeFieldRow],
|
||||||
)
|
)
|
||||||
|
|
||||||
const onFile = async (e: React.ChangeEvent<HTMLInputElement>) => {
|
const onFile = async (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user