[RNMobile] Refactor Fixed Height Styling for Gallery Block #36013
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
With this commit, a new 'fixedHeight' block context is added for use by the Gallery and Image blocks. The Gallery block will be providing this context for use by the Image block. The purpose of the context is to indicate when images have a fixed height.
SiobhyB
added
[Type] Code Quality
With this commit, the conditional that determines whether a fixed height is set on the image block is changed. Instead of setting a fixed height if 'hasImageContext' is true, it's now only set if the 'fixedHeight' block context is passed down from a parent block.
|
Size Change: +2.07 kB (0%) Total Size: 1.08 MB
ℹ️ View Unchanged
|
SiobhyB
added
the
Mobile App - i.e. Android or iOS
Merged
2 tasks
Contributor
Author
|
Noting that there is also an ongoing discussion in #35510 regarding the introduction of "context constants", as a better way for indicating these types of contexts that aren't serialised. |
Contributor
Author
|
@geriux, would you perhaps have time to review this this week? Asking as it involves changes to code that were first introduced by you in #34957. @guarani, also requesting your review as you're familiar with the code following our conversations this week. Let me know if anything needs clarification or if I should request reviews from anyone else 🙇♀️ |
Contributor
|
Hey @SiobhyB, thanks for the PR!
I understand it's the inner Image blocks – not the parent blocks – that this change aims to prevent from being styled to have a fixed height.
It might be worth adding to the PR description a note to explain why this new block attribute, |
guarani
approved these changes
Oct 28, 2021
Contributor
guarani
left a comment
guarani
left a comment
There was a problem hiding this comment.
This change looks good to me and I tested both the new and old Gallery block and things work fine. I also checked the HTML output of the Gallery block and as expected it doesn't contain the fixedHeight attribute.
Thanks @SiobhyB!
Contributor
Author
|
@guarani, thank you for this! I've gone ahead to update the PR description with your suggestions, for clarity. 🙇♀️ |
This was referenced Oct 29, 2021
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
gutenberg-mobile: wordpress-mobile/gutenberg-mobile#4176Description
A fixed height is currently applied to the image block when any parent block makes use of block context. This has an unwanted effect on parent blocks that use context but aren't designed to have a fixed height.
To avoid inner blocks from being styled to have a fixed height whenever a parent block uses context, this PR introduces a specific
fixedHeightcontext. This will allow parent blocks to explicitly declare when the image block should have a fixed height, as per their requirements.A core block that this will impact is the Gallery block, which will now provide the
fixedHeightcontext to the Image block.How has this been tested?
Prequisite: Enable the flag for the refactored Gallery block. on mobile. At the time of writing, the way to enable the block on the Gutenberg Mobile demo app is to comment out this section of code.
With the refactored Gallery block enabled, we should ensure that the changes introduced with this PR don't have any adverse effects:
fixedHeightcontext constant is working and hasn't caused any regressions (no images would be visible if the context wasn't working).In addition, we should double-check that the change doesn't introduce any unexpected issues to the Image block:
Screenshots
From the screenshots below, you can see the difference in the Gallery block between when the
fixedHeightcontext is set totruevs. when it's set tofalse. The difference indicates that the context is working as expected, and only setting a fixed height to the image when a parent block explicitly provides thefixedHeightcontext:Types of changes
This PR introduces non-breaking code changes, with the following high-level overview:
fixedHeightcontext is now provided by the Gallery block and consumed by the Image block.hasImageContextis true, it's now set if thefixedHeightblock context is passed down from a parent block.fixedHeightis not serialized. That's because its default will always betrueand it will never be included in the block's HTML output. There is currently a separate discussion open in [RNMobile] Introduce Context Constants to Native #35510 about potential ways to indicate when contexts aren't serialized.Checklist:
*.native.jsfiles for terms that need renaming or removal).