The update button should stay enabled when we have metaboxes

WordPress · Mar 6, 2018 · e24b917 · e24b917
1 parent d23c6d9
commit e24b917
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 12 deletions.
diff --git a/edit-post/components/header/index.js b/edit-post/components/header/index.js
@@ -61,6 +61,8 @@ function Header( {
 					<PostPublishPanelToggle
 						isOpen={ isPublishSidebarOpen }
 						onToggle={ onTogglePublishSidebar }
+						forceIsDirty={ hasActiveMetaboxes }
+						forceIsSaving={ isSaving }
 					/>
 					<IconButton
 						icon="admin-generic"

diff --git a/edit-post/components/layout/index.js b/edit-post/components/layout/index.js
@@ -37,6 +37,8 @@ import {
 	isPublishSidebarOpened,
 	getActivePlugin,
 	getMetaBoxes,
+	hasMetaBoxes,
+	isSavingMetaBoxes,
 } from '../../store/selectors';
 import { closePublishSidebar } from '../../store/actions';
 import PluginsPanel from '../../components/plugins-panel/index.js';
@@ -62,6 +64,8 @@ function Layout( {
 	onClosePublishSidebar,
 	plugin,
 	metaBoxes,
+	hasActiveMetaboxes,
+	isSaving,
 } ) {
 	const isSidebarOpened = layoutHasOpenSidebar &&
 		( openedGeneralSidebar !== 'plugin' || getSidebarSettings( plugin ) );
@@ -95,7 +99,13 @@ function Layout( {
 					<MetaBoxes location="advanced" />
 				</div>
 			</div>
-			{ publishSidebarOpen && <PostPublishPanel onClose={ onClosePublishSidebar } /> }
+			{ publishSidebarOpen && (
+				<PostPublishPanel
+					onClose={ onClosePublishSidebar }
+					forceIsDirty={ hasActiveMetaboxes }
+					forceIsSaving={ isSaving }
+				/>
+			) }
 			{
 				openedGeneralSidebar !== null && <GeneralSidebar
 					openedGeneralSidebar={ openedGeneralSidebar } />
@@ -114,6 +124,8 @@ export default connect(
 		hasFixedToolbar: isFeatureActive( state, 'fixedToolbar' ),
 		plugin: getActivePlugin( state ),
 		metaBoxes: getMetaBoxes( state ),
+		hasActiveMetaboxes: hasMetaBoxes( state ),
+		isSaving: isSavingMetaBoxes( state ),
 	} ),
 	{
 		onClosePublishSidebar: closePublishSidebar,

diff --git a/editor/components/post-publish-button/index.js b/editor/components/post-publish-button/index.js
@@ -36,6 +36,7 @@ export function PostPublishButton( {
 	isSaveable,
 	user,
 	onSubmit = noop,
+	forceIsSaving,
 } ) {
 	const isButtonEnabled = user.data && ! isSaving && isPublishable && isSaveable;
 	const isContributor = ! get( user.data, [ 'post_type_capabilities', 'publish_posts' ], false );
@@ -69,18 +70,18 @@ export function PostPublishButton( {
 			disabled={ ! isButtonEnabled }
 			className={ className }
 		>
-			<PublishButtonLabel />
+			<PublishButtonLabel forceIsSaving={ forceIsSaving } />
 		</Button>
 	);
 }
 
 const applyConnect = connect(
-	( state ) => ( {
-		isSaving: isSavingPost( state ),
+	( state, { forceIsSaving, forceIsDirty } ) => ( {
+		isSaving: forceIsSaving || isSavingPost( state ),
 		isBeingScheduled: isEditedPostBeingScheduled( state ),
 		visibility: getEditedPostVisibility( state ),
 		isSaveable: isEditedPostSaveable( state ),
-		isPublishable: isEditedPostPublishable( state ),
+		isPublishable: forceIsDirty || isEditedPostPublishable( state ),
 		postType: getCurrentPostType( state ),
 	} ),
 	{

diff --git a/editor/components/post-publish-button/label.js b/editor/components/post-publish-button/label.js
@@ -51,10 +51,10 @@ export function PublishButtonLabel( {
 }
 
 const applyConnect = connect(
-	( state ) => ( {
+	( state, { forceIsSaving } ) => ( {
 		isPublished: isCurrentPostPublished( state ),
 		isBeingScheduled: isEditedPostBeingScheduled( state ),
-		isSaving: isSavingPost( state ),
+		isSaving: forceIsSaving || isSavingPost( state ),
 		isPublishing: isPublishingPost( state ),
 		postType: getCurrentPostType( state ),
 	} )

diff --git a/editor/components/post-publish-panel/index.js b/editor/components/post-publish-panel/index.js
@@ -61,7 +61,7 @@ class PostPublishPanel extends Component {
 	}
 
 	render() {
-		const { onClose, user } = this.props;
+		const { onClose, user, forceIsDirty, forceIsSaving } = this.props;
 		const { loading, published } = this.state;
 		const canPublish = get( user.data, [ 'post_type_capabilities', 'publish_posts' ], false );
 
@@ -70,7 +70,7 @@ class PostPublishPanel extends Component {
 				<div className="editor-post-publish-panel__header">
 					{ ! published && (
 						<div className="editor-post-publish-panel__header-publish-button">
-							<PostPublishButton onSubmit={ this.onPublish } />
+							<PostPublishButton onSubmit={ this.onPublish } forceIsDirty={ forceIsDirty } forceIsSaving={ forceIsSaving } />
 						</div>
 					) }
 					{ published && (

diff --git a/editor/components/post-publish-panel/toggle.js b/editor/components/post-publish-panel/toggle.js
@@ -24,17 +24,28 @@ import {
 	getCurrentPostType,
 } from '../../store/selectors';
 
-function PostPublishPanelToggle( { user, isSaving, isPublishable, isSaveable, isPublished, isBeingScheduled, onToggle, isOpen } ) {
+function PostPublishPanelToggle( {
+	user,
+	isSaving,
+	isPublishable,
+	isSaveable,
+	isPublished,
+	isBeingScheduled,
+	onToggle,
+	isOpen,
+	forceIsDirty,
+	forceIsSaving,
+} ) {
 	const isButtonEnabled = (
-		! isSaving && isPublishable && isSaveable
+		! isSaving && ! forceIsSaving && isPublishable && isSaveable
 	) || isPublished;
 
 	const userCanPublishPosts = get( user.data, [ 'post_type_capabilities', 'publish_posts' ], false );
 	const isContributor = user.data && ! userCanPublishPosts;
 	const showToggle = ! isContributor && ! isPublished && ! isBeingScheduled;
 
 	if ( ! showToggle ) {
-		return <PostPublishButton />;
+		return <PostPublishButton forceIsDirty={ forceIsDirty } forceIsSaving={ forceIsSaving } />;
 	}
 
 	return (