Skip to content

Commit

Permalink
Merge pull request #6837 from mateusbra/rename-ExpensiPicker
Browse files Browse the repository at this point in the history
Rename ExpensiPicker
  • Loading branch information
puneetlath authored Jan 4, 2022
2 parents 6315f10 + 7e932d7 commit 667570c
Show file tree
Hide file tree
Showing 19 changed files with 162 additions and 162 deletions.
4 changes: 2 additions & 2 deletions src/components/AddPlaidBankAccount.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import canFocusInputOnScreenFocus from '../libs/canFocusInputOnScreenFocus';
import themeColors from '../styles/themes/default';
import compose from '../libs/compose';
import withLocalize, {withLocalizePropTypes} from './withLocalize';
import ExpensiPicker from './ExpensiPicker';
import Picker from './Picker';
import Text from './Text';
import * as ReimbursementAccountUtils from '../libs/ReimbursementAccountUtils';
import ReimbursementAccountForm from '../pages/ReimbursementAccount/ReimbursementAccountForm';
Expand Down Expand Up @@ -241,7 +241,7 @@ class AddPlaidBankAccount extends React.Component {
<Text style={[styles.ml3, styles.textStrong]}>{this.state.institution.name}</Text>
</View>
<View style={[styles.mb5]}>
<ExpensiPicker
<Picker
label={this.props.translate('addPersonalBankAccountPage.chooseAccountLabel')}
onChange={(index) => {
this.setState({selectedIndex: Number(index)});
Expand Down
79 changes: 0 additions & 79 deletions src/components/ExpensiPicker.js

This file was deleted.

4 changes: 2 additions & 2 deletions src/components/LocalePicker.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import ONYXKEYS from '../ONYXKEYS';
import CONST from '../CONST';
import Permissions from '../libs/Permissions';
import * as Localize from '../libs/Localize';
import ExpensiPicker from './ExpensiPicker';
import Picker from './Picker';

const propTypes = {
/** Indicates which locale the user currently has selected */
Expand Down Expand Up @@ -47,7 +47,7 @@ const LocalePicker = (props) => {
}

return (
<ExpensiPicker
<Picker
label={props.size === 'normal' ? props.translate('preferencesPage.language') : null}
onChange={(locale) => {
if (locale === props.preferredLocale) {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import Icon from '../Icon';
import styles from '../../styles/styles';
import * as Expensicons from '../Icon/Expensicons';
import Icon from '../../Icon';
import styles from '../../../styles/styles';
import * as Expensicons from '../../Icon/Expensicons';

const propTypes = {
/** A callback method that is called when the value changes and it received the selected value as an argument */
Expand Down
11 changes: 11 additions & 0 deletions src/components/Picker/BasePicker/basePickerStyles/index.android.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import styles from '../../../../styles/styles';

const pickerStyles = (disabled, error, focused) => ({
...styles.picker(disabled, error, focused),
inputAndroid: {
...styles.picker(disabled, error, focused).inputNative,
paddingLeft: 12,
},
});

export default pickerStyles;
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import styles from '../../../../styles/styles';

const pickerStyles = (disabled, error, focused) => ({
...styles.picker(disabled, error, focused),
inputIOS: styles.picker(disabled, error, focused).inputNative,
});

export default pickerStyles;
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import CONST from '../../../CONST';
import getBrowser from '../../../libs/getBrowser';
import styles from '../../../styles/styles';
import CONST from '../../../../CONST';
import getBrowser from '../../../../libs/getBrowser';
import styles from '../../../../styles/styles';

const pickerStylesWeb = () => {
if (CONST.BROWSER.FIREFOX === getBrowser()) {
Expand All @@ -12,9 +12,9 @@ const pickerStylesWeb = () => {
};

const pickerStyles = (disabled, error, focused) => ({
...styles.expensiPicker(disabled, error, focused),
...styles.picker(disabled, error, focused),
inputWeb: {
...styles.expensiPicker(disabled, error, focused).inputWeb,
...styles.picker(disabled, error, focused).inputWeb,
...pickerStylesWeb(),
},
});
Expand Down
33 changes: 33 additions & 0 deletions src/components/Picker/BasePicker/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React from 'react';
import RNPickerSelect from 'react-native-picker-select';

import styles from '../../../styles/styles';
import * as basePickerPropTypes from './basePickerPropTypes';
import basePickerStyles from './basePickerStyles';

const BasePicker = props => (
<RNPickerSelect
onValueChange={props.onChange}
items={props.items}
style={props.size === 'normal' ? basePickerStyles(props.disabled, props.hasError, props.focused) : styles.pickerSmall}
useNativeAndroidPickerStyle={false}
placeholder={props.placeholder}
value={props.value}
Icon={() => props.icon(props.size)}
disabled={props.disabled}
fixAndroidTouchableBug
onOpen={props.onOpen}
onClose={props.onClose}
pickerProps={{
onFocus: props.onOpen,
onBlur: props.onClose,
}}
/>
);


BasePicker.propTypes = basePickerPropTypes.propTypes;
BasePicker.defaultProps = basePickerPropTypes.defaultProps;
BasePicker.displayName = 'BasePicker';

export default BasePicker;
106 changes: 76 additions & 30 deletions src/components/Picker/index.js
Original file line number Diff line number Diff line change
@@ -1,33 +1,79 @@
import React from 'react';
import RNPickerSelect from 'react-native-picker-select';

import _ from 'underscore';
import React, {PureComponent} from 'react';
import {View} from 'react-native';
import PropTypes from 'prop-types';
import BasePicker from './BasePicker';
import Text from '../Text';
import styles from '../../styles/styles';
import * as pickerPropTypes from './pickerPropTypes';
import pickerStyles from './pickerStyles';

const Picker = props => (
<RNPickerSelect
onValueChange={props.onChange}
items={props.items}
style={props.size === 'normal' ? pickerStyles(props.disabled, props.hasError, props.focused) : styles.pickerSmall}
useNativeAndroidPickerStyle={false}
placeholder={props.placeholder}
value={props.value}
Icon={() => props.icon(props.size)}
disabled={props.disabled}
fixAndroidTouchableBug
onOpen={props.onOpen}
onClose={props.onClose}
pickerProps={{
onFocus: props.onOpen,
onBlur: props.onClose,
}}
/>
);


Picker.propTypes = pickerPropTypes.propTypes;
Picker.defaultProps = pickerPropTypes.defaultProps;
Picker.displayName = 'Picker';
import InlineErrorText from '../InlineErrorText';

const propTypes = {
/** Picker label */
label: PropTypes.string,

/** Should the picker appear disabled? */
isDisabled: PropTypes.bool,

/** Should the input be styled for errors */
hasError: PropTypes.bool,

/** Error text to display */
errorText: PropTypes.string,

/** Customize the Picker container */
containerStyles: PropTypes.arrayOf(PropTypes.object),
};

const defaultProps = {
label: '',
isDisabled: false,
hasError: false,
errorText: '',
containerStyles: [],
};

class Picker extends PureComponent {
constructor() {
super();
this.state = {
isOpen: false,
};
}

render() {
const pickerProps = _.omit(this.props, _.keys(propTypes));
return (
<>
<View
style={[
styles.pickerContainer,
this.props.isDisabled && styles.inputDisabled,
]}
>
{this.props.label && (
<Text style={[styles.pickerLabel, styles.textLabelSupporting]}>{this.props.label}</Text>
)}
<BasePicker
onOpen={() => this.setState({isOpen: true})}
onClose={() => this.setState({isOpen: false})}
disabled={this.props.isDisabled}
focused={this.state.isOpen}
hasError={this.props.hasError}
// eslint-disable-next-line react/jsx-props-no-spreading
{...pickerProps}
/>
</View>
{!_.isEmpty(this.props.errorText) && (
<InlineErrorText>
{this.props.errorText}
</InlineErrorText>
)}
</>
);
}
}

Picker.propTypes = propTypes;
Picker.defaultProps = defaultProps;

export default Picker;
11 changes: 0 additions & 11 deletions src/components/Picker/pickerStyles/index.android.js

This file was deleted.

8 changes: 0 additions & 8 deletions src/components/Picker/pickerStyles/index.ios.js

This file was deleted.

4 changes: 2 additions & 2 deletions src/components/StatePicker.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import _ from 'underscore';
import React from 'react';
import PropTypes from 'prop-types';
import {CONST} from 'expensify-common/lib/CONST';
import ExpensiPicker from './ExpensiPicker';
import Picker from './Picker';
import withLocalize, {withLocalizePropTypes} from './withLocalize';

const STATES = _.map(CONST.STATES, ({stateISO}) => ({
Expand All @@ -29,7 +29,7 @@ const defaultProps = {
};

const StatePicker = props => (
<ExpensiPicker
<Picker
placeholder={{value: '', label: '-'}}
items={STATES}
onChange={props.onChange}
Expand Down
4 changes: 2 additions & 2 deletions src/pages/ReimbursementAccount/CompanyStep.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize
import * as ValidationUtils from '../../libs/ValidationUtils';
import compose from '../../libs/compose';
import ONYXKEYS from '../../ONYXKEYS';
import ExpensiPicker from '../../components/ExpensiPicker';
import Picker from '../../components/Picker';
import * as ReimbursementAccountUtils from '../../libs/ReimbursementAccountUtils';
import reimbursementAccountPropTypes from './reimbursementAccountPropTypes';
import ReimbursementAccountForm from './ReimbursementAccountForm';
Expand Down Expand Up @@ -263,7 +263,7 @@ class CompanyStep extends React.Component {
maxLength={CONST.BANK_ACCOUNT.MAX_LENGTH.TAX_ID_NUMBER}
/>
<View style={styles.mt4}>
<ExpensiPicker
<Picker
label={this.props.translate('companyStep.companyType')}
items={_.map(this.props.translate('companyStep.incorporationTypes'), (label, value) => ({value, label}))}
onChange={value => this.clearErrorAndSetValue('incorporationType', value)}
Expand Down
4 changes: 2 additions & 2 deletions src/pages/ReportDetailsPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ import * as Report from '../libs/actions/Report';
import * as Expensicons from '../components/Icon/Expensicons';
import ROUTES from '../ROUTES';
import MenuItem from '../components/MenuItem';
import Picker from '../components/Picker';
import Text from '../components/Text';
import ExpensiPicker from '../components/ExpensiPicker';

const propTypes = {
...withLocalizePropTypes,
Expand Down Expand Up @@ -166,7 +166,7 @@ class ReportDetailsPage extends Component {
</View>
<View>
<View style={[styles.mb5]}>
<ExpensiPicker
<Picker
// eslint-disable-next-line max-len
label={this.props.translate('reportDetailsPage.notificationPreferencesDescription')}
onChange={(notificationPreference) => {
Expand Down
Loading

0 comments on commit 667570c

Please sign in to comment.