Calendar: Add labels for next/previous month (#89019)

add labels for next/previous month

packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx

@@ -5,6 +5,7 @@ import Calendar from 'react-calendar';
 import { GrafanaTheme2, dateTimeParse, DateTime, TimeZone } from '@grafana/data';
 
 import { useStyles2 } from '../../../themes';
+import { t } from '../../../utils/i18n';
 import { Icon } from '../../Icon/Icon';
 import { adjustDateForReactCalendar } from '../utils/adjustDateForReactCalendar';
 
@@ -24,7 +25,9 @@ export function Body({ onChange, from, to, timeZone }: TimePickerCalendarProps)
       tileClassName={styles.title}
       value={value}
       nextLabel={<Icon name="angle-right" />}
+      nextAriaLabel={t('time-picker.calendar.next-month', 'Next month')}
       prevLabel={<Icon name="angle-left" />}
+      prevAriaLabel={t('time-picker.calendar.previous-month', 'Previous month')}
       onChange={onCalendarChange}
       locale="en"
     />

public/locales/en-US/grafana.json

@@ -1744,6 +1744,8 @@
       "apply-button": "Apply time range",
       "cancel-button": "Cancel",
       "close": "Close calendar",
+      "next-month": "Next month",
+      "previous-month": "Previous month",
       "select-time": "Select a time range"
     },
     "content": {

public/locales/pseudo-LOCALE/grafana.json

@@ -1744,6 +1744,8 @@
       "apply-button": "Åppľy ŧįmę řäʼnģę",
       "cancel-button": "Cäʼnčęľ",
       "close": "Cľőşę čäľęʼnđäř",
+      "next-month": "Ńęχŧ mőʼnŧĥ",
+      "previous-month": "Přęvįőūş mőʼnŧĥ",
       "select-time": "Ŝęľęčŧ ä ŧįmę řäʼnģę"
     },
     "content": {