Skip to content

Commit

Permalink
- Adding locale prop to DatePickerIOS
Browse files Browse the repository at this point in the history
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 #16639

Differential Revision: D6241981

Pulled By: hramos

fbshipit-source-id: 77b1b85c09f3e12d6b3e103b3d1ffd1f12e2cea9
  • Loading branch information
robertpaul01 authored and facebook-github-bot committed Nov 4, 2017
1 parent 38b96cd commit fd9c361
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 0 deletions.
7 changes: 7 additions & 0 deletions Libraries/Components/DatePicker/DatePickerIOS.ios.js
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,11 @@ const DatePickerIOS = createReactClass({
*/
mode: PropTypes.oneOf(['date', 'time', 'datetime']),

/**
* The date picker locale.
*/
locale: PropTypes.string,

/**
* The interval at which minutes can be selected.
*/
Expand Down Expand Up @@ -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}
maximumDate={
props.maximumDate ? props.maximumDate.getTime() : undefined
}
Expand Down Expand Up @@ -155,6 +161,7 @@ const RCTDatePickerIOS = requireNativeComponent('RCTDatePicker', {
propTypes: {
...DatePickerIOS.propTypes,
date: PropTypes.number,
locale: PropTypes.string,
minimumDate: PropTypes.number,
maximumDate: PropTypes.number,
onDateChange: () => null,
Expand Down
1 change: 1 addition & 0 deletions React/Base/RCTConvert.h
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,7 @@ typedef NSURL RCTFileURL;
+ (RCTFileURL *)RCTFileURL:(id)json;

+ (NSDate *)NSDate:(id)json;
+ (NSLocale *)NSLocale:(id)json;
+ (NSTimeZone *)NSTimeZone:(id)json;
+ (NSTimeInterval)NSTimeInterval:(id)json;

Expand Down
14 changes: 14 additions & 0 deletions React/Base/RCTConvert.m
Original file line number Diff line number Diff line change
Expand Up @@ -222,6 +222,20 @@ + (NSDate *)NSDate:(id)json
return nil;
}

+ (NSLocale *)NSLocale:(id)json
{
if ([json isKindOfClass:[NSString class]]) {
NSLocale *locale = [[NSLocale alloc] initWithLocaleIdentifier:json];
if (!locale) {
RCTLogError(@"JSON String '%@' could not be interpreted as a valid locale. ", json);
}
return locale;
} else if (json) {
RCTLogConvertError(json, @"a locale");
}
return nil;
}

// JS Standard for time is milliseconds
RCT_CUSTOM_CONVERTER(NSTimeInterval, NSTimeInterval, [self double:json] / 1000.0)

Expand Down
1 change: 1 addition & 0 deletions React/Views/RCTDatePickerManager.m
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ - (UIView *)view
}

RCT_EXPORT_VIEW_PROPERTY(date, NSDate)
RCT_EXPORT_VIEW_PROPERTY(locale, NSLocale)
RCT_EXPORT_VIEW_PROPERTY(minimumDate, NSDate)
RCT_EXPORT_VIEW_PROPERTY(maximumDate, NSDate)
RCT_EXPORT_VIEW_PROPERTY(minuteInterval, NSInteger)
Expand Down

0 comments on commit fd9c361

Please sign in to comment.