Components: Fix the timepicker, only update the values on blur #4193
Conversation
youknowriad
added
the
General Interface
| const { onChange } = this.props; | ||
| const { am, date, hours } = this.state; | ||
| if ( am === value ) { | ||
| return; |
There was a problem hiding this comment.
Does this ever fire, or is it just for sanity here?
There was a problem hiding this comment.
It does fire when you hit the "toggled" button
There was a problem hiding this comment.
Ah cool, thanks for clarifying. It wasn't clear to me, and it's not covered by the tests either, so I thought to ask :-)
| /** | ||
| * Module Constants | ||
| */ | ||
| const TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss'; |
There was a problem hiding this comment.
The input and the output format should be the same, that's the format we have in the post object. We could use only a time format for time and date format for date but this means adding some "unnecessary" date manipulations in the parent component date-time (extract time and date on input, and recompute the whole date on change). I think it's just for convenience.
| isToggled={ am === 'AM' } | ||
| onClick={ this.updateAmPm( 'AM' ) } | ||
| > | ||
| { __( 'AM' ) } |
There was a problem hiding this comment.
Not sure if these need some translation context in general. cc @yoavf
There was a problem hiding this comment.
Not sure if these need some translation context in general.
I would have possibly expected context to be good here, but noting elsewhere in core it is not provided:
|
Going to merge this if no more concerns? |
|
🚢 |
closes #3661
This PR changes the behavior of the TimPicker to be able to edit it freely and do the validation and updates on blur only.
This also makes the Component API more consistent, the format of the input and output value is made consistent. (Moment is only internal while the API expects timezone-less dates)
Testing instructions