From fe7ecc0ee59f4f2b9425244101b8f2f951e63785 Mon Sep 17 00:00:00 2001 From: Nida Ghuman Date: Tue, 18 Jul 2023 14:41:43 -0400 Subject: [PATCH] [PLAY-918] DatePicker Disabled Dates Conflict (#2648) Allows you to pass multiple disabled date types to datepicker --- .../pb_date_picker/date_picker_helper.ts | 68 ++++++++++--------- 1 file changed, 37 insertions(+), 31 deletions(-) diff --git a/playbook/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts b/playbook/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts index 3cda340b5b..a9a2095be1 100644 --- a/playbook/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +++ b/playbook/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts @@ -71,13 +71,42 @@ const datePickerHelper = (config: DatePickerConfig, scrollContainer: string | HT } } const disabledParser = () => { - if (disableDate && disableDate.length > 0) { - return disableDate - } else if (disableRange && disableRange.length > 0) { - return disableRange - } else { - return [] - } + const disabledArray=[] + + disableDate && disableDate.length > 0 && disabledArray.push(...disableDate) + disableRange && disableRange.length > 0 && disabledArray.push(...disableRange) + disableWeekdays && disableWeekdays.length > 0 && disabledArray.push(...disabledWeekDays()) + + return disabledArray + } + + const disabledWeekDays = () => { + return ( + [ + (date:any) => { + const weekdayObj: { + [day: string]: number + } = { + Sunday: 0, + Monday: 1, + Tuesday: 2, + Wednesday: 3, + Thursday: 4, + Friday: 5, + Saturday: 6, + } + return ( + date.getDay() === weekdayObj[disableWeekdays[0]] || + date.getDay() === weekdayObj[disableWeekdays[1]] || + date.getDay() === weekdayObj[disableWeekdays[2]] || + date.getDay() === weekdayObj[disableWeekdays[3]] || + date.getDay() === weekdayObj[disableWeekdays[4]] || + date.getDay() === weekdayObj[disableWeekdays[5]] || + date.getDay() === weekdayObj[disableWeekdays[6]] + ) + }, + ] + ) } const calendarResizer = () => { const cal = document.querySelector(`#cal-${pickerId}.open`) as HTMLElement @@ -127,30 +156,7 @@ const datePickerHelper = (config: DatePickerConfig, scrollContainer: string | HT disableMobile: true, dateFormat: getDateFormat(), defaultDate: defaultDateGetter(), - disable: disableWeekdays && disableWeekdays.length > 0 ? [ - (date) => { - const weekdayObj: { - [day: string]: number - } = { - Sunday: 0, - Monday: 1, - Tuesday: 2, - Wednesday: 3, - Thursday: 4, - Friday: 5, - Saturday: 6, - } - return ( - date.getDay() === weekdayObj[disableWeekdays[0]] || - date.getDay() === weekdayObj[disableWeekdays[1]] || - date.getDay() === weekdayObj[disableWeekdays[2]] || - date.getDay() === weekdayObj[disableWeekdays[3]] || - date.getDay() === weekdayObj[disableWeekdays[4]] || - date.getDay() === weekdayObj[disableWeekdays[5]] || - date.getDay() === weekdayObj[disableWeekdays[6]] - ) - }, - ] : disabledParser(), + disable: disabledParser(), enableTime, locale: { rangeSeparator: ' to '