Skip to content

Conversation

@guarani
Copy link
Contributor

@guarani guarani commented Sep 1, 2021

Description

Addresses wordpress-mobile/gutenberg-mobile#3903

Adds capability for new Tiled Gallery block in Gutenberg Mobile.

How has this been tested?

See:

Types of changes

  • New feature for Gutenberg Mobile

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

@SiobhyB
Copy link
Contributor

SiobhyB commented Sep 2, 2021

@guarani, I followed the steps for both Android and iOS but haven't been able to view this block in the demo app for either. Here's what I've tried in terms of troubleshooting:

  • I verified that all three branches associated with this PR (for Gutenberg, Gutenberg Mobile, and Jetpack) are correctly checked out. I can see the new code for each branch in my editor.
  • I confirmed that toggling the other capabilities for the demo app works as expected e.g. I toggled editorOnboarding to true and was then able to see the new block indicator in the demo app.
  • I tested adding .contactInfoBlock: true, to the list of capabilities here, which I thought might work based on the declaration here. I wasn't able to view the Contact Info block in the iOS demo after making that change.
  • I created a fresh setup of Gutenberg Mobile and tried the above again.

Are you able to view the block with no other changes on your local setup? Any ideas what I may be missing from my testing?

@guarani
Copy link
Contributor Author

guarani commented Sep 3, 2021

👋 Hi @SiobhyB, thanks for flagging this. I checked the testing instructions on wordpress-mobile/gutenberg-mobile#3903 and see that I'd listed the wrong commands (e.g. npm run native start:reset instead of npm run start:reset).
Please let me know if that resolves the issue you saw. To clarify, the commands need to be executed in the Gutenberg Mobile demo app, not in this repo's demo app.

Copy link
Contributor

@SiobhyB SiobhyB left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @guarani! I was able to get this working for iOS after running npm run bundle.

The block still doesn't display in the Android app for me with these branches checked out, though. I was only able to get it to work after adding a line of code, which I've included in a comment.

Following the above actions, I was able to confirm that the block is visible from the inserter, search, and slash inserter on both platforms. 🎉 I'll go ahead to approve this PR as soon as the changes are made for Android. Let me know if I'm missing something here, too.

@guarani
Copy link
Contributor Author

guarani commented Sep 4, 2021

Thanks, @guarani! I was able to get this working for iOS after running npm run bundle.

Was bundling needed when testing from within WPiOS or within the Gutenberg Mobile folder? If the former, bundling makes sense if the packager is not running (that said, I don't think testing in the main apps is needed at the moment). If the latter, I'd like to dig into this further.

The block still doesn't display in the Android app for me with these branches checked out, though. I was only able to get it to work after adding a line of code, which I've included in a comment.

Thanks for that! Sorry that I didn't catch it myself. I've added your suggested change and it's fixed now.

@guarani guarani marked this pull request as ready for review September 4, 2021 01:55
@guarani guarani requested a review from SiobhyB September 4, 2021 02:08
Copy link
Contributor

@SiobhyB SiobhyB left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the changes, Paul! I'm now seeing everything work as expected across both platforms and can confirm the "bundle" issue was a mistake on my side.

Approved. :) :shipit:

@guarani
Copy link
Contributor Author

guarani commented Sep 10, 2021

Sorry for the mass ping folks 😞

@github-actions
Copy link

Size Change: +2.68 kB (0%)

Total Size: 1.04 MB

Filename Size Change
build/block-editor/index.min.js 120 kB +858 B (+1%)
build/block-editor/style-rtl.css 13.8 kB -2 B (0%)
build/block-editor/style.css 13.8 kB -1 B (0%)
build/block-library/blocks/button/style-rtl.css 600 B -5 B (-1%)
build/block-library/blocks/button/style.css 600 B -4 B (-1%)
build/block-library/blocks/columns/editor-rtl.css 206 B +12 B (+6%) 🔍
build/block-library/blocks/columns/editor.css 205 B +12 B (+6%) 🔍
build/block-library/blocks/columns/style-rtl.css 497 B +23 B (+5%) 🔍
build/block-library/blocks/columns/style.css 496 B +21 B (+4%)
build/block-library/blocks/embed/style-rtl.css 417 B +17 B (+4%)
build/block-library/blocks/embed/style.css 417 B +17 B (+4%)
build/block-library/blocks/gallery/editor-rtl.css 927 B +48 B (+5%) 🔍
build/block-library/blocks/gallery/editor.css 934 B +58 B (+7%) 🔍
build/block-library/blocks/gallery/style-rtl.css 1.6 kB -11 B (-1%)
build/block-library/blocks/gallery/style.css 1.59 kB -9 B (-1%)
build/block-library/blocks/heading/style-rtl.css 114 B +38 B (+50%) 🆘
build/block-library/blocks/heading/style.css 114 B +38 B (+50%) 🆘
build/block-library/blocks/list/style-rtl.css 94 B +31 B (+49%) 🚨
build/block-library/blocks/list/style.css 94 B +31 B (+49%) 🚨
build/block-library/blocks/navigation/editor-rtl.css 1.72 kB +18 B (+1%)
build/block-library/blocks/navigation/editor.css 1.72 kB +17 B (+1%)
build/block-library/blocks/navigation/style-rtl.css 1.42 kB -45 B (-3%)
build/block-library/blocks/navigation/style.css 1.41 kB -43 B (-3%)
build/block-library/blocks/paragraph/style-rtl.css 261 B +13 B (+5%) 🔍
build/block-library/blocks/paragraph/style.css 261 B +13 B (+5%) 🔍
build/block-library/blocks/pullquote/style-rtl.css 378 B +17 B (+5%) 🔍
build/block-library/blocks/pullquote/style.css 378 B +18 B (+5%) 🔍
build/block-library/blocks/query-pagination/style-rtl.css 239 B +71 B (+42%) 🚨
build/block-library/blocks/query-pagination/style.css 236 B +68 B (+40%) 🚨
build/block-library/blocks/quote/style-rtl.css 187 B +18 B (+11%) ⚠️
build/block-library/blocks/quote/style.css 187 B +18 B (+11%) ⚠️
build/block-library/blocks/social-links/style-rtl.css 1.3 kB -29 B (-2%)
build/block-library/blocks/social-links/style.css 1.3 kB -29 B (-2%)
build/block-library/common-rtl.css 853 B -437 B (-34%) 🎉
build/block-library/common.css 849 B -439 B (-34%) 🎉
build/block-library/editor-rtl.css 9.54 kB -376 B (-4%)
build/block-library/editor.css 9.52 kB -379 B (-4%)
build/block-library/index.min.js 151 kB +719 B (0%)
build/block-library/style-rtl.css 10.2 kB -408 B (-4%)
build/block-library/style.css 10.2 kB -407 B (-4%)
build/blocks/index.min.js 46.9 kB -98 B (0%)
build/components/index.min.js 209 kB -160 B (0%)
build/components/style-rtl.css 15.8 kB +57 B (0%)
build/components/style.css 15.8 kB +50 B (0%)
build/compose/index.min.js 10.2 kB +69 B (+1%)
build/core-data/index.min.js 12.3 kB -180 B (-1%)
build/customize-widgets/index.min.js 11.1 kB +22 B (0%)
build/dom/index.min.js 4.53 kB +3 B (0%)
build/edit-navigation/index.min.js 14.9 kB +1.31 kB (+10%) ⚠️
build/edit-navigation/style-rtl.css 3.37 kB +228 B (+7%) 🔍
build/edit-navigation/style.css 3.37 kB +229 B (+7%) 🔍
build/edit-post/index.min.js 29 kB +35 B (0%)
build/edit-post/style-rtl.css 7.2 kB +6 B (0%)
build/edit-post/style.css 7.2 kB +6 B (0%)
build/edit-site/index.min.js 26.6 kB +350 B (+1%)
build/edit-widgets/index.min.js 16.1 kB +7 B (0%)
build/editor/index.min.js 37.7 kB +22 B (0%)
build/i18n/index.min.js 3.6 kB +8 B (0%)
build/rich-text/index.min.js 10.6 kB -8 B (0%)
build/widgets/index.min.js 7.27 kB +902 B (+14%) ⚠️
build/widgets/style-rtl.css 1.17 kB +126 B (+12%) ⚠️
build/widgets/style.css 1.18 kB +125 B (+12%) ⚠️
ℹ️ View Unchanged
Filename Size
build/a11y/index.min.js 931 B
build/admin-manifest/index.min.js 1.09 kB
build/annotations/index.min.js 2.7 kB
build/api-fetch/index.min.js 2.19 kB
build/autop/index.min.js 2.08 kB
build/blob/index.min.js 459 B
build/block-directory/index.min.js 6.2 kB
build/block-directory/style-rtl.css 1.01 kB
build/block-directory/style.css 1.01 kB
build/block-editor/default-editor-styles-rtl.css 378 B
build/block-editor/default-editor-styles.css 378 B
build/block-library/blocks/archives/editor-rtl.css 61 B
build/block-library/blocks/archives/editor.css 60 B
build/block-library/blocks/archives/style-rtl.css 65 B
build/block-library/blocks/archives/style.css 65 B
build/block-library/blocks/audio/editor-rtl.css 58 B
build/block-library/blocks/audio/editor.css 58 B
build/block-library/blocks/audio/style-rtl.css 111 B
build/block-library/blocks/audio/style.css 111 B
build/block-library/blocks/audio/theme-rtl.css 125 B
build/block-library/blocks/audio/theme.css 125 B
build/block-library/blocks/block/editor-rtl.css 161 B
build/block-library/blocks/block/editor.css 161 B
build/block-library/blocks/button/editor-rtl.css 474 B
build/block-library/blocks/button/editor.css 474 B
build/block-library/blocks/buttons/editor-rtl.css 315 B
build/block-library/blocks/buttons/editor.css 315 B
build/block-library/blocks/buttons/style-rtl.css 370 B
build/block-library/blocks/buttons/style.css 370 B
build/block-library/blocks/calendar/style-rtl.css 207 B
build/block-library/blocks/calendar/style.css 207 B
build/block-library/blocks/categories/editor-rtl.css 84 B
build/block-library/blocks/categories/editor.css 83 B
build/block-library/blocks/categories/style-rtl.css 79 B
build/block-library/blocks/categories/style.css 79 B
build/block-library/blocks/code/style-rtl.css 90 B
build/block-library/blocks/code/style.css 90 B
build/block-library/blocks/code/theme-rtl.css 131 B
build/block-library/blocks/code/theme.css 131 B
build/block-library/blocks/cover/editor-rtl.css 666 B
build/block-library/blocks/cover/editor.css 670 B
build/block-library/blocks/cover/style-rtl.css 1.23 kB
build/block-library/blocks/cover/style.css 1.23 kB
build/block-library/blocks/embed/editor-rtl.css 488 B
build/block-library/blocks/embed/editor.css 488 B
build/block-library/blocks/embed/theme-rtl.css 124 B
build/block-library/blocks/embed/theme.css 124 B
build/block-library/blocks/file/editor-rtl.css 300 B
build/block-library/blocks/file/editor.css 300 B
build/block-library/blocks/file/style-rtl.css 255 B
build/block-library/blocks/file/style.css 255 B
build/block-library/blocks/file/view.min.js 322 B
build/block-library/blocks/freeform/editor-rtl.css 2.44 kB
build/block-library/blocks/freeform/editor.css 2.44 kB
build/block-library/blocks/gallery/theme-rtl.css 122 B
build/block-library/blocks/gallery/theme.css 122 B
build/block-library/blocks/group/editor-rtl.css 159 B
build/block-library/blocks/group/editor.css 159 B
build/block-library/blocks/group/style-rtl.css 57 B
build/block-library/blocks/group/style.css 57 B
build/block-library/blocks/group/theme-rtl.css 70 B
build/block-library/blocks/group/theme.css 70 B
build/block-library/blocks/home-link/style-rtl.css 247 B
build/block-library/blocks/home-link/style.css 247 B
build/block-library/blocks/html/editor-rtl.css 283 B
build/block-library/blocks/html/editor.css 284 B
build/block-library/blocks/image/editor-rtl.css 728 B
build/block-library/blocks/image/editor.css 728 B
build/block-library/blocks/image/style-rtl.css 482 B
build/block-library/blocks/image/style.css 487 B
build/block-library/blocks/image/theme-rtl.css 124 B
build/block-library/blocks/image/theme.css 124 B
build/block-library/blocks/latest-comments/style-rtl.css 284 B
build/block-library/blocks/latest-comments/style.css 284 B
build/block-library/blocks/latest-posts/editor-rtl.css 137 B
build/block-library/blocks/latest-posts/editor.css 137 B
build/block-library/blocks/latest-posts/style-rtl.css 528 B
build/block-library/blocks/latest-posts/style.css 527 B
build/block-library/blocks/media-text/editor-rtl.css 266 B
build/block-library/blocks/media-text/editor.css 263 B
build/block-library/blocks/media-text/style-rtl.css 488 B
build/block-library/blocks/media-text/style.css 485 B
build/block-library/blocks/more/editor-rtl.css 431 B
build/block-library/blocks/more/editor.css 431 B
build/block-library/blocks/navigation-link/editor-rtl.css 489 B
build/block-library/blocks/navigation-link/editor.css 488 B
build/block-library/blocks/navigation-link/style-rtl.css 94 B
build/block-library/blocks/navigation-link/style.css 94 B
build/block-library/blocks/navigation/view.min.js 2.52 kB
build/block-library/blocks/nextpage/editor-rtl.css 395 B
build/block-library/blocks/nextpage/editor.css 395 B
build/block-library/blocks/page-list/editor-rtl.css 310 B
build/block-library/blocks/page-list/editor.css 310 B
build/block-library/blocks/page-list/style-rtl.css 241 B
build/block-library/blocks/page-list/style.css 241 B
build/block-library/blocks/paragraph/editor-rtl.css 157 B
build/block-library/blocks/paragraph/editor.css 157 B
build/block-library/blocks/post-author/editor-rtl.css 210 B
build/block-library/blocks/post-author/editor.css 210 B
build/block-library/blocks/post-author/style-rtl.css 182 B
build/block-library/blocks/post-author/style.css 181 B
build/block-library/blocks/post-comments-form/style-rtl.css 140 B
build/block-library/blocks/post-comments-form/style.css 140 B
build/block-library/blocks/post-comments/style-rtl.css 360 B
build/block-library/blocks/post-comments/style.css 359 B
build/block-library/blocks/post-content/editor-rtl.css 138 B
build/block-library/blocks/post-content/editor.css 138 B
build/block-library/blocks/post-excerpt/editor-rtl.css 73 B
build/block-library/blocks/post-excerpt/editor.css 73 B
build/block-library/blocks/post-excerpt/style-rtl.css 69 B
build/block-library/blocks/post-excerpt/style.css 69 B
build/block-library/blocks/post-featured-image/editor-rtl.css 398 B
build/block-library/blocks/post-featured-image/editor.css 398 B
build/block-library/blocks/post-featured-image/style-rtl.css 143 B
build/block-library/blocks/post-featured-image/style.css 143 B
build/block-library/blocks/post-template/editor-rtl.css 99 B
build/block-library/blocks/post-template/editor.css 98 B
build/block-library/blocks/post-template/style-rtl.css 378 B
build/block-library/blocks/post-template/style.css 379 B
build/block-library/blocks/post-terms/style-rtl.css 73 B
build/block-library/blocks/post-terms/style.css 73 B
build/block-library/blocks/post-title/style-rtl.css 60 B
build/block-library/blocks/post-title/style.css 60 B
build/block-library/blocks/preformatted/style-rtl.css 103 B
build/block-library/blocks/preformatted/style.css 103 B
build/block-library/blocks/pullquote/editor-rtl.css 198 B
build/block-library/blocks/pullquote/editor.css 198 B
build/block-library/blocks/pullquote/theme-rtl.css 167 B
build/block-library/blocks/pullquote/theme.css 167 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122 B
build/block-library/blocks/query-pagination-numbers/editor.css 121 B
build/block-library/blocks/query-pagination/editor-rtl.css 270 B
build/block-library/blocks/query-pagination/editor.css 262 B
build/block-library/blocks/query-title/editor-rtl.css 85 B
build/block-library/blocks/query-title/editor.css 85 B
build/block-library/blocks/query/editor-rtl.css 131 B
build/block-library/blocks/query/editor.css 132 B
build/block-library/blocks/quote/theme-rtl.css 220 B
build/block-library/blocks/quote/theme.css 222 B
build/block-library/blocks/rss/editor-rtl.css 202 B
build/block-library/blocks/rss/editor.css 204 B
build/block-library/blocks/rss/style-rtl.css 289 B
build/block-library/blocks/rss/style.css 288 B
build/block-library/blocks/search/editor-rtl.css 165 B
build/block-library/blocks/search/editor.css 165 B
build/block-library/blocks/search/style-rtl.css 374 B
build/block-library/blocks/search/style.css 375 B
build/block-library/blocks/search/theme-rtl.css 64 B
build/block-library/blocks/search/theme.css 64 B
build/block-library/blocks/separator/editor-rtl.css 99 B
build/block-library/blocks/separator/editor.css 99 B
build/block-library/blocks/separator/style-rtl.css 250 B
build/block-library/blocks/separator/style.css 250 B
build/block-library/blocks/separator/theme-rtl.css 172 B
build/block-library/blocks/separator/theme.css 172 B
build/block-library/blocks/shortcode/editor-rtl.css 474 B
build/block-library/blocks/shortcode/editor.css 474 B
build/block-library/blocks/site-logo/editor-rtl.css 462 B
build/block-library/blocks/site-logo/editor.css 464 B
build/block-library/blocks/site-logo/style-rtl.css 153 B
build/block-library/blocks/site-logo/style.css 153 B
build/block-library/blocks/site-tagline/editor-rtl.css 86 B
build/block-library/blocks/site-tagline/editor.css 86 B
build/block-library/blocks/site-title/editor-rtl.css 84 B
build/block-library/blocks/site-title/editor.css 84 B
build/block-library/blocks/social-link/editor-rtl.css 165 B
build/block-library/blocks/social-link/editor.css 165 B
build/block-library/blocks/social-links/editor-rtl.css 812 B
build/block-library/blocks/social-links/editor.css 811 B
build/block-library/blocks/spacer/editor-rtl.css 307 B
build/block-library/blocks/spacer/editor.css 307 B
build/block-library/blocks/spacer/style-rtl.css 48 B
build/block-library/blocks/spacer/style.css 48 B
build/block-library/blocks/table/editor-rtl.css 471 B
build/block-library/blocks/table/editor.css 472 B
build/block-library/blocks/table/style-rtl.css 481 B
build/block-library/blocks/table/style.css 481 B
build/block-library/blocks/table/theme-rtl.css 188 B
build/block-library/blocks/table/theme.css 188 B
build/block-library/blocks/tag-cloud/style-rtl.css 146 B
build/block-library/blocks/tag-cloud/style.css 146 B
build/block-library/blocks/template-part/editor-rtl.css 636 B
build/block-library/blocks/template-part/editor.css 635 B
build/block-library/blocks/template-part/theme-rtl.css 101 B
build/block-library/blocks/template-part/theme.css 101 B
build/block-library/blocks/term-description/editor-rtl.css 90 B
build/block-library/blocks/term-description/editor.css 90 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B
build/block-library/blocks/text-columns/editor.css 95 B
build/block-library/blocks/text-columns/style-rtl.css 166 B
build/block-library/blocks/text-columns/style.css 166 B
build/block-library/blocks/verse/style-rtl.css 87 B
build/block-library/blocks/verse/style.css 87 B
build/block-library/blocks/video/editor-rtl.css 571 B
build/block-library/blocks/video/editor.css 572 B
build/block-library/blocks/video/style-rtl.css 173 B
build/block-library/blocks/video/style.css 173 B
build/block-library/blocks/video/theme-rtl.css 124 B
build/block-library/blocks/video/theme.css 124 B
build/block-library/reset-rtl.css 527 B
build/block-library/reset.css 527 B
build/block-library/theme-rtl.css 658 B
build/block-library/theme.css 663 B
build/block-serialization-default-parser/index.min.js 1.09 kB
build/block-serialization-spec-parser/index.min.js 2.79 kB
build/customize-widgets/style-rtl.css 1.5 kB
build/customize-widgets/style.css 1.49 kB
build/data-controls/index.min.js 614 B
build/data/index.min.js 7.1 kB
build/date/index.min.js 31.5 kB
build/deprecated/index.min.js 428 B
build/dom-ready/index.min.js 304 B
build/edit-post/classic-rtl.css 492 B
build/edit-post/classic.css 494 B
build/edit-site/style-rtl.css 5.07 kB
build/edit-site/style.css 5.07 kB
build/edit-widgets/style-rtl.css 4.06 kB
build/edit-widgets/style.css 4.06 kB
build/editor/style-rtl.css 3.74 kB
build/editor/style.css 3.73 kB
build/element/index.min.js 3.17 kB
build/escape-html/index.min.js 517 B
build/format-library/index.min.js 5.36 kB
build/format-library/style-rtl.css 668 B
build/format-library/style.css 669 B
build/hooks/index.min.js 1.55 kB
build/html-entities/index.min.js 424 B
build/is-shallow-equal/index.min.js 501 B
build/keyboard-shortcuts/index.min.js 1.49 kB
build/keycodes/index.min.js 1.25 kB
build/list-reusable-blocks/index.min.js 1.85 kB
build/list-reusable-blocks/style-rtl.css 838 B
build/list-reusable-blocks/style.css 838 B
build/media-utils/index.min.js 2.88 kB
build/notices/index.min.js 845 B
build/nux/index.min.js 2.03 kB
build/nux/style-rtl.css 747 B
build/nux/style.css 743 B
build/plugins/index.min.js 1.83 kB
build/primitives/index.min.js 921 B
build/priority-queue/index.min.js 582 B
build/react-i18n/index.min.js 671 B
build/redux-routine/index.min.js 2.63 kB
build/reusable-blocks/index.min.js 2.28 kB
build/reusable-blocks/style-rtl.css 256 B
build/reusable-blocks/style.css 256 B
build/server-side-render/index.min.js 1.32 kB
build/shortcode/index.min.js 1.48 kB
build/token-list/index.min.js 562 B
build/url/index.min.js 1.74 kB
build/viewport/index.min.js 1.02 kB
build/warning/index.min.js 248 B
build/wordcount/index.min.js 1.04 kB

compressed-size-action

@gziolo gziolo added the Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change) label Sep 10, 2021
@guarani guarani force-pushed the rnmobile/add/tiled-gallery-block-registration branch from c6b1619 to 24d7e1a Compare September 10, 2021 21:03
@guarani guarani requested a review from illusaen September 10, 2021 21:14
@guarani guarani force-pushed the rnmobile/add/tiled-gallery-block-registration branch from 24d7e1a to 222fac2 Compare September 14, 2021 14:10
@guarani guarani merged commit 4c4f64e into rnmobile/add/tiled-gallery-block Sep 14, 2021
@guarani guarani deleted the rnmobile/add/tiled-gallery-block-registration branch September 14, 2021 17:30
SiobhyB pushed a commit that referenced this pull request Sep 29, 2021
* Register new block
* Enable new block capability
SiobhyB pushed a commit that referenced this pull request Oct 4, 2021
* Register new block
* Enable new block capability
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants