React-native-modal-datetime-picker: Bug in datetime mode & time ( datetime not change after first time )

[mustafaskyer]

Environment

info
React Native Environment Info:
System:
OS: macOS 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 109.88 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 12.12.0 - /usr/local/bin/node
Yarn: 1.19.1 - /usr/local/bin/yarn
npm: 6.11.3 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 13.1, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
Android SDK:
API Levels: 28, 29
Build Tools: 28.0.3, 29.0.2
System Images: android-28 | Intel x86 Atom, android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 Atom_64, android-28 | Google Play Intel x86 Atom, android-28 | Google Play Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom_64
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5977832
Xcode: 11.1/11A1027 - /usr/bin/xcodebuild
npmPackages:
react: ^16.8.0 => 16.8.6
react-native: ^0.59.10 => 0.59.10
npmGlobalPackages:
react-native-cli: 2.0.1

Platforms

iOS

Versions

• Android:
• iOS: 13
• react-native-modal-datetime-picker: ^7.5.0
• react-native: ^0.57.19
• react: ^16.8.0

Description

when change the datetime in first time, it dosen't work, and return back to initial date
NOTE: this only happens when mode is 'datetime' or 'time'

Reproducible Demo

isVisible={this.props.isVisible}
onConfirm={this.onConfirm}
onCancel={this.onCancel}
minuteInterval={this.props.minuteInterval}
minimumDate={new Date(moment(this.props.minimumDate))}
date={this.props.date}
mode={this.props.mode}
locale={this.props.locale}
titleIOS={this.props.title}
titleStyle={{ fontFamily: "Effra", fontSize: 21, color: "#4C4C4C" }}
isDarkModeEnabled={true}
......

[mmazzarolo]

@mustafaskyer hey! we need the complete example to reproduce the issue :)
Also, you're re-creating the minimumDate prop on each render.

[mustafaskyer]

minimumDate props must have the keyword new Date, otherwise got issue

TypeError: props.minimumDate.getTime is not a function. (In 'props.minimumDate.getTime()', 'props.minimumDate.getTime' is undefined)

This error is located at:
    in DatePickerIOS (at CustomDatePickerIOS.js:210)
    in RCTView (at View.js:45)
    in View (at CustomDatePickerIOS.js:205)
    in RCTView (at View.js:45)
    in View (at CustomDatePickerIOS.js:202)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at createAnimatableComponent.js:572)
    in withAnimatable(View) (at src/index.js:593)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:115)
    in AppContainer (at Modal.js:244)
    in RCTView (at View.js:45)
    in View (at Modal.js:264)
    in RCTModalHostView (at Modal.js:252)
    in Modal (at src/index.js:658)
    in ReactNativeModal (at CustomDatePickerIOS.js:194)
    in CustomDatePickerIOS (at ModalDatePicker2.js:28)
    in ModalDateTimePicker (at Add/index.js:613)
    in RCTView (at View.js:45)
    in View (at Add/index.js:384)
    in AddScreeen (created by ConnectFunction)
    in ConnectFunction (at SceneView.js:9)
    in SceneView (at StackViewLayout.tsx:899)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at StackViewCard.tsx:93)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at screens.native.js:71)
    in Screen (at StackViewCard.tsx:80)
    in Card (at createPointerEventsContainer.tsx:95)
    in Container (at StackViewLayout.tsx:971)
    in RCTView (at View.js:45)
    in View (at screens.native.js:101)
    in ScreenContainer (at StackViewLayout.tsx:383)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at StackViewLayout.tsx:379)
    in PanGestureHandler (at StackViewLayout.tsx:372)
    in StackViewLayout (at withOrientation.js:30)
    in withOrientation (at StackView.tsx:103)
    in RCTView (at View.js:45)
    in View (at Transitioner.tsx:267)
    in Transitioner (at StackView.tsx:40)
    in StackView (at createNavigator.js:61)
    in Navigator (at createKeyboardAwareNavigator.js:12)
    in KeyboardAwareNavigator (at SceneView.js:9)
    in SceneView (at DrawerView.js:149)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:20)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:16)
    in ResourceSavingScene (at DrawerView.js:148)
    in RCTView (at View.js:45)
    in View (at screens.native.js:101)
    in ScreenContainer (at DrawerView.js:138)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at DrawerLayout.js:446)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at DrawerLayout.js:445)
    in PanGestureHandler (at DrawerLayout.js:501)
    in DrawerLayout (at DrawerView.js:165)
    in DrawerView (at createNavigator.js:61)
    in Navigator (at SceneView.js:9)
    in SceneView (at SwitchView.js:12)
    in SwitchView (at createNavigator.js:61)
    in Navigator (at SceneView.js:9)
    in SceneView (at FluidTransitioner.js:377)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at screens.native.js:71)
    in Screen (at TransitionRouteView.js:45)
    in TransitionRouteView (at FluidTransitioner.js:368)
    in RCTView (at View.js:45)
    in View (at screens.native.js:101)
    in ScreenContainer (at TransitionItemsView.js:119)
    in RCTView (at View.js:45)
    in View (at TransitionItemsView.js:113)
    in TransitionItemsView (at FluidTransitioner.js:223)
    in RCTView (at View.js:45)
    in View (at Transitioner.tsx:267)
    in Transitioner (at FluidTransitioner.js:73)
    in FluidTransitioner (at createFluidNavigator.js:38)
    in FluidNavigationView (at createNavigator.js:61)
    in Navigator (at createAppContainer.js:429)
    in NavigationContainer (at AppNavigation.js:257)
    in SharedElements (at Navigator.js:131)
    in RCTView (at View.js:45)
    in View (at Navigator.js:129)
    in Nav (created by ConnectFunction)
    in ConnectFunction (at App.js:77)
    in PersistGate (at App.js:76)
    in Provider (at App.js:75)
    in App (at CodePush.js:578)
    in CodePushComponent (at renderApplication.js:35)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:115)
    in AppContainer (at renderApplication.js:34)

render
    index.bundle?platform=ios&dev=true&minify=false:61321:69
finishClassComponent
    index.bundle?platform=ios&dev=true&minify=false:19026:43
updateClassComponent
    index.bundle?platform=ios&dev=true&minify=false:18989:50
performUnitOfWork
    index.bundle?platform=ios&dev=true&minify=false:23146:27
workLoop
    index.bundle?platform=ios&dev=true&minify=false:23180:47
renderRoot
    index.bundle?platform=ios&dev=true&minify=false:23246:21
performWorkOnRoot
    index.bundle?platform=ios&dev=true&minify=false:23984:23
performWork
    index.bundle?platform=ios&dev=true&minify=false:23911:30
performSyncWork
    index.bundle?platform=ios&dev=true&minify=false:23887:20
batchedUpdates$1
    index.bundle?platform=ios&dev=true&minify=false:24072:28
batchedUpdates
    index.bundle?platform=ios&dev=true&minify=false:12803:37
_receiveRootNodeIDEvent
    index.bundle?platform=ios&dev=true&minify=false:12860:23
receiveTouches
    index.bundle?platform=ios&dev=true&minify=false:12890:34
__callFunction
    index.bundle?platform=ios&dev=true&minify=false:2587:49
<unknown>
    index.bundle?platform=ios&dev=true&minify=false:2344:31
__guard
    index.bundle?platform=ios&dev=true&minify=false:2541:15
callFunctionReturnFlushedQueue
    index.bundle?platform=ios&dev=true&minify=false:2343:21
callFunctionReturnFlushedQueue
    [native code]:0

[jcroft]

I am experiencing this issue, as well. It only occurs when I use minimumDate in conjunction with minuteInterval. Removing one or the fixes the behavior (but, clearly, isn't a solution).