From d9f5666eee766e5cbd7a96b1f2e7f6e4a73ebed5 Mon Sep 17 00:00:00 2001 From: Rocio Perez-Cano Date: Fri, 2 Dec 2022 16:30:18 -0500 Subject: [PATCH 1/3] Address comments from original PR --- src/components/Picker/index.js | 32 ++++++++++++++------------------ src/styles/variables.js | 1 + 2 files changed, 15 insertions(+), 18 deletions(-) diff --git a/src/components/Picker/index.js b/src/components/Picker/index.js index 3aaab0e0188b8..28bfea282ddd3 100644 --- a/src/components/Picker/index.js +++ b/src/components/Picker/index.js @@ -9,6 +9,7 @@ import FormHelpMessage from '../FormHelpMessage'; import Text from '../Text'; import CONST from '../../CONST'; import styles from '../../styles/styles'; +import variables from '../../styles/variables'; import pickerStyles from './pickerStyles'; import getOperatingSystem from '../../libs/getOperatingSystem'; @@ -104,28 +105,23 @@ class Picker extends PureComponent { }; this.onInputChange = this.onInputChange.bind(this); - this.placeholder = this.props.placeholder; - this.items = this.props.items; + + // Windows will reuse the text color of the select for each one of the options + // so we might need to color accordingly so it doesn't blend with the background. + this.placeholder = _.isEmpty(this.placeholder) ? {} : { + ...this.props.placeholder, + color: variables.pickerOptionsTextColor, + }; + this.items = _.map(this.items, item => ( + { + ...item, + color: variables.pickerOptionsTextColor, + } + )); } componentDidMount() { this.setDefaultValue(); - - // Windows will reuse the text color of the select for each one of the options - // so we might need to color accordingly so it doesn't blend with the background. - if (getOperatingSystem() === CONST.OS.WINDOWS) { - this.placeholder = _.isEmpty(this.placeholder) ? {} : { - ...this.placeholder, - color: '#002140', - }; - - this.items = _.map(this.items, item => ( - { - ...item, - color: '#002140', - } - )); - } } componentDidUpdate(prevProps) { diff --git a/src/styles/variables.js b/src/styles/variables.js index 4cf4740749c71..ba72ff3ff77e1 100644 --- a/src/styles/variables.js +++ b/src/styles/variables.js @@ -81,4 +81,5 @@ export default { INACTIVE_LABEL_TRANSLATE_Y: getValueUsingPixelRatio(16, 21), sliderBarHeight: 8, sliderKnobSize: 26, + pickerOptionsTextColor: '#002140', }; From cc072f75eb722382d8d7f3412ecd5b529bcb3958 Mon Sep 17 00:00:00 2001 From: Rocio Perez-Cano Date: Mon, 5 Dec 2022 15:02:52 -0500 Subject: [PATCH 2/3] Remove unused imports --- src/components/Picker/index.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/Picker/index.js b/src/components/Picker/index.js index 28bfea282ddd3..b707fac06dc88 100644 --- a/src/components/Picker/index.js +++ b/src/components/Picker/index.js @@ -7,11 +7,9 @@ import Icon from '../Icon'; import * as Expensicons from '../Icon/Expensicons'; import FormHelpMessage from '../FormHelpMessage'; import Text from '../Text'; -import CONST from '../../CONST'; import styles from '../../styles/styles'; import variables from '../../styles/variables'; import pickerStyles from './pickerStyles'; -import getOperatingSystem from '../../libs/getOperatingSystem'; const propTypes = { /** Picker label */ From 3024576d39933707cafdae1a97ca356f7fd74a02 Mon Sep 17 00:00:00 2001 From: Rocio Perez-Cano Date: Mon, 5 Dec 2022 15:17:00 -0500 Subject: [PATCH 3/3] Fix after testing --- src/components/Picker/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Picker/index.js b/src/components/Picker/index.js index b707fac06dc88..e49abef260c24 100644 --- a/src/components/Picker/index.js +++ b/src/components/Picker/index.js @@ -106,11 +106,11 @@ class Picker extends PureComponent { // Windows will reuse the text color of the select for each one of the options // so we might need to color accordingly so it doesn't blend with the background. - this.placeholder = _.isEmpty(this.placeholder) ? {} : { + this.placeholder = _.isEmpty(this.props.placeholder) ? {} : { ...this.props.placeholder, color: variables.pickerOptionsTextColor, }; - this.items = _.map(this.items, item => ( + this.items = _.map(this.props.items, item => ( { ...item, color: variables.pickerOptionsTextColor,