1 files changed, 19 insertions, 8 deletions
diff --git a/app/assets/javascripts/vue_shared/constants.js b/app/assets/javascripts/vue_shared/constants.js
index 14328b1f25f..b6d69faebb5 100644
--- a/app/assets/javascripts/vue_shared/constants.js
+++ b/app/assets/javascripts/vue_shared/constants.js
@@ -1,4 +1,4 @@
-import { __, sprintf } from '~/locale';
+import { __, n__, sprintf } from '~/locale';
 import { IssuableType, WorkspaceType } from '~/issues/constants';
 
 const INTERVALS = {
@@ -15,51 +15,62 @@ export const ISO_SHORT_FORMAT = 'yyyy-mm-dd';
 
 export const DATE_FORMATS = [SHORT_DATE_FORMAT, ISO_SHORT_FORMAT];
 
+const getTimeLabel = (days) => n__('1 day', '%d days', days);
+
+/* eslint-disable @gitlab/require-i18n-strings */
 export const timeRanges = [
   {
-    label: __('30 minutes'),
+    label: n__('1 minute', '%d minutes', 30),
+    shortcut: '30_minutes',
     duration: { seconds: 60 * 30 },
     name: 'thirtyMinutes',
     interval: INTERVALS.minute,
   },
   {
-    label: __('3 hours'),
+    label: n__('1 hour', '%d hours', 3),
+    shortcut: '3_hours',
     duration: { seconds: 60 * 60 * 3 },
     name: 'threeHours',
     interval: INTERVALS.hour,
   },
   {
-    label: __('8 hours'),
+    label: n__('1 hour', '%d hours', 8),
+    shortcut: '8_hours',
     duration: { seconds: 60 * 60 * 8 },
     name: 'eightHours',
     default: true,
     interval: INTERVALS.hour,
   },
   {
-    label: __('1 day'),
+    label: getTimeLabel(1),
+    shortcut: '1_day',
     duration: { seconds: 60 * 60 * 24 * 1 },
     name: 'oneDay',
     interval: INTERVALS.hour,
   },
   {
-    label: __('3 days'),
+    label: getTimeLabel(3),
+    shortcut: '3_days',
     duration: { seconds: 60 * 60 * 24 * 3 },
     name: 'threeDays',
     interval: INTERVALS.hour,
   },
   {
-    label: __('7 days'),
+    label: getTimeLabel(7),
+    shortcut: '7_days',
     duration: { seconds: 60 * 60 * 24 * 7 * 1 },
     name: 'oneWeek',
     interval: INTERVALS.day,
   },
   {
-    label: __('30 days'),
+    label: getTimeLabel(30),
+    shortcut: '30_days',
     duration: { seconds: 60 * 60 * 24 * 30 },
     name: 'oneMonth',
     interval: INTERVALS.day,
   },
 ];
+/* eslint-enable @gitlab/require-i18n-strings */
 
 export const defaultTimeRange = timeRanges.find((tr) => tr.default);
 export const getTimeWindow = (timeWindowName) =>