mirror of
https://github.com/kingomarnajjar/flex-template-web.git
synced 2026-07-27 19:42:11 +10:00
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:
parent
2c0cb83b5b
commit
e659ac4809
2 changed files with 23 additions and 34 deletions
|
|
@ -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');
|
||||
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue