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 setMinHeightToMaxHeight prop to bottom sheet #29274

Merged
merged 3 commits into from
Mar 22, 2021
Merged

[RNMobile] Add setMinHeightToMaxHeight prop to bottom sheet #29274

merged 3 commits into from
Mar 22, 2021

Conversation

jhnstn
Copy link
Contributor

@jhnstn jhnstn commented Feb 23, 2021

Description

This adds the ability to set the minHeight equal to the maxHeight of the BottomSheet component. This is useful when trying to render dynamic content within the bottom sheet. The current need is for Inserter Block Search project.

How has this been tested?

Note: The Inserter Block Search is currently behind the __DEV__ flag.

  1. Start the Mobile Gutenberg demo app
  2. Open the mobile editor
  3. Open the block inserter menu
  4. Press on "Search Blocks"
  5. Enter a search query that returns few results e.g. img
  6. The bottom sheet height should not change.

Screenshots

Before:

Android iPhone

After:

Android iPhone

Types of changes

New feature (non-breaking change which adds functionality)

  • Adds a setMinHeightToMaxHeight prop to the BottomSheet component. When true the bottom sheet will have a static height equal to the max height. example:
<BottomSheet setMinHeightToMaxHeight={ true } > 

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@github-actions
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @jhnstn! In case you missed it, we'd love to have you join us in our Slack community, where we hold regularly weekly meetings open to anyone to coordinate with each other.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Feb 23, 2021
@jhnstn jhnstn changed the title Add setMinHeightToMaxHeight prop to bottom sheet [RNMobile] Add setMinHeightToMaxHeight prop to bottom sheet Feb 24, 2021
@jhnstn jhnstn marked this pull request as draft February 24, 2021 23:10
Base automatically changed from master to trunk March 1, 2021 15:46
@jhnstn jhnstn marked this pull request as ready for review March 19, 2021 20:18
@AmandaRiu AmandaRiu self-assigned this Mar 22, 2021
Copy link
Contributor

@AmandaRiu AmandaRiu left a comment

Choose a reason for hiding this comment

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

@jhnstn Changes look good. Tested on an Android emulator and iOS simulator in portrait and landscape mode. Unrelated to this PR I noticed that in landscape mode on Android, the text entry goes into full screen mode. I wonder if there is a way to prevent this with React Native so the results always stay visible as the user it typing:

Screen.Recording.2021-03-22.at.4.54.11.PM.mov

PR is approved and ready for merge. The gutenberg-mobile PR just needs to be updated with the merge commit and then that one will be ready for final review as well. Since this is a feature available in devMode only, then the gutenberg-mobile PR doesn't require being merged and could just be closed.

@AmandaRiu AmandaRiu merged commit 186f52a into WordPress:trunk Mar 22, 2021
@AmandaRiu AmandaRiu added the Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change) label Mar 22, 2021
@github-actions github-actions bot added this to the Gutenberg 10.3 milestone Mar 22, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository 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.

2 participants