Fix: Publishing UX for contributors #6729

nfmohit · 2018-05-13T19:10:37Z

Description

This PR addresses #6725 which reports the incorrect post publishing UX for contributors who doesn't have publishing capability.

How has this been tested?

This PR was tested by verifying the following:

Ensuring that the contributor only ever sees a "Submit for Review" button.
The "Are you ready to publish?" copy is updated to reflect the submitting for review workflow.
The invalid visibility and scheduling UI is removed.

This was tested in WP 4.9.5, Gutenberg 2.8.0, Apache server with PHP 7.2.0 and MySQL 5.6.34. According to initial tests, the code doesn’t seem to affect any other areas.

Screenshots

As an administrator:

As a contributor:

Types of changes

For the toggle button, this just enforces a condition to check if the user is a contributor or not with the isContributor constant variable and then display the correct label. For the visibility and scheduling UI along with the copy above it, they have been changed/removed depending on the user being a contributor or not using the same isContributor constant variable.

Note

This PR will be amended later to use wp:action-publish and hasPublishAction as soon as the related #6724 gets merged.

Checklist:

My code is tested.
My code follows the WordPress code style.
My code follows the accessibility standards.
My code has proper inline documentation.

danielbachhuber · 2018-05-14T11:41:49Z

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

+function PostPublishPanelPrepublish( {
+	user,
+} ) {
+	const userCanPublishPosts = get( user.data, [ 'post_type_capabilities', 'publish_posts' ], false );


Can you incorporate #6724 into this pull request?

Incorporated #6724 into this PR in this commit.

Thank you so much again for reviewing this @danielbachhuber.

danielbachhuber · 2018-05-14T11:44:33Z

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

@@ -42,6 +42,21 @@ function PostPublishPanelToggle( {
 		return <PostPublishButton forceIsDirty={ forceIsDirty } forceIsSaving={ forceIsSaving } />;
 	}

+	if ( isContributor ) {


Now that we have some conditional logic in this file, would it be worthwhile to add a couple of unit tests?

Check out post-publish-button for the pattern to follow.

Absolutely! I believe so.

I'm still working on it, taking some time as I never added unit tests previously. Looking into the pattern of post-publish-button for reference.

Thank you @danielbachhuber.

Hey @danielbachhuber!

The conditional logics have been changed in this file as per this commit according to this recommendation. Do you think this still needs unit tests?

If it does, could you advice a bit regarding how I could approach to achieve that with an example if possible in the updated conditional logics? I have been checking out other components along with post-publish-button and also this documentation. Still, this is me first time adding unit tests so having a bit hiccups 😅.

Thank you so much ❤

Do you think this still needs unit tests?

Yes, I think it would be ideal to have tests.

If it does, could you advice a bit regarding how I could approach to achieve that with an example if possible in the updated conditional logics?

I'm about to be offline for a bit so not immediately. Want to try a first pass by copy and pasting out of post-publish-button, and then I'll follow up later on to make any necessary changes? Feel free to stop by #core-editor if you need help; I'm sure there's someone around that can help get you started.

Thank you @danielbachhuber !

Just pushed a new commit with the unit tests. I'm quite sure it's all wrong, looking forward to getting your help in it if possible. Thank you so much.

Looks great! I added a few more tests in 625fcd9

Awesome one 😍, thank you so much! ❤

danielbachhuber · 2018-05-14T11:45:39Z

Thanks for the PR, @nfmohit! Couple of points to address.

nfmohit · 2018-05-15T06:46:37Z

Thank you for reviewing @danielbachhuber <3 Working on the changes.

youknowriad · 2018-05-16T09:10:20Z

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

@@ -33,4 +51,13 @@ function PostPublishPanelPrepublish() {
 	);
 }

-export default PostPublishPanelPrepublish;
+export default compose( [


There's only a single HoC used here, we can safely remove compose

youknowriad · 2018-05-16T09:13:05Z

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

+				<p>{ __( 'Here, you can do a last-minute check up of your settings below, before you submit for review.' ) }</p>
+			</div>
+		);
+	}


It feels that a lot of things are shared with the code bellow. Maybe we can just do something like:

{ hasPublishAction ? __( 'Are you ready to publish?' ) : __( 'Are you ready to submit for review?' ) }

And wrap the panels inside a

{ hasPublishAction && ( <Fragment> // panels go here </Fragment> ) }

youknowriad · 2018-05-16T09:15:34Z

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

+				disabled={ ! isButtonEnabled }
+				isBusy={ isSaving && isPublished }
+			>
+				{ isBeingScheduled ? __( 'Schedule…' ) : __( 'Submit for Review…' ) }


Same here, it looks like the only difference is the label, so the check should be done inside the button.

Also, I remember that it was an intended change to show "Publish" even for contributors. The idea is to keep the button small and wen you open the panel, you'll see the right message. cc @jasmussen

Correct. The context is largely in #5343, but the idea is that submitting for review is definitely part of the publishing flow.

Scheduling is also part of the publishing flow, but it could be argued that if you've already chosen a different scheduling time in the Settings sidebar before starting the publishing flow, it should say "Schedule..."

However this is a sensitive change that needs to be properly tested on a 4 inch iphone with longer languages, such as German.

youknowriad

Code wise, this looks good to me, just waiting for a confirmation from the design side of things cc #6729 (comment)

youknowriad · 2018-05-16T10:52:31Z

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

+			) }
+			{ hasPublishAction && (
+				isBeingScheduled ? __( 'Schedule…' ) : __( 'Publish…' )
+			) }


Minor: Do you think if would be clearer if we avoid ternaries here:

{ isBeingScheduled && __( 'Schedule…' ) } { ! isBeingScheduled && hasPublishAction && __( 'Publish…' ) } { ! isBeingScheduled && ! hasPublishAction && __( 'Submit for Review…' ) }

Thank you so much for reviewing this @youknowriad!

This looks way clearer to me. Test in progress and another change incoming...

Done here.

I had initially tried to nest ternaries but Travis didn't like it. But this looks way nicer. Thank you for the recommendation @youknowriad.

…publish action

danielbachhuber · 2018-05-18T20:53:09Z

Code is looking fine now. For Needs Design Feedback, we'll need to sort out this:

I'm thinking that maybe we shouldn't display the pre-publish panel for contributors, unless someone has a good idea for what should go in it.

nfmohit · 2018-05-19T01:32:49Z

Thank you @danielbachhuber

I'm thinking that maybe we shouldn't display the pre-publish panel for contributors

I can work on this if everyone prefers, but as per the comments here and here, @youknowriad and @jasmussen recommends that we make the publish toggle button say "Publish..." for contributors as well. In that case, wouldn't the pre-publish-panel be required for contributors?

tofumatt · 2018-05-28T15:35:41Z

Looks like @karmatosed agrees (she left a 👍 reaction to your question) but I don't think GitHub sends notifications about reactions so it might have been unclear.

Sounds like the pre-publish-panel is required for contributors and we should be displaying it.

To @danielbachhuber's question, what should we put in the panel? (cc @karmatosed)

jasmussen · 2018-05-30T07:40:31Z

I'm thinking that maybe we shouldn't display the pre-publish panel for contributors, unless someone has a good idea for what should go in it.

I think we should keep it, but that we should rephrase the text, and consider the contributor role for the pre-publish plugin API.

I understand your concern — if there's nothing for a contributor to change there, why have a publish screen at all?

Perhaps the most important aspect of blogging is that there is friction, just the right amount, to publishing. The "Publish" button is a last moment to reflect on what you wrote, and a celebratory moment when pressed. It is also a better interface than an "Are you sure?" confirm.

I can work on this if everyone prefers, but as per the comments here and here, @youknowriad and @jasmussen recommends that we make the publish toggle button say "Publish..." for contributors as well. In that case, wouldn't the pre-publish-panel be required for contributors?

Yes. Even as a contributor, you are doing a publishing action by submitting for review. You are publishing to your editor to approve.

The other problem this solves, is ensuring that there is space for the button on a mobile device, where "Submit for Review..." would not fit on an iPhone 5 with the other minimal UI in the toolbar, and in other languages it would be worse.

So, I think this is almost ready to ship. Let's change the "Submit for Review..." to "Publish...", and inside the confirm panel, let's rephrase the text. It could for example read:

Are you ready to submit for review?
When you're ready, submit your work for review, and an Editor will be able to approve it for you.

That's bad, but I tagged "Needs Copy Review" in case someone has a better idea.

I can also imagine a separate pre-submit-for-review API that could show plugin slot fills in the area below. I imagine an SEO score would be nice to know before you submit for review.

michelleweber · 2018-05-30T11:08:15Z

I feel like there is the potential for confusion when "publish" language is used, because publish usually means that something is going live, so I'd like to try and help that with the language that displays in the panel -- maybe something like:

Ready to submit this for publication?
Double-check your settings, make any final changes, and click "publish" to submit your post -- an editor will review, approve, and publish it.

nfmohit · 2018-05-30T17:46:48Z

Thank you for your valuable feedback over this @tofumatt and @jasmussen <3

In the last commit, I've restored the toggle button label from "Submit for Review…" to "Publish…" for contributors.

Thank you for your copy suggestion @michelleweber !

I've still went with @jasmussen's suggested copy for this commit for now, unless we have a more appropriate copy and confirmations over that.

@michelleweber's copy sounded good, but one thing to note here is, the contributors will be finally clicking the "Submit for Review" button in the post pre-publish panel as the post publish button still has the label of "Submit for Review" for contributors.

Thanks guys <3

nfmohit · 2018-05-30T17:59:08Z

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

+			expect( wrapper.childAt( 0 ).text() ).toBe( 'Schedule…' );
+		} );
+
+		it( 'should display Schedule… if able to be published', () => {


@danielbachhuber Just asking, I'm not sure to be honest, shouldn't it be should display Publish… if able to be published instead of should display Schedule… if able to be published?

Let me know if it's not correct and if I should fix it.

Hm. I think this should be:

should display Publish… if able to be published

I assumed so, let me fix it. Thank you for looking <3

Just did in this commit.

danielbachhuber · 2018-06-19T23:56:17Z

@jasmussen Any remaining changes needed for this or can it be merged?

danielbachhuber · 2018-06-19T23:58:50Z

Actually, I see @jasmussen gave a 👍 to @nfmohit-wpmudev's most recent comment.

@nfmohit-wpmudev Thanks again for your work on this!

danielbachhuber · 2018-06-20T00:03:53Z

GIF looks like this:

jasmussen · 2018-06-20T03:49:05Z

All good and thank you!

nfmohit · 2018-06-20T04:02:09Z

Thank you guys! <3

christincooper · 2019-06-19T09:27:36Z

The pre-publish-panel should be visible to contributors, as discussed by users in this thread. Why was it removed for contributors? Users on this level need the tips the most, as they are submitting a post for review, meaning, essentially they are least familiar with the publishing guidelines of the site.

Please check this recent thread discussing this: #16198

Is there any way to enable the pre-publish-panel for contributors? @danielbachhuber @nfmohit-wpmudev @jasmussen

gziolo requested a review from danielbachhuber May 14, 2018 08:56

gziolo added REST API Interaction Related to REST API [Feature] Writing Flow Block selection, navigation, splitting, merging, deletion... [Type] Bug An existing feature does not function as intended labels May 14, 2018

gziolo added this to the 2.9 milestone May 14, 2018

danielbachhuber requested changes May 14, 2018

View reviewed changes

youknowriad reviewed May 16, 2018

View reviewed changes

youknowriad modified the milestones: 2.9, 3.0 May 16, 2018

youknowriad reviewed May 16, 2018

View reviewed changes

youknowriad added the Needs Design Feedback Needs general design feedback. label May 16, 2018

nfmohit and others added 6 commits May 17, 2018 19:30

Fix publishing UX for contributors

0a0426d

Merge #6724 into PR

d4440c1

Removed compose from prepublish.js, improved the conditions checking …

a6b223e

…publish action

Avoid ternaries from toggle label

02e0b33

Introduce unit tests to post publish panel toggle

414897c

Add explicit tests for button text

625fcd9

danielbachhuber approved these changes May 18, 2018

View reviewed changes

Merge branch 'master' into update/component-post-publish-panel/6725

e278b12

youknowriad modified the milestones: 3.0, 3.1 May 29, 2018

jasmussen added the Needs Copy Review Needs review of user-facing copy (language, phrasing) label May 30, 2018

nfmohit added 2 commits May 30, 2018 23:48

Restore publish toggle label, update publish panel copy for contributors

cf0c97b

Update unit tests according to changed toggle label

d912dff

nfmohit commented May 30, 2018

View reviewed changes

Fix a unit test description

a872f05

danielbachhuber merged commit 6bf15a3 into WordPress:master Jun 19, 2018

danielbachhuber mentioned this pull request Jun 19, 2018

Incorrect publishing UX for Contributor without publishing capability #6725

Closed

3 tasks

This was referenced Jul 4, 2019

Bug: Pre-publish panels is not visible for contributors #16415

Closed

Pre-publishing panels for contributors #16198

Closed

Fix: Publishing UX for contributors #6729

Fix: Publishing UX for contributors #6729

Conversation

nfmohit commented May 13, 2018 • edited

Description

How has this been tested?

Screenshots

Types of changes

Note

Checklist:

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

danielbachhuber commented May 14, 2018

nfmohit commented May 15, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

youknowriad left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

danielbachhuber commented May 18, 2018

nfmohit commented May 19, 2018 • edited

tofumatt commented May 28, 2018

jasmussen commented May 30, 2018

michelleweber commented May 30, 2018

nfmohit commented May 30, 2018

nfmohit May 30, 2018 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

danielbachhuber commented Jun 19, 2018

danielbachhuber commented Jun 19, 2018

danielbachhuber commented Jun 20, 2018

jasmussen commented Jun 20, 2018

nfmohit commented Jun 20, 2018

christincooper commented Jun 19, 2019

nfmohit commented May 13, 2018 •

edited

nfmohit commented May 19, 2018 •

edited

nfmohit May 30, 2018 •

edited