useeffect to reset hour. check timerange before scroll

This commit is contained in:
Bernt Christian Egeland 2023-01-23 21:29:48 +01:00
parent 77a41eb2f3
commit 38df2d23b6

View File

@ -23,10 +23,14 @@ const TimePicker = ({ dateRange, onChange }) => {
}, [dateRange]); }, [dateRange]);
useEffect(() => { useEffect(() => {
if (reset || !before) return; /**
* This will reset hours when user selects another date in the calendar.
if (before.getHours() === 0 && after.getHours() === 0) return setTimeRange(new Set()); */
if (before.getHours() === 0 && after.getHours() === 0 && timeRange.size > 1) return setTimeRange(new Set());
}, [after, before, timeRange]);
useEffect(() => {
if (reset || !after) return;
/** /**
* calculates the number of hours between two dates, by finding the difference in days, * calculates the number of hours between two dates, by finding the difference in days,
* converting it to hours and adding the hours from the before date. * converting it to hours and adding the hours from the before date.
@ -46,9 +50,11 @@ const TimePicker = ({ dateRange, onChange }) => {
* find an element by the id timeIndex- concatenated with the minimum value from timeRange array, * find an element by the id timeIndex- concatenated with the minimum value from timeRange array,
* and if that element is present, it will scroll into view if needed * and if that element is present, it will scroll into view if needed
*/ */
const element = document.getElementById(`timeIndex-${Math.min(...timeRange)}`); if (timeRange.size > 1) {
if (element) { const element = document.getElementById(`timeIndex-${Math.min(...timeRange)}`);
element.scrollIntoViewIfNeeded(true); if (element) {
element.scrollIntoViewIfNeeded(true);
}
} }
}, [after, before, timeRange, reset]); }, [after, before, timeRange, reset]);