diff --git a/src/components/common/CalendarModal.tsx b/src/components/common/CalendarModal.tsx index 74c785475..1b757c8ad 100644 --- a/src/components/common/CalendarModal.tsx +++ b/src/components/common/CalendarModal.tsx @@ -1,5 +1,3 @@ -import type { FC } from '../../lib/teact/teact'; -import type React from '../../lib/teact/teact'; import { memo, useCallback, useEffect, useMemo, useRef, useState, } from '../../lib/teact/teact'; @@ -65,7 +63,7 @@ const WEEKDAY_LETTERS = [ 'lng_weekday7', ]; -const CalendarModal: FC = ({ +const CalendarModal = ({ selectedAt, minAt, maxAt, @@ -84,7 +82,7 @@ const CalendarModal: FC = ({ onSubmit, onDateChange, onSecondButtonClick, -}) => { +}: OwnProps & StateProps) => { const { showNotification } = getActions(); const menuRef = useRef(); @@ -214,20 +212,32 @@ const CalendarModal: FC = ({ handleContextMenu(e); }); - function handlePrevMonth() { + function handlePrevMonth(e: React.MouseEvent) { setCurrentMonthAndYear((d) => { const dateCopy = new Date(d); - dateCopy.setMonth(dateCopy.getMonth() - 1); - + if (e.shiftKey) { + dateCopy.setFullYear(dateCopy.getFullYear() - 1); + if (dateCopy < minDate) { + return new Date(minDate.getFullYear(), minDate.getMonth(), 1); + } + } else { + dateCopy.setMonth(dateCopy.getMonth() - 1); + } return dateCopy; }); } - function handleNextMonth() { + function handleNextMonth(e: React.MouseEvent) { setCurrentMonthAndYear((d) => { const dateCopy = new Date(d); - dateCopy.setMonth(dateCopy.getMonth() + 1); - + if (e.shiftKey) { + dateCopy.setFullYear(dateCopy.getFullYear() + 1); + if (dateCopy > maxDate) { + return new Date(maxDate.getFullYear(), maxDate.getMonth(), 1); + } + } else { + dateCopy.setMonth(dateCopy.getMonth() + 1); + } return dateCopy; }); } @@ -388,7 +398,7 @@ const CalendarModal: FC = ({ color="translucent" iconName="previous" disabled={shouldDisablePrevMonth} - onClick={!shouldDisablePrevMonth ? handlePrevMonth : undefined} + onClick={shouldDisablePrevMonth ? undefined : handlePrevMonth} />