[Mobile] - BlockList - Block component refactor #50108
Merged
Conversation
This file contains 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
geriux
added
[Status] In Progress
|
Size Change: 0 B Total Size: 1.38 MB ℹ️ View Unchanged
|
|
Flaky tests detected in 35057dd. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/4937207534
|
geriux
force-pushed
the
rnmobile/refactor-block-list-item
branch
from
88dc039 to
f9083d0
Compare
added 11 commits
May 4, 2023 13:10
…alues that the editor uses
… move old class component into functional component. It also uses the same approach as the web editor for with applyWithSelect and applyWithDispatch. It also updates the code to avoid nesting too many views, and updating memoized code like the mergedStyle constant
…own file and fix an issue where the dashed border wasn't showing for inner blocks
…adds two simple integration tests
… this change simplifies using an extra View
… use the deep param
geriux
force-pushed
the
rnmobile/refactor-block-for-type-and-blocklist-block
branch
from
af1679c to
deac926
Compare
added 7 commits
May 4, 2023 15:59
…after simplifying the View wrappers around blocks
…eeds to be calculated and stored in the component's state to reflect changes
…ecent changes in the tree structure
… element for all blocks
2 tasks
dcalhoun
reviewed
May 8, 2023
packages/block-editor/src/components/block-list/block.native.js
Outdated
Show resolved
Hide resolved
packages/block-editor/src/components/block-list/test/block-invalid-warning.native.js
Outdated
Show resolved
Hide resolved
packages/block-editor/src/components/block-list/test/block-invalid-warning.native.js
Outdated
Show resolved
Hide resolved
added 4 commits
May 9, 2023 15:39
…ntBlockSelected to reflect it does a deep check
…omment and place the rest under the Assert section
…the structure now will be always available except that then values would be undefined for non block-based themes
dcalhoun
reviewed
May 9, 2023
dcalhoun
reviewed
May 9, 2023
dcalhoun
approved these changes
May 9, 2023
added 3 commits
May 10, 2023 10:51
…ist-block # Conflicts: # packages/react-native-editor/CHANGELOG.md
4 tasks
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.
Closes wordpress-mobile/gutenberg-mobile#5616
Closes #45415
Related PRs:
What?
This PR refactors the code of the
Blockcomponent andBlockInvalidWarning.Why?
To improve maintainability by updating the code to move away from using class components in favor of functional components.
How?
First, it updates the
BlockInvalidWarningcomponent by only passing theclientIdas a prop, so it will handle getting other data it needs. It also adds a few simple tests to make sure block recovery works as expected.It adds a new
BlockOutlinecomponent that extracts the logic of showing the block outlines into its own file, if we decide in the future to remove them, we can just remove this component and where it's rendered.The behavior of tapping on nested blocks changes, for inner blocks you can now access directly into that nested block instead of tapping multiple times depending on how many levels the block is nested in. Because of this, a few test helpers needed to be updated to reflect how tapping on blocks now works and the updated component tree.
Block component
mergedStyleto avoid adding other attributes in the future without testing well it doesn't degrade performance.applyWithSelect,applyWithDispatch, andcomposeapproaches from the web editor. I thought about finding a way to share this logic but maybe it's something we can work on in the future.Testing Instructions
Test adding blocks, nesting blocks, updating their alignment e.g. Full-width, wide with. Drag & Drop a few blocks.
CI should give us also quite a bit of confidence with the changes as well.
Testing Instructions for Keyboard
N/A
Screenshots or screencast
TapBefore.mov
TapAfter.mov