@@ -13,7 +13,6 @@ import Dialog from '../dialog';
13
13
import View from '../view' ;
14
14
import Button from '../button' ;
15
15
16
-
17
16
const MODES = {
18
17
DATE : 'date' ,
19
18
TIME : 'time'
@@ -66,7 +65,7 @@ class DateTimePicker extends BaseComponent {
66
65
* Props to pass the Dialog component
67
66
*/
68
67
dialogProps : PropTypes . object
69
- }
68
+ } ;
70
69
71
70
static defaultProps = {
72
71
...TextField . defaultProps ,
@@ -89,29 +88,30 @@ class DateTimePicker extends BaseComponent {
89
88
this . styles = createStyles ( this . props ) ;
90
89
}
91
90
92
- setDate = ( event , date ) => {
93
- if ( date !== undefined ) {
91
+ handleChange = ( event = { } , date ) => {
92
+ if ( event . type !== 'dismissed' && date !== undefined ) {
94
93
this . chosenDate = date ;
95
94
96
95
if ( Constants . isAndroid ) {
97
- this . setState ( { chosenDate : this . chosenDate , showExpandableOverlay : false } ) ;
96
+ this . onDonePressed ( ) ;
98
97
}
99
98
}
99
+ } ;
100
100
101
- _ . invoke ( this . props , 'onChange' ) ;
102
- }
103
-
104
- toggleExpandableOverlay = ( callback ) => {
105
- this . setState ( { showExpandableOverlay : ! this . state . showExpandableOverlay } , ( ) => {
106
- if ( _ . isFunction ( callback ) ) {
107
- callback ( ) ;
108
- }
109
- } ) ;
101
+ toggleExpandableOverlay = callback => {
102
+ this . setState ( { showExpandableOverlay : ! this . state . showExpandableOverlay } ,
103
+ ( ) => {
104
+ if ( _ . isFunction ( callback ) ) {
105
+ callback ( ) ;
106
+ }
107
+ } ) ;
110
108
} ;
111
109
112
- onDonePressed = ( ) => {
113
- this . toggleExpandableOverlay ( ( ) => this . setState ( { chosenDate : this . chosenDate } ) ) ;
114
- }
110
+ onDonePressed = ( ) =>
111
+ this . toggleExpandableOverlay ( ( ) => {
112
+ _ . invoke ( this . props , 'onChange' , this . chosenDate ) ;
113
+ this . setState ( { chosenDate : this . chosenDate } ) ;
114
+ } ) ;
115
115
116
116
renderExpandableOverlay = ( ) => {
117
117
const { testID, dialogProps} = this . getThemeProps ( ) ;
@@ -128,7 +128,12 @@ class DateTimePicker extends BaseComponent {
128
128
onDismiss = { this . toggleExpandableOverlay }
129
129
containerStyle = { this . styles . dialog }
130
130
testID = { `${ testID } .dialog` }
131
- supportedOrientations = { [ 'portrait' , 'landscape' , 'landscape-left' , 'landscape-right' ] } // iOS only
131
+ supportedOrientations = { [
132
+ 'portrait' ,
133
+ 'landscape' ,
134
+ 'landscape-left' ,
135
+ 'landscape-right'
136
+ ] } // iOS only
132
137
{ ...dialogProps }
133
138
>
134
139
< View useSafeArea >
@@ -166,32 +171,39 @@ class DateTimePicker extends BaseComponent {
166
171
167
172
if ( showExpandableOverlay ) {
168
173
return (
169
- < RNDateTimePicker
174
+ < RNDateTimePicker
170
175
mode = { mode }
171
176
value = { chosenDate }
172
- onChange = { this . setDate }
177
+ onChange = { this . handleChange }
173
178
minimumDate = { minimumDate }
174
179
maximumDate = { maximumDate }
175
180
/>
176
181
) ;
177
182
}
178
183
}
179
184
180
- renderExpandable = ( ) => {
181
- return Constants . isAndroid ? this . renderDateTimePicker ( ) : this . renderExpandableOverlay ( ) ;
182
- }
185
+ renderExpandable = ( ) => {
186
+ return Constants . isAndroid
187
+ ? this . renderDateTimePicker ( )
188
+ : this . renderExpandableOverlay ( ) ;
189
+ } ;
183
190
184
191
render ( ) {
185
192
const { chosenDate} = this . state ;
186
193
const { mode, dateFormat, timeFormat} = this . getThemeProps ( ) ;
187
194
const textInputProps = TextField . extractOwnProps ( this . getThemeProps ( ) ) ;
188
- const dateString = mode === MODES . DATE ?
189
- ( dateFormat ? moment ( chosenDate ) . format ( dateFormat ) : chosenDate . toLocaleDateString ( ) ) :
190
- ( timeFormat ? moment ( chosenDate ) . format ( timeFormat ) : chosenDate . toLocaleTimeString ( ) ) ;
191
-
195
+ const dateString =
196
+ mode === MODES . DATE
197
+ ? dateFormat
198
+ ? moment ( chosenDate ) . format ( dateFormat )
199
+ : chosenDate . toLocaleDateString ( )
200
+ : timeFormat
201
+ ? moment ( chosenDate ) . format ( timeFormat )
202
+ : chosenDate . toLocaleTimeString ( ) ;
203
+
192
204
return (
193
- < TextField
194
- { ...textInputProps }
205
+ < TextField
206
+ { ...textInputProps }
195
207
value = { dateString }
196
208
expandable
197
209
renderExpandable = { this . renderExpandable }
0 commit comments