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

[IOS][ENHANCEMENT] - Adding locale prop to DatePickerIOS #16639

Closed

Conversation

robertpaul01
Copy link
Contributor

Motivation

While building a React Native application, I've come across the use case of wanting to set a specific locale for DatePickers irrespective of the users OS region setting. Since this is a feature available to native DatePicker components, I think it would be helpful to expose this in React Native as well.

Test Plan

Testing can be done by passing a locale prop to a DatePickerIOS. Example:

<DatePickerIOS
  date={this.state.date}
  mode="date"
  locale="fr_FR"
  onDateChange={date => this.setState({ date: date })}
/>

Release Notes

[IOS][ENHANCEMENT][DatePickerIOS] - Adding a locale prop.

@pull-bot
Copy link

pull-bot commented Nov 2, 2017

@facebook-github-bot label Android

Attention: @shergin

Generated by 🚫 dangerJS

@@ -127,6 +132,7 @@ const DatePickerIOS = createReactClass({
ref={ picker => { this._picker = picker; } }
style={styles.datePickerIOS}
date={props.date.getTime()}
locale={props.locale ? props.locale : undefined}

Choose a reason for hiding this comment

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

Can we add something here which will take user locale by default ?

Note: no need to use ternary here, just use props.locale and add user locale in defaultProps.

Copy link
Contributor Author

@robertpaul01 robertpaul01 Nov 2, 2017

Choose a reason for hiding this comment

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

If the locale isn't specified, the default device locale will be used.

Choose a reason for hiding this comment

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

Awesome

@chirag04
Copy link
Contributor

chirag04 commented Nov 2, 2017

@robertpaul01 are you using this to force 24hr format for the date time picker using the NL locale? just curious.

@robertpaul01
Copy link
Contributor Author

No, this is to allow certain date formats to be used such as dd/mm/yyyy or mm/dd/yyyy

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Nov 4, 2017
@janicduplessis
Copy link
Contributor

@robertpaul01 Thanks for the PR! What happens if you pass an invalid locale string?

@robertpaul01
Copy link
Contributor Author

If the string is invalid, it will use the default device locale.

@janicduplessis
Copy link
Contributor

@robertpaul01 Looks like your PR changes file permissions (100644 → 100755), can you revert this?

@robertpaul01
Copy link
Contributor Author

@janicduplessis I changed the permissions back. I overwrote the previous commit.

@janicduplessis
Copy link
Contributor

@facebook-github-bot shipit

@facebook-github-bot facebook-github-bot added the Import Started This pull request has been imported. This does not imply the PR has been approved. label Nov 4, 2017
Copy link
Contributor

@facebook-github-bot facebook-github-bot left a comment

Choose a reason for hiding this comment

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

@janicduplessis is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

cdlewis pushed a commit to cdlewis/react-native that referenced this pull request Nov 19, 2017
Summary:
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.

Help us understand your motivation by explaining why you decided to make this change.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

While building a React Native application, I've come across the use case of wanting to set a specific locale for DatePickers irrespective of the users OS region setting. Since this is a feature available to native DatePicker components, I think it would be helpful to expose this in React Native as well.

Testing can be done by passing a `locale` prop to a DatePickerIOS. Example:

```
<DatePickerIOS
  date={this.state.date}
  mode="date"
  locale="fr_FR"
  onDateChange={date => this.setState({ date: date })}
/>
```

<!--
Help reviewers and the release process by writing your own release notes

**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**

  CATEGORY
[----------]        TYPE
[ CLI      ]   [-------------]      LOCATION
[ DOCS     ]   [ BREAKING    ]   [-------------]
[ GENERAl  ]   [ BUGFIX      ]   [-{Component}-]
[ INTERNAL ]   [ ENHANCEMENT ]   [ {File}      ]
[ IOS      ]   [ FEATURE     ]   [ {Directory} ]   |-----------|
[ ANDROID  ]   [ MINOR       ]   [ {Framework} ] - | {Message} |
[----------]   [-------------]   [-------------]   |-----------|

[CATEGORY] [TYPE] [LOCATION] - MESSAGE

 EXAMPLES:

 [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
 [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
 [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
 [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
 [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
 [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
[IOS][ENHANCEMENT][DatePickerIOS] - Adding a locale prop.
Closes facebook#16639

Differential Revision: D6241981

Pulled By: hramos

fbshipit-source-id: 77b1b85c09f3e12d6b3e103b3d1ffd1f12e2cea9
@Gongreg
Copy link

Gongreg commented Nov 20, 2017

@robertpaul01 if you want to add example for locale, you can take it from my pull request. I opened it on August but nobody looked into it.

@robertpaul01 robertpaul01 deleted the DatePickerIOS/Locale-Prop branch November 30, 2017 08:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Import Started This pull request has been imported. This does not imply the PR has been approved.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants