You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Is your feature request related to a problem? Please describe.
I'm starting to see some holes in the way I first implemented the useADateRange hook, specifically with the maxDays configuration option.
Take for example a hypothetical date range that must be within a particular month (let's use August as an example). To do so, one would have to render ADatePicker with minDate and maxDate props set to August 1 and August 31. However, if there was also the requirement to limit the range selection within August to just 7 days, then this would get complicated since the useADateRangesets this limit with the minDate and maxDate props, which clashes with the requirement of only enabling the user to select dates within August.
The main takeaway is that ADatePicker should be the component being configured, notuseADateRange. The purpose behind useADateRange was to handle sequencing logic, but I've coupled it too much with ADatePicker logic.
Describe the solution you'd like
Remove all date picker configuration from useADateRange before it gets too large. It should not have an opinion on minDate and maxDate. A better name for useADateRange might be useDateRangeSequencer.
const{// The sequencer handler
onChange,// Useful if developer ever wants control of range state
setValue,// Value to be passed to the date picker
value
}=useDateRangeSequencer();return(<ADatePickerminDate={/* August 1 */}maxDate={/* August 31 */}maxSelectionLength={7}value={value}onChange={onChange}/>)
Describe alternatives you've considered
Removing useADateRange entirely in favor of adding startDate and endDate props, which would also keep a similar pattern with the minDate and maxDate props in ADatePicker.
<ADatePickerminDate={/* August 1 */}maxDate={/* August 31 */}startDate={/* some date */}endDate={/* another date */}maxSelectionLength={7}onChange={/* some handler */}/>
Is your feature request related to a problem? Please describe.
I'm starting to see some holes in the way I first implemented the
useADateRange
hook, specifically with themaxDays
configuration option.Take for example a hypothetical date range that must be within a particular month (let's use August as an example). To do so, one would have to render
ADatePicker
withminDate
andmaxDate
props set to August 1 and August 31. However, if there was also the requirement to limit the range selection within August to just 7 days, then this would get complicated since theuseADateRange
sets this limit with theminDate
andmaxDate
props, which clashes with the requirement of only enabling the user to select dates within August.The main takeaway is that
ADatePicker
should be the component being configured, notuseADateRange
. The purpose behinduseADateRange
was to handle sequencing logic, but I've coupled it too much withADatePicker
logic.Describe the solution you'd like
Remove all date picker configuration from
useADateRange
before it gets too large. It should not have an opinion onminDate
andmaxDate
. A better name foruseADateRange
might beuseDateRangeSequencer
.Describe alternatives you've considered
Removing
useADateRange
entirely in favor of addingstartDate
andendDate
props, which would also keep a similar pattern with theminDate
andmaxDate
props inADatePicker
.Additional context
A good example of date picker configurations: https://reactdatepicker.com/#example-default
The text was updated successfully, but these errors were encountered: