Block manager: Display a 'Reset' button when blocks are hidden to quickly enable all

[kozer]

https://playground.wordpress.net/?gutenberg-pr=51200
Related to #50015

What?

It adds a "Reset" button in order to easily show all the hidden blocks in the Preferences section.

Why?

Right now, when there are many hidden blocks, the user must:

• Enable them again one by one
• Enable them in bulk by clicking on the category of each block

The first one is time-consuming, and the second one is a bit tricky, as it's not particularly obvious to the end user.

Adding a new button specific to that use case will make things easier for the end user.

Testing Instructions

1. Edit a page
2. Navigate to "Preferences" in the top right corner
3. Make sure that you uncheck some blocks, after visiting "Panels" menu in the sidebar.
4. Ensure that you see an "Reset" button.
5. Ensure that when you press it, all blocks are checked again.

Testing Instructions for Keyboard

Screenshots or screencast

[apeatling]

Adding the design review tag to this since I think this could be better as a link.

[danielbachhuber]

Works as expected 👍

[kozer]

@danielbachhuber Should I wait for design feedback? Is @javierarce the right person to ping here?
Also, it seems that React Native E2E Tests are failing. How I can re-run them? Navigating to the details of the failed job, doesn't give me any way to run it again.
Thanks!

[jameskoster]

Thanks for the ping @apeatling.

This little UI is a bit rough isn't it! Outside of a total redesign, I think my main suggestion here would be to change the button label to something a bit simpler. "Reset" might work?

[kozer]

@jameskoster I updated with the changes you proposed. However, for some reason the changes don't appear here.
But they are perfectly displayed here:
trunk...kozer:gutenberg:add/block_manager_enable_all_button

[danielbachhuber]

However, for some reason the changes don't appear here.
But they are perfectly displayed here:

@kozer That's weird...

Can you create a new pull request? I wouldn't trust merging this one if all of the commits aren't shown.

[kozer]

@danielbachhuber I'll do that first thing tomorrow

[danielbachhuber]

@kozer Actually, it looks like there's an active GitHub incident: https://www.githubstatus.com/incidents/1g1gkh0qpyvs

Hopefully it will be addressed by the time you're online tomorrow.

[paaljoachim]

Enable all - Reset

What do we in general do in Gutenberg? Is it Reset that we use to go back to default or something similar?

If I wanted to show all the blocks I would make it really clear that clicking a specific text link will show all the blocks. Be it the words are "Enable all" or "Reset"

What about something like "Enable all to show all the blocks" or "Reset to show all the blocks" or something else that just gives the explanation of what happens.

[kozer]

@danielbachhuber everything is showing as expected now. There are pending reviews, and I cannot merge. How I can make it to go through?

[danielbachhuber]

everything is showing as expected now. There are pending reviews, and I cannot merge. How I can make it to go through?

@kozer One last change, please. You can't merge because you don't have permissions to do. I've pinged you in Slack with some explanation.

[danielbachhuber]

@jameskoster @WordPress/gutenberg-design Should we remove the italization while we're here?

Current

Proposed

[apeatling]

Looks much better. +1 to removing the italic.

[jameskoster]

I think the whole element is ripe for an update, but was hesitant to make any specific suggestions and risk scope creep on the PR.

That said, I don't imagine any such redesign would make use of italic text, so if we did want to remove it here that would be fine imo 👍

[danielbachhuber]

@jameskoster Sounds good, thanks!

[kozer]

@danielbachhuber , I removed the italics from the text.

[danielbachhuber]

Looks good and works well 👍

I updated the pull request description with the most recent screenshot.