Publish: The Pre-publish dot, edit and save overview

[paaljoachim]

I will be looking through various save methods that we use today. With focus on the pre-publish dot and the saving process of each.
Post Editor, Reusable blocks, Page templates and Site Editor.

WordPress 5.7.2
Using Gutenberg plugin 10.9RC
Twenty Twenty One and TT1
A local test site

Post Editor

Creating a post. Adding some content.
No dot seen. User can click to Save draft or click to Publish the post.

1- Clicking Publish. (Opens pre-publish panel)
2- Clicking Publish again. Publishes the post.
3- Shows a a kind of after publish panel.

---

Reusable blocks

In a post or page. Editing inside a Reusable block a pre-publish dot is seen.

1- Clicking inside a Reusable block.
2- Edit the inner blocks.
3- Dot seen in the Publish button.

4- Clicking the Publish button shows a Save panel.
"Select the changes you want to save"

Unclicking to Save the Reusable block - greys out the Save button. One needs to click the X to cancel out of the panel.
---> Needs an option to move onward.

5- Dot is still seen in the Publish button.

Edit-Save-Reusable-block.mp4

NB! If a page/post has been published a dot will be seen in front of the word "Update..."

---

Page template

Creating a draft page -> Then creating a page template.
Editing in the page template a dot is seen.

1- Clicking the Publish button leads to a Save panel.
"Select the changes you want to save"
User can select which to save and which areas to discard.

2- Discarding will still leave the Pre-publish dot in place.
3- Clicking Publish does not work.

Edit-save-Page-Templates.mp4

---

Site Editor

Opening the Site Editor. Then editing content does not show a pre-publish dot and panel but shows a Save button. Showing the Save button twice.

1- Edit various content.
2- Click The Save button.
3- Opens another Save panel. Showing various areas one can select to Save.

By default the Save button is seen.
Clicking the Save button leads to another Save panel.

4- Unclicking one or multiple areas.
Then clicking Save leads one back to the main Save panel.
No dot to create any distraction.

Save-Panel-FSE.mp4

If one unclicks all options the Save button will be greyed out.

[paaljoachim]

Post or Page editing content. No dot is seen.
Reusable block editing inner content. Dot is seen.
Page Template editing. Dot is seen.
Full Site Editing. Does not use a Publish panel. Uses Save button twice.

---

We need to create a consistency between the various save methods.

Suggestion on next steps.

De-selecting (Unclicking all options in the Save panel) the Save button should change to a Discard button.

Added the following comment
#31456 (comment) to
Improving multi-entity saving UI method issue.

It would help with this case:
1- Go to a draft page and make some changes.
2- Add a Reusable block. Adjust the Reusable block.
3- Click Publish.
4- Uncheck the Reusable block (let's say that one made an accidental change and do not want to save the change). The Page is still checked.
5- Click Save.
6- Notice the dot is seen. Clicking Publish does not work. One has to cancel.
7- Click Publish again. Uncheck Reusable block. Notice the greyed out Save button.

Reusable-block-save.mp4

---

Must save change to reusable block to be able to publish page. (Same goes for the Page template.)
#29269

---

Add Reusable block save button, snackbar on save and Welcome Guide
#32464

---

There are also various other save flow fixes that should be tackled so that we have a better consistency across various types of screens.

[paaljoachim]

Adding in this direct message comment between Channing @critterverse and myself.

"I was still leaning towards this implementation for adding the Discard functionality into the multi-entity saving flow — not sure how close we are to having a PR for that but feels like it would work really well in combination with the Save button in the toolbar: #31456 (comment) "

@javierarce made a really good video showing a sturdy method to Select, Save, Discard or to Reset to initial state.
Here is a screenshot from the video in the comment I linked to above.

[skorasaurus]

related #27474 ?

[paaljoachim]

Here is another multi-entity saving issue discovered by @omarreiss Omar. He has also added a video showing the confusion around saving the post after having added the Site Title block. #33223