Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | 3x 5x 3x 4x 20x 3x 8x 5x 5x 5x 5x 5x 5x 8x | import React, { useCallback } from 'react';
import TimeSelectInput from './TimeSelectInput';
interface ITimeSelectMinute {
minute: number;
time: Date;
isDisabled?: boolean;
onChange(time: Date): void;
}
const shouldGetNextMinuteStep = (minute: number, nextMinute: number) => {
return (
minute === nextMinute + 15 ||
minute === nextMinute - 15 ||
nextMinute > 59 ||
nextMinute < 0
);
};
const getNextMinuteStep = (nextMinute: number) => {
return [-15, 0, 15, 30, 45, 60].reduce((prev, curr) => {
return Math.abs(curr - nextMinute) < Math.abs(prev - nextMinute)
? curr
: prev;
});
};
const TimeSelectMinute = ({
minute,
time,
isDisabled,
onChange,
}: ITimeSelectMinute) => {
const onMinuteChange = useCallback(
(nextMinuteString) => {
const nextMinute = +nextMinuteString;
const updatedTime = new Date(time);
const shouldGetNextStep = shouldGetNextMinuteStep(minute, nextMinute);
const cleanedMinute = shouldGetNextStep
? getNextMinuteStep(nextMinute)
: nextMinute;
updatedTime.setMinutes(cleanedMinute);
onChange(updatedTime);
},
[time, minute]
);
return (
<TimeSelectInput
value={minute}
name='Minute'
onChange={onMinuteChange}
disabled={isDisabled}
step={15}
/>
);
};
export default TimeSelectMinute;
|