I have a requirement to add up to 8 user selected custom colors to the list of default options when using the Colour Palette.
I have registered a meta that saves custom colours.
Problem:
I want to save custom colours when the "Update" post button is pressed instead of using the onChange
listener, because the listener fires multiple times when the colour selector tool is dragged.
What I am doing at the moment:
const { isSavingPost } = useSelect( select => {
const { isSavingPost } = select( 'core/editor' );
return {
isSavingPost: isSavingPost(),
}
} );
useEffect( () => {
if ( isSavingPost ) {
// Logic to save custom colours.
setAttributes( { customColors } );
}
}, [ isSavingPost ] );
The problem is that when setAttribute()
is called when "Update" is pressed, the state is updated after the post is saved, which Gutenberg considers dirty and a page reload following an "Update" shows this:
I am however able to save it if I press "Update" post twice, but this is not feasible for the end user.
Is there a way I can fire wp.data.dispatch( 'core/editor' ).editPost()
or setAttributes()
when a Post is saved manually by pressing the "Update" button?