Fix: Publishing UX for contributors (#6729)

* Fix publishing UX for contributors

* Merge #6724 into PR

* Removed compose from prepublish.js, improved the conditions checking publish action

* Avoid ternaries from toggle label

* Introduce unit tests to post publish panel toggle

* Add explicit tests for button text

* Restore publish toggle label, update publish panel copy for contributors

* Update unit tests according to changed toggle label

* Fix a unit test description

editor/components/post-publish-panel/prepublish.js

@@ -1,8 +1,15 @@
+/**
+ * External dependencies
+ */
+import { get } from 'lodash';
+
 /**
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { Fragment } from '@wordpress/element';
 import { PanelBody } from '@wordpress/components';
+import { withSelect } from '@wordpress/data';
 
 /**
  * Internal Dependencies
@@ -12,26 +19,40 @@ import PostVisibilityLabel from '../post-visibility/label';
 import PostSchedule from '../post-schedule';
 import PostScheduleLabel from '../post-schedule/label';
 
-function PostPublishPanelPrepublish( { children } ) {
+function PostPublishPanelPrepublish( {
+	hasPublishAction,
+	children,
+} ) {
 	return (
 		<div className="editor-post-publish-panel__prepublish">
-			<div><strong>{ __( 'Are you ready to publish?' ) }</strong></div>
-			<p>{ __( 'Here, you can do a last-minute check up of your settings below, before you publish.' ) }</p>
-			<PanelBody initialOpen={ false } title={ [
-				__( 'Visibility: ' ),
-				<span className="editor-post-publish-panel__link" key="label"><PostVisibilityLabel /></span>,
-			] }>
-				<PostVisibility />
-			</PanelBody>
-			<PanelBody initialOpen={ false } title={ [
-				__( 'Publish: ' ),
-				<span className="editor-post-publish-panel__link" key="label"><PostScheduleLabel /></span>,
-			] }>
-				<PostSchedule />
-			</PanelBody>
-			{ children }
+			<div><strong>{ hasPublishAction ? __( 'Are you ready to publish?' ) : __( 'Are you ready to submit for review?' ) }</strong></div>
+			<p>{ hasPublishAction ? __( 'Here, you can do a last-minute check up of your settings below, before you publish.' ) : __( 'When you\'re ready, submit your work for review, and an Editor will be able to approve it for you.' ) }</p>
+			{ hasPublishAction && (
+				<Fragment>
+					<PanelBody initialOpen={ false } title={ [
+						__( 'Visibility: ' ),
+						<span className="editor-post-publish-panel__link" key="label"><PostVisibilityLabel /></span>,
+					] }>
+						<PostVisibility />
+					</PanelBody>
+					<PanelBody initialOpen={ false } title={ [
+						__( 'Publish: ' ),
+						<span className="editor-post-publish-panel__link" key="label"><PostScheduleLabel /></span>,
+					] }>
+						<PostSchedule />
+					</PanelBody>
+					{ children }
+				</Fragment>
+			) }
 		</div>
 	);
 }
 
-export default PostPublishPanelPrepublish;
+export default withSelect(
+	( select ) => {
+		const { getCurrentPost } = select( 'core/editor' );
+		return {
+			hasPublishAction: get( getCurrentPost(), [ '_links', 'wp:action-publish' ], false ),
+		};
+	}
+)( PostPublishPanelPrepublish );

editor/components/post-publish-panel/test/toggle.js

@@ -0,0 +1,75 @@
+/**
+ * External dependencies
+ */
+import { shallow } from 'enzyme';
+
+/**
+ * Internal dependencies
+ */
+import { PostPublishPanelToggle } from '../toggle';
+
+describe( 'PostPublishPanelToggle', () => {
+	describe( 'disabled', () => {
+		it( 'should be disabled if post is currently saving', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isSaving />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( true );
+		} );
+
+		it( 'should be disabled if post is currently force saving', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle forceIsSaving />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( true );
+		} );
+
+		it( 'should be disabled if post is not publishable', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isPublishable={ false } />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( true );
+		} );
+
+		it( 'should be disabled if post is not saveable', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isSaveable={ false } />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( true );
+		} );
+
+		it( 'should be disabled if post is not published', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isPublished={ false } />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( true );
+		} );
+
+		it( 'should be enabled otherwise', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isPublishable isSaveable />
+			);
+
+			expect( wrapper.prop( 'disabled' ) ).toBe( false );
+		} );
+
+		it( 'should display Schedule… if able to be scheduled', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isPublishable isSaveable isBeingScheduled />
+			);
+			expect( wrapper.childAt( 0 ).text() ).toBe( 'Schedule…' );
+		} );
+
+		it( 'should display Publish… if able to be published', () => {
+			const wrapper = shallow(
+				<PostPublishPanelToggle isPublishable isSaveable hasPublishAction />
+			);
+			expect( wrapper.childAt( 0 ).text() ).toBe( 'Publish…' );
+		} );
+	} );
+} );

editor/components/post-publish-panel/toggle.js

@@ -17,7 +17,7 @@ import { DotTip } from '@wordpress/nux';
  */
 import PostPublishButton from '../post-publish-button';
 
-function PostPublishPanelToggle( {
+export function PostPublishPanelToggle( {
 	hasPublishAction,
 	isSaving,
 	isPublishable,