Skip to content

Commit 505273f

Browse files
committed
Use clearEntityRecordEdits to ensure a clean state when cancelling a crop, or when saving a crop
1 parent 40ad7ab commit 505273f

1 file changed

Lines changed: 13 additions & 50 deletions

File tree

  • packages/media-editor/src/components/media-editor-modal

‎packages/media-editor/src/components/media-editor-modal/index.tsx‎

Lines changed: 13 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,7 @@ import {
1212
import { Stack } from '@wordpress/ui';
1313
import { useDispatch, useRegistry, useSelect } from '@wordpress/data';
1414
import { store as coreStore } from '@wordpress/core-data';
15-
import {
16-
useContext,
17-
useEffect,
18-
useMemo,
19-
useRef,
20-
useState,
21-
} from '@wordpress/element';
15+
import { useContext, useEffect, useMemo, useState } from '@wordpress/element';
2216
import { __ } from '@wordpress/i18n';
2317
import { drawerRight } from '@wordpress/icons';
2418
import type { Field } from '@wordpress/dataviews';
@@ -214,33 +208,16 @@ export function MediaEditorModal( { fields = [] }: MediaEditorModalProps ) {
214208
);
215209

216210
const registry = useRegistry();
217-
const { editEntityRecord, receiveEntityRecords, saveEditedEntityRecord } =
218-
useDispatch( coreStore );
211+
const {
212+
clearEntityRecordEdits,
213+
editEntityRecord,
214+
receiveEntityRecords,
215+
saveEditedEntityRecord,
216+
} = useDispatch( coreStore );
219217
const { closeMediaEditorModal } = useDispatch( mediaEditorStore );
220218

221219
const [ isSaving, setIsSaving ] = useState( false );
222220

223-
// Snapshot the original values for fields the modal edits, so Cancel can
224-
// restore them. Captured once per open.
225-
const originalFieldValuesRef = useRef< Record< string, unknown > | null >(
226-
null
227-
);
228-
useEffect( () => {
229-
if ( ! isModalOpen ) {
230-
originalFieldValuesRef.current = null;
231-
return;
232-
}
233-
if ( ! originalFieldValuesRef.current && media ) {
234-
const snapshot: Record< string, unknown > = {};
235-
fields.forEach( ( field ) => {
236-
snapshot[ field.id ] = ( media as Record< string, unknown > )[
237-
field.id
238-
];
239-
} );
240-
originalFieldValuesRef.current = snapshot;
241-
}
242-
}, [ isModalOpen, media, fields ] );
243-
244221
const [ aspectRatioValue, setAspectRatioValue ] = useState( '0' );
245222
const [ freeformCrop, setFreeformCrop ] = useState( true );
246223

@@ -319,14 +296,7 @@ export function MediaEditorModal( { fields = [] }: MediaEditorModalProps ) {
319296
};
320297

321298
const handleCancel = () => {
322-
if ( originalFieldValuesRef.current ) {
323-
editEntityRecord(
324-
'postType',
325-
'attachment',
326-
id,
327-
originalFieldValuesRef.current
328-
);
329-
}
299+
clearEntityRecordEdits( 'postType', 'attachment', id );
330300
closeMediaEditorModal();
331301
};
332302

@@ -396,18 +366,11 @@ export function MediaEditorModal( { fields = [] }: MediaEditorModalProps ) {
396366

397367
const next = ( saved ?? media ) as Media | null;
398368

399-
// A transformed save creates a new attachment; the Details
400-
// edits now live on the new record (sent in the /edit
401-
// payload). Reset the old record's staged edits back to its
402-
// original values so it doesn't appear dirty in the Media
403-
// Library afterwards.
404-
if ( next && next.id !== id && originalFieldValuesRef.current ) {
405-
editEntityRecord(
406-
'postType',
407-
'attachment',
408-
id,
409-
originalFieldValuesRef.current
410-
);
369+
// A transformed save creates a new attachment; clear staged
370+
// edits on the old record so it doesn't appear dirty in the
371+
// Media Library afterwards.
372+
if ( next && next.id !== id ) {
373+
clearEntityRecordEdits( 'postType', 'attachment', id );
411374
}
412375

413376
if ( next && next.id && onUpdate ) {

0 commit comments

Comments
 (0)