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; |