it will take default range date, initially whenever component mount

This commit is contained in:
Pramod Mahajan 2025-04-14 22:53:38 +05:30
parent ee2762fb4a
commit 6df20de749

View File

@ -5,16 +5,14 @@ const DateRangePicker = ({ onRangeChange }) => {
const inputRef = useRef(null); const inputRef = useRef(null);
useEffect(() => { useEffect(() => {
const today = new Date(); const today = new Date();
const fifteenDaysAgo = new Date(); const fifteenDaysAgo = new Date();
fifteenDaysAgo.setDate(today.getDate() - 15); fifteenDaysAgo.setDate(today.getDate() - 15);
const fp = flatpickr(inputRef.current, { const fp = flatpickr(inputRef.current, {
mode: "range", mode: "range",
dateFormat: "Y-m-d", dateFormat: "Y-m-d",
defaultDate: [fifteenDaysAgo, today], // set default range defaultDate: [fifteenDaysAgo, today],
static: true, static: true,
clickOpens: true, clickOpens: true,
onChange: (selectedDates, dateStr) => { onChange: (selectedDates, dateStr) => {
@ -23,6 +21,11 @@ const DateRangePicker = ({ onRangeChange }) => {
}, },
}); });
onRangeChange?.({
startDate: fifteenDaysAgo.toISOString().split("T")[0],
endDate: today.toISOString().split("T")[0],
});
return () => { return () => {
fp.destroy(); fp.destroy();
}; };