fix: relative hours for email reset in notifications overview

`Tooltip` of `Email Notifications` showed timestamp instead of `relative time`

BEDS-941

frontend/components/notifications/NotificationsOverview.vue

@@ -30,10 +30,13 @@ const notificationsTotal = computed(() => {
 const { user } = useUserStore()
 const mailLimit = computed(() => user.value?.premium_perks.email_notifications_per_day ?? 0)
 
-const resetHours = computed(() => overview.value?.next_email_count_reset_timestamp ?? 0)
+const resetHours = computed(
+  () => getRelativeTime(overview.value?.next_email_count_reset_timestamp ?? 0),
+)
+
 const tooltipEmail = computed(() => {
   return $t('notifications.overview.email_tooltip', {
-    hours: resetHours.value,
+    in_x_hours: resetHours.value,
     limit: mailLimit.value,
   })
 })

frontend/i18n/locales/en.json

@@ -798,7 +798,7 @@
     },
     "overview": {
       "email_activate": "Click here to activate Email notifications",
-      "email_tooltip": "Your current limit is { limit } emails per day. Your email limit resets in { hours } hours. Upgrade to premium for more.",
+      "email_tooltip": "Your current limit is { limit } emails per day. Your email limit resets { in_x_hours }. Upgrade to premium for more.",
       "headers": {
         "account_groups": "Most notified account groups",
         "email_notifications": "Email Notifications",

frontend/utils/time.ts

@@ -49,3 +49,21 @@ export const formatSecondsTo = (seconds: number,
     minutes,
   }
 }
+
+export const getRelativeTime = (timestampInSeconds: number, {
+  locale = 'en-US',
+}: {
+  locale?: string,
+} = {}) => {
+  const seconds = timestampInSeconds - (Date.now() / 1000)
+  const minutes = (seconds / 60)
+  const hours = (minutes / 60)
+
+  if (hours >= 1 || hours <= -1) {
+    return new Intl.RelativeTimeFormat(locale).format(Math.round(hours), 'hours')
+  }
+  if (minutes >= 1 || minutes <= -1) {
+    return new Intl.RelativeTimeFormat(locale).format(Math.round(minutes), 'minutes')
+  }
+  return new Intl.RelativeTimeFormat(locale).format(Math.round(seconds), 'seconds')
+}