Fix a bug in daily booking

Fixes a bug in daily booking where selected end date styles are not
cleared when updating start date with a date that is before the old
start date and a booked date can be found between those old and new
start dates.
This commit is contained in:
Hannu Lyytikainen 2018-08-13 13:00:57 +03:00
parent 2c0cb83b5b
commit e659ac4809
2 changed files with 23 additions and 34 deletions

View file

@ -132,14 +132,7 @@ export const isDayBlockedFn = (timeSlots, startDate, endDate, focusedInput) => {
* Returns an isOutsideRange function that can be passed to
* a react-dates DateRangePicker component.
*/
export const isOutsideRangeFn = (
timeSlots,
startDate,
endDate,
previousStartDate,
focusedInput,
unitType
) => {
export const isOutsideRangeFn = (timeSlots, startDate, endDate, focusedInput, unitType) => {
const endOfRange = config.dayCountAvailableForBooking - 1;
const lastBookableDate = moment().add(endOfRange, 'days');

View file

@ -123,7 +123,6 @@ class DateRangeInputComponent extends Component {
this.state = {
focusedInput: null,
currentStartDate: null,
previousStartDate: null,
};
this.blurTimeoutId = null;
@ -145,14 +144,29 @@ class DateRangeInputComponent extends Component {
}
onDatesChange(dates) {
const { unitType } = this.props;
const { unitType, timeSlots } = this.props;
const { startDate, endDate } = dates;
const startDateAsDate = startDate instanceof moment ? startDate.toDate() : null;
const endDateAsDate = pickerEndDateToApiDate(unitType, endDate);
this.setState(prevState => ({
// both dates are selected, a new start date before the previous start
// date is selected
const startDateUpdated =
timeSlots &&
startDate &&
endDate &&
this.state.currentStartDate &&
startDate.isBefore(this.state.currentStartDate);
// clear the end date in case a blocked date can be found
// between previous start date and new start date
const clearEndDate = startDateUpdated
? isBlockedBetween(timeSlots, startDate, moment(this.state.currentStartDate).add(1, 'days'))
: false;
const startDateAsDate = startDate instanceof moment ? startDate.toDate() : null;
const endDateAsDate = clearEndDate ? null : pickerEndDateToApiDate(unitType, endDate);
this.setState(() => ({
currentStartDate: startDateAsDate,
previousStartDate: prevState.currentStartDate,
}));
this.props.onChange({ startDate: startDateAsDate, endDate: endDateAsDate });
@ -206,30 +220,12 @@ class DateRangeInputComponent extends Component {
const endDate =
apiEndDateToPickerDate(unitType, value ? value.endDate : null) || initialEndMoment;
// both dates are selected, a new start date before the previous start
// date is selected
const startDateUpdated =
timeSlots &&
startDate &&
endDate &&
this.state.previousStartDate &&
startDate.isBefore(this.state.previousStartDate);
// clear the end date in case a blocked date can be found
// between previous start date and new start date
const clearEndDate = startDateUpdated
? isBlockedBetween(timeSlots, startDate, moment(this.state.previousStartDate).add(1, 'days'))
: false;
const endDateMaybe = clearEndDate ? null : endDate;
let isDayBlocked = isDayBlockedFn(timeSlots, startDate, endDate, this.state.focusedInput);
let isOutsideRange = isOutsideRangeFn(
timeSlots,
startDate,
endDateMaybe,
this.state.previousStartDate,
endDate,
this.state.focusedInput,
unitType
);
@ -261,7 +257,7 @@ class DateRangeInputComponent extends Component {
focusedInput={this.state.focusedInput}
onFocusChange={this.onFocusChange}
startDate={startDate}
endDate={endDateMaybe}
endDate={endDate}
minimumNights={isDaily ? 0 : 1}
onDatesChange={this.onDatesChange}
startDatePlaceholderText={startDatePlaceholderTxt}