React-native-modal-datetime-picker: Is neutralButtonLabel supported?

Created on 14 Mar 2020  路  9Comments  路  Source: mmazzarolo/react-native-modal-datetime-picker

The neutralButtonLabel prop is supported by @react-native-community/datetimepicker but it doesn't seem to be supported here. Is support coming?

question

All 9 comments

@hufftheweevil hey, what do you mean by not supported here?
If neutralButtonLabel is a prop (it will be passed down to the community picker](https://github.com/mmazzarolo/react-native-modal-datetime-picker/blob/85eaaac7cb401835fbff6979a6588b69e1bc4752/src/DateTimePickerModal.android.js#L69).

maybe @hufftheweevil means that the neutral button event is not managed inside the handleChange method

Hmm, I just realized that I can't get it to work with @react-native-community/datetimepicker either. I've submitted an issue on that repo to see if I can track down the true issue.

It would actually be enough to edit the method handleChange inside the file DateTimePickerModal.android.js adding the neutralButtonPressed event in this way:

  handleChange = (event, date) => {
    if (event.type === "dismissed") {
      this.props.onCancel();
      this.props.onHide(false);
      return;
    }
    if (event.type === "neutralButtonPressed") {
      this.props.onNeutral();
      this.props.onHide(false);
      return; 
    }
    if (this.props.mode === "datetime") {
      if (this.state.currentMode === "date") {
        this.currentDate = new Date(date);
        this.setState({ currentMode: "time" });
        return;
      } else if (this.state.currentMode === "time") {
        const year = this.currentDate.getFullYear();
        const month = this.currentDate.getMonth();
        const day = this.currentDate.getDate();
        const hours = date.getHours();
        const minutes = date.getMinutes();
        this.currentDate = new Date(year, month, day, hours, minutes);
      }
    } else {
      this.currentDate = date;
    }
    this.props.onConfirm(this.currentDate);
    this.props.onHide(true, this.currentDate);
  };

@hufftheweevil Would be nice to have this feature. Since the onChange prop is forced to use the handleChange method, it is currently impossible to check if the event type is 'neutralButtonPressed' as per https://github.com/react-native-community/datetimepicker#neutralbuttonlabel-optional-android-only

Just to note: This issue has been fixed in @react-native-community/datetimepicker v3.0.1

https://github.com/react-native-community/datetimepicker/issues/198#issuecomment-675674910

Thanks for the response! I just might be missing something or did not clarify enough. My use-case is based on doing X (e.g. console.log(1)) on pressing confirm and doing Y (e.g. console.log(2)) on pressing neutral. I was not able to differentiate between those two, I hate to waste your time showing me that I totally overlooked something, but could you tell/show me how I can fix my use-case?

Nonsense; there is no wasting time here. Happy to help...

Pressing the neutral button will call the onConfirm callback, but the parameter will be undefined.

So you're code might look something like:

onChange={timestamp => {
  if (timestamp !== undefined) {
    console.log('Confirm button pressed', timestamp)
  } else {
    console.log('Neutral button pressed')
  }
}}

Thanks for the example! This will work just fine!

Was this page helpful?
0 / 5 - 0 ratings