[native] Increase clickable region of `ColorSelector` Save button
ClosedPublic
Actions

Authored by • abosh on Jun 30 2022, 10:54 AM.

Details

Reviewers

atul
tomek

Commits

rCOMM0e9230adf540: [native] Increase clickable region of `ColorSelector` Save button

Summary

Quick fix before finalizing ColorSelector. Noticed a bug where the "Save" button in the ColorSelector was only being clicked when clicking on the "Save" text, and not anywhere on the button.

Fixed this by removing the outer View container and replacing it with a TouchableOpacity, allowing the entire region to be clickable and execute the onPress function.

What it looks like now:

Test Plan

Looks and works as expected on iOS.

Diff Detail

Repository

rCOMM Comm

Lint

Lint Not Applicable

Unit

Tests Not Applicable

Event Timeline

• abosh created this revision.Jun 30 2022, 10:54 AM

Herald added subscribers: • adrian, ashoat. · View Herald TranscriptJun 30 2022, 10:54 AM

• abosh edited the summary of this revision. (Show Details)Jun 30 2022, 10:55 AM

• abosh added inline comments.

native/components/color-selector.react.js
94–97 ↗	(On Diff #14039)	This styling directly mimics the styling in `EditPassword`, which has a very similar Save button:

• abosh attached a referenced file: F88526: image.png. (Show Details)Jun 30 2022, 10:57 AM

• abosh attached a referenced file: F88525: image.png. (Show Details)

Harbormaster completed remote builds in B10168: Diff 14039.Jun 30 2022, 11:07 AM

• abosh requested review of this revision.Jun 30 2022, 11:07 AM

Running into some bugs with the onPress function on Android that may have been introduced as a result of this change (this bug existed before but it returned now). Will update as I investigate.

Never mind, resolved the bug. It was something in ColorPickerModal that was causing the issue. The Save button works as expected on iOS and Android.

Updated styling to make the button look good on Nexus 5 (which is a huge/wide screen). The EditPassword styling did not work with this large of a phone screen.

Harbormaster failed remote builds in B10169: Diff 14040!Jun 30 2022, 11:28 AM

Harbormaster completed remote builds in B10169: Diff 14040.Jun 30 2022, 11:39 AM

tomek accepted this revision.Jul 1 2022, 7:38 AM

This revision is now accepted and ready to land.Jul 1 2022, 7:38 AM

• abosh added 1 blocking reviewer(s): atul.Jul 1 2022, 7:51 AM

This revision now requires review to proceed.Jul 1 2022, 7:51 AM

atul accepted this revision.Jul 5 2022, 9:10 AM

This revision is now accepted and ready to land.Jul 5 2022, 9:10 AM

Closed by commit rCOMM0e9230adf540: [native] Increase clickable region of `ColorSelector` Save button (authored by • abosh). · Explain WhyJul 5 2022, 11:04 AM

This revision was automatically updated to reflect the committed changes.

• abosh added a commit: rCOMM0e9230adf540: [native] Increase clickable region of `ColorSelector` Save button.