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

[RNMobile] Add drag & drop help guide in Help & Support screen #40961

Merged
merged 12 commits into from
May 19, 2022

Conversation

fluiddot
Copy link
Contributor

@fluiddot fluiddot commented May 10, 2022

What?

Update "Move blocks" section of "Help & Support" screen to incorporate a help guide for the drag & drop feature.

Why?

Addresses wordpress-mobile/gutenberg-mobile#4840.

How?

The render function of MoveBlocks component has been updated to include further information about the drag & drop funcionality.

Testing Instructions

  1. Open a post/page.
  2. Tap on the three dots button located at the top-right corner.
  3. Tap on "Help & Support" button.
  4. Observe that the "Move blocks" item has a different icon.
  5. Tap on "Move blocks" item.
  6. Observe that the screen contains information about the drag & drop feature.

NOTE: It would be great to test it in both light and dark modes.

Screenshots or screencast

Help & Support screen (note the change in the icon of Move blocks section):

iOS (light) iOS (dark) Android (light) Android (dark)

Move blocks section:

iOS (light) iOS (dark) Android (light) Android (dark)

@fluiddot fluiddot added [Feature] Drag and Drop Drag and drop functionality when working with blocks Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change) labels May 10, 2022
@fluiddot fluiddot requested a review from geriux May 10, 2022 10:29
@fluiddot fluiddot self-assigned this May 10, 2022
@fluiddot
Copy link
Contributor Author

I'm setting this PR in draft until we update the image to reflect the drag & drop feature.

@github-actions
Copy link

github-actions bot commented May 10, 2022

Size Change: 0 B

Total Size: 1.24 MB

ℹ️ View Unchanged
Filename Size
build/a11y/index.min.js 993 B
build/annotations/index.min.js 2.77 kB
build/api-fetch/index.min.js 2.27 kB
build/autop/index.min.js 2.15 kB
build/blob/index.min.js 487 B
build/block-directory/index.min.js 6.51 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-editor/index.min.js 150 kB
build/block-editor/style-rtl.css 14.5 kB
build/block-editor/style.css 14.5 kB
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 150 B
build/block-library/blocks/audio/editor.css 150 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/avatar/editor-rtl.css 116 B
build/block-library/blocks/avatar/editor.css 116 B
build/block-library/blocks/avatar/style-rtl.css 59 B
build/block-library/blocks/avatar/style.css 59 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 445 B
build/block-library/blocks/button/editor.css 445 B
build/block-library/blocks/button/style-rtl.css 560 B
build/block-library/blocks/button/style.css 560 B
build/block-library/blocks/buttons/editor-rtl.css 292 B
build/block-library/blocks/buttons/editor.css 292 B
build/block-library/blocks/buttons/style-rtl.css 275 B
build/block-library/blocks/buttons/style.css 275 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 103 B
build/block-library/blocks/code/style.css 103 B
build/block-library/blocks/code/theme-rtl.css 124 B
build/block-library/blocks/code/theme.css 124 B
build/block-library/blocks/columns/editor-rtl.css 108 B
build/block-library/blocks/columns/editor.css 108 B
build/block-library/blocks/columns/style-rtl.css 406 B
build/block-library/blocks/columns/style.css 406 B
build/block-library/blocks/comment-author-avatar/editor-rtl.css 125 B
build/block-library/blocks/comment-author-avatar/editor.css 125 B
build/block-library/blocks/comment-content/style-rtl.css 92 B
build/block-library/blocks/comment-content/style.css 92 B
build/block-library/blocks/comment-template/style-rtl.css 127 B
build/block-library/blocks/comment-template/style.css 127 B
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 123 B
build/block-library/blocks/comments-pagination-numbers/editor.css 121 B
build/block-library/blocks/comments-pagination/editor-rtl.css 222 B
build/block-library/blocks/comments-pagination/editor.css 209 B
build/block-library/blocks/comments-pagination/style-rtl.css 235 B
build/block-library/blocks/comments-pagination/style.css 231 B
build/block-library/blocks/comments-title/editor-rtl.css 75 B
build/block-library/blocks/comments-title/editor.css 75 B
build/block-library/blocks/comments/editor-rtl.css 95 B
build/block-library/blocks/comments/editor.css 95 B
build/block-library/blocks/cover/editor-rtl.css 546 B
build/block-library/blocks/cover/editor.css 547 B
build/block-library/blocks/cover/style-rtl.css 1.53 kB
build/block-library/blocks/cover/style.css 1.53 kB
build/block-library/blocks/embed/editor-rtl.css 293 B
build/block-library/blocks/embed/editor.css 293 B
build/block-library/blocks/embed/style-rtl.css 417 B
build/block-library/blocks/embed/style.css 417 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 353 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/editor-rtl.css 961 B
build/block-library/blocks/gallery/editor.css 964 B
build/block-library/blocks/gallery/style-rtl.css 1.51 kB
build/block-library/blocks/gallery/style.css 1.51 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 333 B
build/block-library/blocks/group/editor.css 333 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 78 B
build/block-library/blocks/group/theme.css 78 B
build/block-library/blocks/heading/style-rtl.css 76 B
build/block-library/blocks/heading/style.css 76 B
build/block-library/blocks/html/editor-rtl.css 332 B
build/block-library/blocks/html/editor.css 333 B
build/block-library/blocks/image/editor-rtl.css 738 B
build/block-library/blocks/image/editor.css 737 B
build/block-library/blocks/image/style-rtl.css 529 B
build/block-library/blocks/image/style.css 535 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 199 B
build/block-library/blocks/latest-posts/editor.css 198 B
build/block-library/blocks/latest-posts/style-rtl.css 463 B
build/block-library/blocks/latest-posts/style.css 462 B
build/block-library/blocks/list/style-rtl.css 88 B
build/block-library/blocks/list/style.css 88 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 493 B
build/block-library/blocks/media-text/style.css 490 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 708 B
build/block-library/blocks/navigation-link/editor.css 706 B
build/block-library/blocks/navigation-link/style-rtl.css 115 B
build/block-library/blocks/navigation-link/style.css 115 B
build/block-library/blocks/navigation-submenu/editor-rtl.css 299 B
build/block-library/blocks/navigation-submenu/editor.css 299 B
build/block-library/blocks/navigation-submenu/view.min.js 375 B
build/block-library/blocks/navigation/editor-rtl.css 2.03 kB
build/block-library/blocks/navigation/editor.css 2.04 kB
build/block-library/blocks/navigation/style-rtl.css 1.95 kB
build/block-library/blocks/navigation/style.css 1.94 kB
build/block-library/blocks/navigation/view-modal.min.js 2.78 kB
build/block-library/blocks/navigation/view.min.js 395 B
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 363 B
build/block-library/blocks/page-list/editor.css 363 B
build/block-library/blocks/page-list/style-rtl.css 175 B
build/block-library/blocks/page-list/style.css 175 B
build/block-library/blocks/paragraph/editor-rtl.css 157 B
build/block-library/blocks/paragraph/editor.css 157 B
build/block-library/blocks/paragraph/style-rtl.css 260 B
build/block-library/blocks/paragraph/style.css 260 B
build/block-library/blocks/post-author/style-rtl.css 175 B
build/block-library/blocks/post-author/style.css 176 B
build/block-library/blocks/post-comments-form/editor-rtl.css 69 B
build/block-library/blocks/post-comments-form/editor.css 69 B
build/block-library/blocks/post-comments-form/style-rtl.css 495 B
build/block-library/blocks/post-comments-form/style.css 495 B
build/block-library/blocks/post-comments/editor-rtl.css 77 B
build/block-library/blocks/post-comments/editor.css 77 B
build/block-library/blocks/post-comments/style-rtl.css 628 B
build/block-library/blocks/post-comments/style.css 628 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 721 B
build/block-library/blocks/post-featured-image/editor.css 721 B
build/block-library/blocks/post-featured-image/style-rtl.css 153 B
build/block-library/blocks/post-featured-image/style.css 153 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 323 B
build/block-library/blocks/post-template/style.css 323 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 80 B
build/block-library/blocks/post-title/style.css 80 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/style-rtl.css 370 B
build/block-library/blocks/pullquote/style.css 370 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 221 B
build/block-library/blocks/query-pagination/editor.css 211 B
build/block-library/blocks/query-pagination/style-rtl.css 234 B
build/block-library/blocks/query-pagination/style.css 231 B
build/block-library/blocks/query/editor-rtl.css 369 B
build/block-library/blocks/query/editor.css 369 B
build/block-library/blocks/quote/style-rtl.css 213 B
build/block-library/blocks/quote/style.css 213 B
build/block-library/blocks/quote/theme-rtl.css 223 B
build/block-library/blocks/quote/theme.css 226 B
build/block-library/blocks/read-more/style-rtl.css 132 B
build/block-library/blocks/read-more/style.css 132 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 397 B
build/block-library/blocks/search/style.css 398 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 146 B
build/block-library/blocks/separator/editor.css 146 B
build/block-library/blocks/separator/style-rtl.css 233 B
build/block-library/blocks/separator/style.css 233 B
build/block-library/blocks/separator/theme-rtl.css 194 B
build/block-library/blocks/separator/theme.css 194 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 759 B
build/block-library/blocks/site-logo/editor.css 759 B
build/block-library/blocks/site-logo/style-rtl.css 181 B
build/block-library/blocks/site-logo/style.css 181 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 177 B
build/block-library/blocks/social-link/editor.css 177 B
build/block-library/blocks/social-links/editor-rtl.css 674 B
build/block-library/blocks/social-links/editor.css 673 B
build/block-library/blocks/social-links/style-rtl.css 1.37 kB
build/block-library/blocks/social-links/style.css 1.36 kB
build/block-library/blocks/spacer/editor-rtl.css 332 B
build/block-library/blocks/spacer/editor.css 332 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 504 B
build/block-library/blocks/table/editor.css 504 B
build/block-library/blocks/table/style-rtl.css 625 B
build/block-library/blocks/table/style.css 625 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 226 B
build/block-library/blocks/tag-cloud/style.css 227 B
build/block-library/blocks/template-part/editor-rtl.css 149 B
build/block-library/blocks/template-part/editor.css 149 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/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 561 B
build/block-library/blocks/video/editor.css 563 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/common-rtl.css 993 B
build/block-library/common.css 990 B
build/block-library/editor-rtl.css 10.2 kB
build/block-library/editor.css 10.3 kB
build/block-library/index.min.js 181 kB
build/block-library/reset-rtl.css 478 B
build/block-library/reset.css 478 B
build/block-library/style-rtl.css 11.5 kB
build/block-library/style.css 11.6 kB
build/block-library/theme-rtl.css 689 B
build/block-library/theme.css 694 B
build/block-serialization-default-parser/index.min.js 1.12 kB
build/block-serialization-spec-parser/index.min.js 2.83 kB
build/blocks/index.min.js 47.1 kB
build/components/index.min.js 227 kB
build/components/style-rtl.css 14.5 kB
build/components/style.css 14.5 kB
build/compose/index.min.js 11.7 kB
build/core-data/index.min.js 14.6 kB
build/customize-widgets/index.min.js 11.2 kB
build/customize-widgets/style-rtl.css 1.39 kB
build/customize-widgets/style.css 1.39 kB
build/data-controls/index.min.js 663 B
build/data/index.min.js 7.98 kB
build/date/index.min.js 32 kB
build/deprecated/index.min.js 518 B
build/dom-ready/index.min.js 336 B
build/dom/index.min.js 4.69 kB
build/edit-navigation/index.min.js 16 kB
build/edit-navigation/style-rtl.css 4.05 kB
build/edit-navigation/style.css 4.05 kB
build/edit-post/classic-rtl.css 546 B
build/edit-post/classic.css 547 B
build/edit-post/index.min.js 30.4 kB
build/edit-post/style-rtl.css 7.08 kB
build/edit-post/style.css 7.08 kB
build/edit-site/index.min.js 47.9 kB
build/edit-site/style-rtl.css 7.73 kB
build/edit-site/style.css 7.71 kB
build/edit-widgets/index.min.js 16.4 kB
build/edit-widgets/style-rtl.css 4.4 kB
build/edit-widgets/style.css 4.4 kB
build/editor/index.min.js 38.5 kB
build/editor/style-rtl.css 3.71 kB
build/editor/style.css 3.7 kB
build/element/index.min.js 4.3 kB
build/escape-html/index.min.js 548 B
build/format-library/index.min.js 6.62 kB
build/format-library/style-rtl.css 571 B
build/format-library/style.css 571 B
build/hooks/index.min.js 1.66 kB
build/html-entities/index.min.js 454 B
build/i18n/index.min.js 3.79 kB
build/is-shallow-equal/index.min.js 535 B
build/keyboard-shortcuts/index.min.js 1.83 kB
build/keycodes/index.min.js 1.41 kB
build/list-reusable-blocks/index.min.js 1.75 kB
build/list-reusable-blocks/style-rtl.css 835 B
build/list-reusable-blocks/style.css 835 B
build/media-utils/index.min.js 2.9 kB
build/notices/index.min.js 957 B
build/nux/index.min.js 2.1 kB
build/nux/style-rtl.css 744 B
build/nux/style.css 741 B
build/plugins/index.min.js 1.98 kB
build/preferences-persistence/index.min.js 2.23 kB
build/preferences/index.min.js 1.32 kB
build/primitives/index.min.js 949 B
build/priority-queue/index.min.js 628 B
build/react-i18n/index.min.js 704 B
build/react-refresh-entry/index.min.js 8.44 kB
build/react-refresh-runtime/index.min.js 7.31 kB
build/redux-routine/index.min.js 2.69 kB
build/reusable-blocks/index.min.js 2.24 kB
build/reusable-blocks/style-rtl.css 256 B
build/reusable-blocks/style.css 256 B
build/rich-text/index.min.js 11.2 kB
build/server-side-render/index.min.js 1.61 kB
build/shortcode/index.min.js 1.52 kB
build/token-list/index.min.js 668 B
build/url/index.min.js 1.99 kB
build/vendors/react-dom.min.js 38.5 kB
build/vendors/react.min.js 4.34 kB
build/viewport/index.min.js 1.08 kB
build/warning/index.min.js 280 B
build/widgets/index.min.js 7.2 kB
build/widgets/style-rtl.css 1.16 kB
build/widgets/style.css 1.16 kB
build/wordcount/index.min.js 1.07 kB

compressed-size-action

Base automatically changed from rnmobile/feature/drag-and-drop to trunk May 11, 2022 15:32
@fluiddot fluiddot force-pushed the rnmobile/add/drag-and-drop-help-guide branch from 060e1bf to b777139 Compare May 12, 2022 14:17
@fluiddot fluiddot added the Mobile App - Automation Label used to initiate Mobile App PR Automation label May 13, 2022
@fluiddot fluiddot marked this pull request as ready for review May 13, 2022 08:48
@iamthomasbishop
Copy link

@fluiddot This is looking great, nice work! Just a couple of things I noticed, and I'm not 100% sure which are directly related to this ticket, but would be nice to resolve if possible:

Top-level sheet

  1. It looks like the padding-top on our section headers is collapsed
  2. The colors of the section headers looks off, possibly using primary whereas it should be using our usual section header color, which IIRC is tertiary
  3. Let's remove the border-bottom on the last list item in the "The basics" section, as we don't typically show a border-bottom on :last-child for lists

Detail sheet

I noticed that on Android, the second ("old") image has a border-bottom. I'm not sure if that was already in place, but in any case, I suggest we either remove the borders entirely or add them to all of the images across the board for consistency — my preference would be the former, to remove all of the borders from images.

@fluiddot
Copy link
Contributor Author

@fluiddot This is looking great, nice work! Just a couple of things I noticed, and I'm not 100% sure which are directly related to this ticket, but would be nice to resolve if possible:

Thanks @iamthomasbishop for checking the screenshots and good catch on identifying the issues 🙇 .

Top-level sheet

  1. It looks like the padding-top on our section headers is collapsed
  2. The colors of the section headers looks off, possibly using primary whereas it should be using our usual section header color, which IIRC is tertiary

Yep, I'm afraid I broke the styles when updating the headings of inner sections, looks like both were using the same styles. I've addressed this issue in 61bb555.

  1. Let's remove the border-bottom on the last list item in the "The basics" section, as we don't typically show a border-bottom on :last-child for lists

Good point, I've applied this change 12fe702.

I've updated the screenshots of the Help & Support screen to reflect these changes.

Detail sheet

I noticed that on Android, the second ("old") image has a border-bottom. I'm not sure if that was already in place, but in any case, I suggest we either remove the borders entirely or add them to all of the images across the board for consistency — my preference would be the former, to remove all of the borders from images.

That's interesting, I checked the image, and looks like there's actually a border at the bottom on all of them.

Screenshot 2022-05-13 at 17 31 51

In fact, the image from the original designs also had that border:

Screenshot 2022-05-13 at 17 32 37

Probably the fact that it can only be spotted on Android is because the image is being rendered larger. Let me know @iamthomasbishop whether we should update all images and remove the border or add it to the new one, thanks 🙇 !

@geriux
Copy link
Member

geriux commented May 17, 2022

Hey @fluiddot 👋 This is working well 👏 I tested on both light and dark mode, although on WordPress iOS with metro running I can't seem to see the images under the Help & Support screen (only in the demo app), not sure if it's because of something I have locally or if I have to do something specific for it to work. Have you encountered this before?

@fluiddot
Copy link
Contributor Author

Hey @fluiddot 👋 This is working well 👏 I tested on both light and dark mode, although on WordPress iOS with metro running I can't seem to see the images under the Help & Support screen (only in the demo app), not sure if it's because of something I have locally or if I have to do something specific for it to work. Have you encountered this before?

Yep, I had the exact same issue when testing. I also had to use the demo app for testing the images because on the main apps the images are not displayed. I haven't investigated this issue further, but it might be related to a change we did some time ago related to resolving the assets (reference) 🤔 .

@geriux
Copy link
Member

geriux commented May 18, 2022

Yep, I had the exact same issue when testing. I also had to use the demo app for testing the images because on the main apps the images are not displayed. I haven't investigated this issue further, but it might be related to a change we did some time ago related to resolving the assets (reference) 🤔 .

I see! That explains it, thanks!

Copy link
Member

@geriux geriux left a comment

Choose a reason for hiding this comment

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

LGTM! I updated the bundle to be able to test it in WordPress iOS/Android and it works correctly, the code changes look good as well. Nice work!

I know there's a pending question related to the images in #40961 (comment) but once that's handled we are good to merge 👍

# Conflicts:
#	packages/react-native-editor/CHANGELOG.md
@fluiddot
Copy link
Contributor Author

LGTM! I updated the bundle to be able to test it in WordPress iOS/Android and it works correctly, the code changes look good as well. Nice work!

❤️

I know there's a pending question related to the images in #40961 (comment) but once that's handled we are good to merge 👍

We've discussed this issue internally, and since it's not critical, we decided to do it in a separate PR in order to not block this one. Being this said, I'll proceed to merge the changes 🎊 .

@fluiddot fluiddot merged commit 79714b3 into trunk May 19, 2022
@fluiddot fluiddot deleted the rnmobile/add/drag-and-drop-help-guide branch May 19, 2022 16:03
@github-actions github-actions bot added this to the Gutenberg 13.4 milestone May 19, 2022
geriux pushed a commit that referenced this pull request May 20, 2022
* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item
geriux added a commit that referenced this pull request May 23, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Revert cocoapods version update

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
fluiddot added a commit that referenced this pull request May 27, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.76.2

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Update react-native-editor changelog

* Update Podfile.lock

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
geriux added a commit that referenced this pull request Jun 2, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.76.2

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.76.3

* Release script: Update with changes from 'npm run core preios'

* Bump react-native-reanimated dependency

* Update changelog

* Update Changelog

* Revert removing comma

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
fluiddot added a commit that referenced this pull request Jun 3, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (#41482)

* Update react-native-editor changelog

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
youknowriad pushed a commit that referenced this pull request Jun 3, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.76.2

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Update react-native-editor changelog

* Update Podfile.lock

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
fluiddot added a commit that referenced this pull request Jun 13, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (#41482)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-gesture-handler` to version `2.3.2` (#41337)

* Update react-native-editor changelog

* Remove react-native-editor changelog duplicate entries

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
jhnstn added a commit to jhnstn/gutenberg that referenced this pull request Jun 15, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (WordPress#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (WordPress#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (WordPress#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (WordPress#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.76.2

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Ensure post title gets focused when is notified from native side (WordPress#41371)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.76.3

* Release script: Update with changes from 'npm run core preios'

* Bump react-native-reanimated dependency

* Update changelog

* Update Changelog

* Revert removing comma

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
jhnstn added a commit to jhnstn/gutenberg that referenced this pull request Jun 15, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (WordPress#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (WordPress#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (WordPress#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (WordPress#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (WordPress#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (WordPress#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (WordPress#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (WordPress#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (WordPress#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (WordPress#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (WordPress#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (WordPress#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (WordPress#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (WordPress#41482)

* Update react-native-editor changelog

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
jhnstn added a commit to jhnstn/gutenberg that referenced this pull request Jun 15, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (WordPress#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (WordPress#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (WordPress#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (WordPress#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (WordPress#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (WordPress#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (WordPress#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (WordPress#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (WordPress#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (WordPress#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (WordPress#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (WordPress#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (WordPress#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (WordPress#41482)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-gesture-handler` to version `2.3.2` (WordPress#41337)

* Update react-native-editor changelog

* Remove react-native-editor changelog duplicate entries

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
fluiddot added a commit that referenced this pull request Jun 17, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (#41482)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-gesture-handler` to version `2.3.2` (#41337)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Gallery block: Re-introduce `v1` (#41533)

* Fix isGalleryV2Enabled calculation for the native version

* Update comment in isGalleryV2Enabled function

Co-authored-by: David Calhoun <[email protected]>

Co-authored-by: David Calhoun <[email protected]>

* [RNMobile] Fix missing translations for locales that include region (only on Android) (#41685)

* Update CHANGELOG

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
Co-authored-by: David Calhoun <[email protected]>
dcalhoun added a commit that referenced this pull request Jul 8, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (#41482)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-gesture-handler` to version `2.3.2` (#41337)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Gallery block: Re-introduce `v1` (#41533)

* Fix isGalleryV2Enabled calculation for the native version

* Update comment in isGalleryV2Enabled function

Co-authored-by: David Calhoun <[email protected]>

Co-authored-by: David Calhoun <[email protected]>

* [RNMobile] Fix missing translations for locales that include region (only on Android) (#41685)

* Update CHANGELOG

* Release script: Update react-native-editor version to 1.79.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Add integration tests to cover Drag & Drop functionality (#41364)

* Add testID prop to Draggable components

* Add unit tests for Draggable component

* Set draggingId shared value before enable dragging

This change is required for testing, otherwise the dragging id is not passed when the dragging gesture begins.

* Mock generateHapticFeedback function

* Add testID to draggable chip component

* Add testID to BlockDraggable component

* Add test helpers for BlockDraggable component

Additionally, helpers related to fake timers have been added and updated in the global helpers file.

* Add drag and drop integration tests

* Update react-native-aztec mock to use AztecInputState

* [Mobile] - Add E2E tests for the Drag & Drop blocks feature (#41368)

* Mobile - Add E2E tests for the Drag & Drop blocks feature

* Update longPress action

* Use clickIfClickable

* Use longPress instead of press

* Fix clipboard typo

* Add setClipboard and clearClipboard helpers

* Mobile - Skip some of the Drag & Drop E2E on iOS (#41529)

* Mobile - Skip some of the Drag & Drop E2E on iOS

* Replace if condition to use onlyOnAndroid wrapper instead

* where it can change to use clickIfClickable(), add new param for waitForVisible() to control return value (#41367)

Co-authored-by: jos <[email protected]>

* [RNMobile] Add 'Insert from URL' option to Video block (#41493)

* Add onSelectURL function to mobile Video block edit

* Add notices store to mobile Video block

* Display Insert from URL in Video block media options menu

* Allow native video block to use Embed block for embeddable URLs

* Update native Video block src onSelectURL attribute

* Update CHANGELOG

* Upgrade Aztec to v1.5.9 (#41828)

* fix: Image block preserves alt text from media library (#41839)

* fix: Image block preserves alt text from media library

When the alt text for a media item is present in the media library, that
value should be copied into the Image block when inserted. This behavior
avoids the need to re-enter the alt text for each image inserted into
the post content.

* fix: Allow Media with and without alt text

Previous code required an alt text value, which broken existing code.
This overrides the method to support both contexts. It also updates
existing code to use the same method of generating media throughout the
source.

* test: Update alt text for demo editor test data

Consistently setting the alt text for all platforms will likely help
avoid confusion.

* test: Update outdated test fixture data

The demo editor now returns an alt text for the test image media.

* docs: Update changelog

* [RNMobile] Implement recovery option for invalid blocks (#41988)

If a block's validation fails within the mobile app, users are shown an error but not provided with any options for recovering the block. This PR introduces an option for users to attempt block recovery. They'll be prompted to tap on a block if they wish to attempt recovery.

* docs: Update change log

* [RNMobile] Upgrades Gradle to 7.4.2 & Android Gradle Plugin to 7.2.1 (#42136)

* Update Gradle to 7.4.1

* Update AGP to 7.2.1

* Update Aztec-Android version to v1.6.0 (#42243)

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
Co-authored-by: Oguz Kocer <[email protected]>
dcalhoun added a commit that referenced this pull request Jul 20, 2022
* Release script: Update react-native-editor version to 1.76.0

* Release script: Update with changes from 'npm run core preios'

* Update Changelog

* Release script: Update react-native-editor version to 1.76.1

* Release script: Update with changes from 'npm run core preios'

* [Mobile] - BlockList - Add internal onLayout from CellRendererComponent to BlockListItemCell (#41105)

* Mobile - BlockList - Pass FlatList internal onLayout through CellRendererComponent

* Mobile - Update onLayout naming for BlockListItemCell

* [Mobile] - Fix Drag & Drop Chip positioning issue with RTL languages (#41053)

* Mobile - Fix - Drag & drop chip issue with RTL languages

* Mobile - BlockDraggable - Rename maxWidth variable to contentWidth

* Mobile - BlockDraggable - Add custom exiting animation that uses the same functionality as ZoomOutEasyDown but customizing the translateX value taking into account RTL languages.

* [RNMobile] Add drag & drop help guide in Help & Support screen (#40961)

* Add drag & drop help guide

* Update content of help screen related to moving blocks

* Update drand-and-drop images

* Update styles of heading component of help screen

* Add HelpDetailBadge component

This component will be rendered in `HelpDetailSectionHeadingText` component via the `badge` prop.

* Add NEW badge to move blocks help section

* Optimize drag-and-drop images

* Add move-blocks icon to Help & Support screen

* Update react-native-editor changelog

* Add HelpSectionTitle component

* Prevent rendering separator on last help topic item

* [RNMobile] Fix drag mode not being enabled when long-pressing over Shortcode block (#41155)

* Add prop for disabling suggestions button

* Use allowed formats in format types calculation

* Add RichText version to PlainText component

* Use experimental version of PlainText in Shortcode block

* Add disableAutocorrection prop to RichText

* Disable autocorrection in Shortcode block

* Update PlainText props in Shortcode block

* Use pre as tagName in PlainText

* Rename replaceLineBreaks function

* Update shortcode block unit tests

* Prevent text input focus when selecting Shortcode block

* Force text color in Shortcode block

* Remove tagName prop from PlainText component

* Mobile - Update changelog

* Translate NEW badge in Move blocks help screen

* Release script: Update react-native-editor version to 1.77.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Improve text read by screen readers for BottomSheetSelectControl  (#41036)

Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.

* [RNMobile] Add 'Insert from URL' option to Image block (#40334)

* Add 'Insert from URL' option to Video and Image blocks

* Update code style from linting

* Improve test cases for Media Upload capture options

* Fix whitespace issue

* Update Media Upload option tests to be asynchronous

* Update native image block to use correct image URL

* Add error handling for invalid URLs to native Image block

* Clear invalid URL error on Image URL success

* Fix synchronicity of Media Upload option tests

* Add check for URL handler to native Image block picker options

* Update code style

* Remove Video block from urlSource options

Why: to be introduced in a later PR

* Remove URL option from Video block for Media Upload test

* Use Notice snackbar for native Image block error handling

* Update Image/Media Upload code style and helpers

* Use getImage to determine if URL is a valid image within Image block

* Add loading indicator and isURL check to native Image block URL behavior

* Add loading indicator to native Image block media placeholder

* Fix whitespace issue in native Image block code style

* Reuse native Image block loading indicator

* Use undefined dimension attributes for the native Image block URL behavior

Co-authored-by: Derek Blank <[email protected]>

* [RNMobile] - E2E Simplify heading and lists blocks functions (#40670)

* update tests using paragraph, heading and list blocks

* fix slash inserter tests to work in ci

* lint fixes

* wait for ordered list to appear

* lint fixes

* extra click only on local env

* wait to get backspace click reflected

* re-add extra click only for local env

* add wait to wait for backspace key to be reflected

* lint fixes

* break function, set position to get list block

* lint fixes

* use correct params, update function name

* lint fixes

* make maxIteration a parameter for isElementVisible

* update xpath for list block

* utilize waitForVisible for isElementVisible

* lint fixes

* add wait to getNumberOfParagraphBlocks and update xpath for android list block

* update edit text xpath to be read from any level

Co-authored-by: jos <[email protected]>

* Add ruby version file (#41013)

Use same version of ruby that is used on WP iOS

* [RNMobile] Improvements to Getting Started Guides (#40964)

* Update with copy from Gutenberg Mobile

Gutenberg Mobile's readme had some copy in the troubleshooting section that wasn't included in Gutenberg's how-to: https://github.com/wordpress-mobile/gutenberg-mobile/edit/trunk/README.md

This commit fixes that issue by updating Gutenberg's how-to with the latest from Gutenberg Mobile.

* Tweak wording, update inconsistent capitalisation

* Tweaks to copy and formatting

With this commit, I've tidied up some of the copy, attempting to make the instructions as concise and helpful as possible. I've also set the images to the same width to tidy up the overall look of the document (the images will appear small on mobile devices, but can be tapped on to get the full image).

* Set all images to fixed width, for consistency

* Rearrange sections to improve overall flow

- The "Unit Tests" is moved towards the bottom of the document, so that's it's closer to the instructions for integration tests. the document flows as follows:
- The steps for installing Xcode are moved under the "iOS" section.
- The overall flow of the document has been updated to the following: Clone Gutenberg > iOS > Android > Tests

* Add details about recommended JDK

* Add details about Cocoapods

* Refine instructions for installing Cocoapods

* Note `ffi` may already be installed

Some versions of Ruby may not require the `ffi` to be manually installed, which is noted with this commit.

* update expected html for file block (#41300)

Co-authored-by: jos <[email protected]>

* Add waitForVisible() to all blocks (#41126)

* add waits to all block - 1st try

* fix failing tests

* correct if else condition

* fix failing cover block test

* update spaces

* update to use new click helper

* wait for blocks to be visible first in getFirstBlock and getLastBlock

* remove length as a parameter

* update timing for long press since it's failing intermittently in ci

* remove deleted param, revert space changes

* remove redundant code

* exit function once condition is met

* increse wait time for long press

* remove unneccesary condition, update message, return click value

Co-authored-by: jos <[email protected]>

* Update CHANGELOG

* Revert "update expected html for file block (#41300)"

This reverts commit a046a61.

* [RNMobile] Ensure post title gets focused when is notified from native side (#41371)

* Release script: Update react-native-editor version to 1.77.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-reanimated` version to `2.4.1-wp-3` (#41482)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Bump `react-native-gesture-handler` to version `2.3.2` (#41337)

* Update react-native-editor changelog

* Release script: Update react-native-editor version to 1.78.1

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Gallery block: Re-introduce `v1` (#41533)

* Fix isGalleryV2Enabled calculation for the native version

* Update comment in isGalleryV2Enabled function

Co-authored-by: David Calhoun <[email protected]>

Co-authored-by: David Calhoun <[email protected]>

* [RNMobile] Fix missing translations for locales that include region (only on Android) (#41685)

* Update CHANGELOG

* Release script: Update react-native-editor version to 1.79.0

* Release script: Update with changes from 'npm run core preios'

* [RNMobile] Add integration tests to cover Drag & Drop functionality (#41364)

* Add testID prop to Draggable components

* Add unit tests for Draggable component

* Set draggingId shared value before enable dragging

This change is required for testing, otherwise the dragging id is not passed when the dragging gesture begins.

* Mock generateHapticFeedback function

* Add testID to draggable chip component

* Add testID to BlockDraggable component

* Add test helpers for BlockDraggable component

Additionally, helpers related to fake timers have been added and updated in the global helpers file.

* Add drag and drop integration tests

* Update react-native-aztec mock to use AztecInputState

* [Mobile] - Add E2E tests for the Drag & Drop blocks feature (#41368)

* Mobile - Add E2E tests for the Drag & Drop blocks feature

* Update longPress action

* Use clickIfClickable

* Use longPress instead of press

* Fix clipboard typo

* Add setClipboard and clearClipboard helpers

* Mobile - Skip some of the Drag & Drop E2E on iOS (#41529)

* Mobile - Skip some of the Drag & Drop E2E on iOS

* Replace if condition to use onlyOnAndroid wrapper instead

* where it can change to use clickIfClickable(), add new param for waitForVisible() to control return value (#41367)

Co-authored-by: jos <[email protected]>

* [RNMobile] Add 'Insert from URL' option to Video block (#41493)

* Add onSelectURL function to mobile Video block edit

* Add notices store to mobile Video block

* Display Insert from URL in Video block media options menu

* Allow native video block to use Embed block for embeddable URLs

* Update native Video block src onSelectURL attribute

* Update CHANGELOG

* Upgrade Aztec to v1.5.9 (#41828)

* fix: Image block preserves alt text from media library (#41839)

* fix: Image block preserves alt text from media library

When the alt text for a media item is present in the media library, that
value should be copied into the Image block when inserted. This behavior
avoids the need to re-enter the alt text for each image inserted into
the post content.

* fix: Allow Media with and without alt text

Previous code required an alt text value, which broken existing code.
This overrides the method to support both contexts. It also updates
existing code to use the same method of generating media throughout the
source.

* test: Update alt text for demo editor test data

Consistently setting the alt text for all platforms will likely help
avoid confusion.

* test: Update outdated test fixture data

The demo editor now returns an alt text for the test image media.

* docs: Update changelog

* [RNMobile] Implement recovery option for invalid blocks (#41988)

If a block's validation fails within the mobile app, users are shown an error but not provided with any options for recovering the block. This PR introduces an option for users to attempt block recovery. They'll be prompted to tap on a block if they wish to attempt recovery.

* docs: Update change log

* [RNMobile] Upgrades Gradle to 7.4.2 & Android Gradle Plugin to 7.2.1 (#42136)

* Update Gradle to 7.4.1

* Update AGP to 7.2.1

* Update Aztec-Android version to v1.6.0 (#42243)

* Release script: Update react-native-editor version to 1.79.1

* Release script: Update with changes from 'npm run core preios'

* fix: Workaround Android 12 webview crash (#42517)

* fix: Workaround Android 12 webview crash

A crash occurred due to combining webviews with Android 12's new scroll
overflow behavior. Applying `opacity: 0.99` prevents the crash from
occurring. This change should be viewed as a temporary fix while we
await a more appropriate solution for the `react-native-webview`
library.

react-native-webview/react-native-webview#1915 (comment)

* docs: Add change log entry

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>
Co-authored-by: Siobhan <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Derek Blank <[email protected]>
Co-authored-by: Jos <[email protected]>
Co-authored-by: jos <[email protected]>
Co-authored-by: Jason Johnston <[email protected]>
Co-authored-by: Oguz Kocer <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Drag and Drop Drag and drop functionality when working with blocks Mobile App - Automation Label used to initiate Mobile App PR Automation 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.

3 participants