Skip to content
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

Update: Refactor cover edit method to be a functional component #18116

Merged
merged 3 commits into from Nov 14, 2019

Conversation

@jorgefilipecosta
Copy link
Member

jorgefilipecosta commented Oct 25, 2019

Description

This PR refactors the cover block to be a functional component.
The reason is that we are going to have hooks for colors and gradients and we can only use hooks on functional components.
During this refactor the code was also simplified.

How has this been tested?

I verified the cover block continued to work as before. I tested the four types of backgrounds (color, gradient, image, and video) and the different settings the block offers.

cc: @talldan who already reviewed a similar PR.

Copy link
Contributor

youknowriad left a comment

The code is way cleaner, 👍

function useCoverIsDark( url, dimRatio = 50, overlayColor, elementRef ) {
const [ isDark, setIsDark ] = useState( false );
useEffect(
() => {

This comment has been minimized.

Copy link
@youknowriad

youknowriad Nov 14, 2019

Contributor

Nit: I'd personally write this in the same line as useEffect and the dependencies in the same line as the closing parens. Personal preference of course :)

if ( ! media || ! media.url ) {
setAttributes( { url: undefined, id: undefined } );
return;
function useCoverIsDark( url, dimRatio = 50, overlayColor, elementRef ) {

This comment has been minimized.

Copy link
@youknowriad

youknowriad Nov 14, 2019

Contributor

I like this extracted hook, it could use some JSDocs

@jorgefilipecosta jorgefilipecosta force-pushed the update/use-hooks-in-cover branch from 4ee9eb9 to 75c1e68 Nov 14, 2019
@jorgefilipecosta jorgefilipecosta changed the title Update: Refactor cover edit method to be a functional component. Update: Refactor cover edit method to be a functional component Nov 14, 2019
@jorgefilipecosta jorgefilipecosta merged commit 348f698 into master Nov 14, 2019
2 checks passed
2 checks passed
pull-request-automation
Details
Travis CI - Pull Request Build Passed
Details
@jorgefilipecosta jorgefilipecosta deleted the update/use-hooks-in-cover branch Nov 14, 2019
@youknowriad youknowriad added this to the Gutenberg 7.0 milestone Nov 25, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.