search

henninghall / react-native-date-picker

React Native Date Picker is datetime picker for Android and iOS. It includes date, time and datetime picker modes. The datepicker is customizable and is supporting different languages. It's written with native code to achieve the best possible look, feel and performance.
MIT License
2.14k stars 326 forks source link

Android: onStateChange does not return 'idle' or 'spinning' #786

Closed chauncat closed 2 months ago

chauncat commented 3 months ago

Describe the bug When newArch is false onStateChange is returning entire event instead of just the string.

When writing the parameter from onStateChange to console log it shows the full event. 

        <DatePicker
          ...
          onStateChange={(e) => {
            console.log('event', e);
          }}
event {
    "_dispatchInstances": {
        "_debugHookTypes": null,
        "_debugNeedsRemount": false,
        "_debugOwner": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.32708299986552447,
            "actualStartTime": 763915.602665,
            "alternate": [FiberNode],
            "child": [Circular],
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": [Function DatePickerAndroid],
            "flags": 1,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.2715099999913946,
            "sibling": null,
            "stateNode": [DatePickerAndroid],
            "subtreeFlags": 4,
            "tag": 1,
            "treeBaseDuration": 0.30411399994045496,
            "type": [Function DatePickerAndroid],
            "updateQueue": [Object]
        },
        "_debugSource": undefined,
        "actualDuration": 0.04666699992958456,
        "actualStartTime": 763915.879384,
        "alternate": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.10296799999196082,
            "actualStartTime": 764945.181519,
            "alternate": [Circular],
            "child": null,
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": "RNDatePicker",
            "flags": 4,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.07322900008875877,
            "sibling": null,
            "stateNode": [ReactNativeFiberHostComponent],
            "subtreeFlags": 0,
            "tag": 5,
            "treeBaseDuration": 0.07322900008875877,
            "type": "RNDatePicker",
            "updateQueue": null
        },
        "child": null,
        "childLanes": 0,
        "deletions": null,
        "dependencies": null,
        "elementType": "RNDatePicker",
        "flags": 4,
        "index": 0,
        "key": null,
        "lanes": 0,
        "memoizedProps": {
            "accessibilityLabel": "dateTimePicker",
            "androidVariant": "nativeAndroid",
            "cancelText": "Cancel",
            "confirmText": "Confirm",
            "date": "2024-03-18T19:16:00.000Z",
            "fadeToColor": undefined,
            "id": "0.7786056200089707",
            "is24hourSource": "locale",
            "locale": "en_GB",
            "maximumDate": undefined,
            "minimumDate": undefined,
            "minuteInterval": 1,
            "mode": "time",
            "onChange": [Function anonymous],
            "onDateChange": [Function onDateChange],
            "onStateChange": [Function onStateChange],
            "style": [Array],
            "testID": "dateTimePicker",
            "textColor": undefined,
            "theme": "light",
            "timeZoneOffsetInMinutes": "",
            "timezoneOffsetInMinutes": "",
            "title": "Select time"
        },
        "memoizedState": null,
        "mode": 2,
        "pendingProps": {
            "accessibilityLabel": "dateTimePicker",
            "androidVariant": "nativeAndroid",
            "cancelText": "Cancel",
            "confirmText": "Confirm",
            "date": "2024-03-18T19:16:00.000Z",
            "fadeToColor": undefined,
            "id": "0.7786056200089707",
            "is24hourSource": "locale",
            "locale": "en_GB",
            "maximumDate": undefined,
            "minimumDate": undefined,
            "minuteInterval": 1,
            "mode": "time",
            "onChange": [Function anonymous],
            "onDateChange": [Function onDateChange],
            "onStateChange": [Function onStateChange],
            "style": [Array],
            "testID": "dateTimePicker",
            "textColor": undefined,
            "theme": "light",
            "timeZoneOffsetInMinutes": "",
            "timezoneOffsetInMinutes": "",
            "title": "Select time"
        },
        "ref": null,
        "return": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.32708299986552447,
            "actualStartTime": 763915.602665,
            "alternate": [FiberNode],
            "child": [Circular],
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": [Function DatePickerAndroid],
            "flags": 1,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.2715099999913946,
            "sibling": null,
            "stateNode": [DatePickerAndroid],
            "subtreeFlags": 4,
            "tag": 1,
            "treeBaseDuration": 0.30411399994045496,
            "type": [Function DatePickerAndroid],
            "updateQueue": [Object]
        },
        "selfBaseDuration": 0.03260399994906038,
        "sibling": null,
        "stateNode": {
            "_children": [Array],
            "_internalFiberInstanceHandleDEV": [Circular],
            "_nativeTag": 1219,
            "viewConfig": [Object]
        },
        "subtreeFlags": 0,
        "tag": 5,
        "treeBaseDuration": 0.03260399994906038,
        "type": "RNDatePicker",
        "updateQueue": null
    },
    "_dispatchListeners": [Function onStateChange],
    "_targetInst": {
        "_debugHookTypes": null,
        "_debugNeedsRemount": false,
        "_debugOwner": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.32708299986552447,
            "actualStartTime": 763915.602665,
            "alternate": [FiberNode],
            "child": [Circular],
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": [Function DatePickerAndroid],
            "flags": 1,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.2715099999913946,
            "sibling": null,
            "stateNode": [DatePickerAndroid],
            "subtreeFlags": 4,
            "tag": 1,
            "treeBaseDuration": 0.30411399994045496,
            "type": [Function DatePickerAndroid],
            "updateQueue": [Object]
        },
        "_debugSource": undefined,
        "actualDuration": 0.04666699992958456,
        "actualStartTime": 763915.879384,
        "alternate": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.10296799999196082,
            "actualStartTime": 764945.181519,
            "alternate": [Circular],
            "child": null,
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": "RNDatePicker",
            "flags": 4,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.07322900008875877,
            "sibling": null,
            "stateNode": [ReactNativeFiberHostComponent],
            "subtreeFlags": 0,
            "tag": 5,
            "treeBaseDuration": 0.07322900008875877,
            "type": "RNDatePicker",
            "updateQueue": null
        },
        "child": null,
        "childLanes": 0,
        "deletions": null,
        "dependencies": null,
        "elementType": "RNDatePicker",
        "flags": 4,
        "index": 0,
        "key": null,
        "lanes": 0,
        "memoizedProps": {
            "accessibilityLabel": "dateTimePicker",
            "androidVariant": "nativeAndroid",
            "cancelText": "Cancel",
            "confirmText": "Confirm",
            "date": "2024-03-18T19:16:00.000Z",
            "fadeToColor": undefined,
            "id": "0.7786056200089707",
            "is24hourSource": "locale",
            "locale": "en_GB",
            "maximumDate": undefined,
            "minimumDate": undefined,
            "minuteInterval": 1,
            "mode": "time",
            "onChange": [Function anonymous],
            "onDateChange": [Function onDateChange],
            "onStateChange": [Function onStateChange],
            "style": [Array],
            "testID": "dateTimePicker",
            "textColor": undefined,
            "theme": "light",
            "timeZoneOffsetInMinutes": "",
            "timezoneOffsetInMinutes": "",
            "title": "Select time"
        },
        "memoizedState": null,
        "mode": 2,
        "pendingProps": {
            "accessibilityLabel": "dateTimePicker",
            "androidVariant": "nativeAndroid",
            "cancelText": "Cancel",
            "confirmText": "Confirm",
            "date": "2024-03-18T19:16:00.000Z",
            "fadeToColor": undefined,
            "id": "0.7786056200089707",
            "is24hourSource": "locale",
            "locale": "en_GB",
            "maximumDate": undefined,
            "minimumDate": undefined,
            "minuteInterval": 1,
            "mode": "time",
            "onChange": [Function anonymous],
            "onDateChange": [Function onDateChange],
            "onStateChange": [Function onStateChange],
            "style": [Array],
            "testID": "dateTimePicker",
            "textColor": undefined,
            "theme": "light",
            "timeZoneOffsetInMinutes": "",
            "timezoneOffsetInMinutes": "",
            "title": "Select time"
        },
        "ref": null,
        "return": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.32708299986552447,
            "actualStartTime": 763915.602665,
            "alternate": [FiberNode],
            "child": [Circular],
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": [Function DatePickerAndroid],
            "flags": 1,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.2715099999913946,
            "sibling": null,
            "stateNode": [DatePickerAndroid],
            "subtreeFlags": 4,
            "tag": 1,
            "treeBaseDuration": 0.30411399994045496,
            "type": [Function DatePickerAndroid],
            "updateQueue": [Object]
        },
        "selfBaseDuration": 0.03260399994906038,
        "sibling": null,
        "stateNode": {
            "_children": [Array],
            "_internalFiberInstanceHandleDEV": [Circular],
            "_nativeTag": 1219,
            "viewConfig": [Object]
        },
        "subtreeFlags": 0,
        "tag": 5,
        "treeBaseDuration": 0.03260399994906038,
        "type": "RNDatePicker",
        "updateQueue": null
    },
    "bubbles": undefined,
    "cancelable": undefined,
    "currentTarget": {
        "_children": [],
        "_internalFiberInstanceHandleDEV": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.04666699992958456,
            "actualStartTime": 763915.879384,
            "alternate": [FiberNode],
            "child": null,
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": "RNDatePicker",
            "flags": 4,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.03260399994906038,
            "sibling": null,
            "stateNode": [Circular],
            "subtreeFlags": 0,
            "tag": 5,
            "treeBaseDuration": 0.03260399994906038,
            "type": "RNDatePicker",
            "updateQueue": null
        },
        "_nativeTag": 1219,
        "viewConfig": {
            "Commands": [Object],
            "NativeProps": [Object],
            "bubblingEventTypes": [Object],
            "directEventTypes": [Object],
            "uiViewClassName": "RNDatePicker",
            "validAttributes": [Object]
        }
    },
    "defaultPrevented": undefined,
    "dispatchConfig": {
        "phasedRegistrationNames": {
            "bubbled": "onStateChange"
        }
    },
    "eventPhase": undefined,
    "isDefaultPrevented": [Function functionThatReturnsFalse],
    "isPropagationStopped": [Function functionThatReturnsFalse],
    "isTrusted": undefined,
    "nativeEvent": {
        "id": null,
        "spinnerState": "idle"
    },
    "target": {
        "_children": [],
        "_internalFiberInstanceHandleDEV": {
            "_debugHookTypes": null,
            "_debugNeedsRemount": false,
            "_debugOwner": [FiberNode],
            "_debugSource": undefined,
            "actualDuration": 0.04666699992958456,
            "actualStartTime": 763915.879384,
            "alternate": [FiberNode],
            "child": null,
            "childLanes": 0,
            "deletions": null,
            "dependencies": null,
            "elementType": "RNDatePicker",
            "flags": 4,
            "index": 0,
            "key": null,
            "lanes": 0,
            "memoizedProps": [Object],
            "memoizedState": null,
            "mode": 2,
            "pendingProps": [Object],
            "ref": null,
            "return": [FiberNode],
            "selfBaseDuration": 0.03260399994906038,
            "sibling": null,
            "stateNode": [Circular],
            "subtreeFlags": 0,
            "tag": 5,
            "treeBaseDuration": 0.03260399994906038,
            "type": "RNDatePicker",
            "updateQueue": null
        },
        "_nativeTag": 1219,
        "viewConfig": {
            "Commands": [Object],
            "NativeProps": [Object],
            "bubblingEventTypes": [Object],
            "directEventTypes": [Object],
            "uiViewClassName": "RNDatePicker",
            "validAttributes": [Object]
        }
    },
    "timeStamp": 1710789391214,
    "type": undefined
}

Expected behavior A clear and concise description of what you expected to happen. Expected the parameter to be return spinning or idle

To Reproduce Add example code that reproduces the behavior. 

export default class App extends Component {

  state = { date: new Date() }

  render = () =>
    <DatePicker
      date={this.state.date}
      onStateChange={(e) => {
            console.log('event', e);
          }
    />
}

Smartphone (please complete the following information):

henninghall commented 2 months ago

Thanks for reporting this. It is fixed in version 5.0.1