-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Refactor cover background controls #18718
Conversation
Hi Noah @noahtallen How should we move this PR forward? |
Thanks @paaljoachim. I fully expect my approach in this PR to be wrong, as it was my first try at a refactor in Gutenberg. I wasn't sure how to tackle just adding a background image to the block, but reusable background controls in general seems like a great way to accomplish it. I bet a lot of stuff has changed in the past 4 months as well, so we might need to abandon this PR. At any rate, if folks have feedback about where to start when it comes to background controls, I'm happy to take a look. |
This is far enough out of date that I don't think it is useful any more. |
Understandable. |
it definitely was at the time! I'm sure there is a lot that have been done better. I hope/imagine some other things related to it might be improved now as well :) |
It is slowly getting there...:) |
Disclaimer: since this is one of my first bigger PRs for Gutenberg, I approached this as a learning experience and hope that the changes are useful. Folks may want to take a different approach with this, which I absolutely understand :)
Description
@paaljoachim asked me to take a look at #14744, and as I was looking around at related issues to understand the context, I came across #16479. In order to add some better background tools to the Group block, it seems like the first step would be refactoring the background controls out of the cover block into a place where they could be used more generically.
The goal of this PR is to refactor the background controls out of the cover block into a new
__experimentalWithBackgroundControls
component located atblock-editor/background-controls
. I separated many of the intertwined aspects of the Cover block's edit component into separate pieces so that it will be easier to hide parts which might not be needed for other types of blocks like the group block.I think this is a good start to #16479 since it gives us a space to start thinking about how we should compose the background controls so that they can be easily used by other blocks. I expect a lot of this will change as we go forward, particularly with the design, but I hope this could let us abstract the changes behind this component so that other things which use it (for now, just the Cover block) will benefit from future changes.
Note that I did my best to avoid functionality changes. Most of the components and functions have been copy/pasted from the cover block's edit file and then wired together.
I took some inspiration from the new
useColors
hook by @epiqueras, but did not quite take the final steps of converting everything into a hook. For now, it remains a functional component :)Some things that still need consideration:
save
component? Currently, the Cover block's save component still works great, but we need to refactor those pieces out into this package so that it's easy to reuse them.How has this been tested?
On my local gutenberg/docker environment, I confirmed that the cover block works exactly as it did before. The UI and controls are in the same places, and changes like gradient cover, images, focal point, etc. still work as expected.
Types of changes
Refactor, non-breaking change.
Checklist: