From 9d19d61913729dc08cc8ddc390fd557ca52b69bd Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Thu, 11 Mar 2021 07:20:38 +0300
Subject: [PATCH] show time/weekday in tooltip for style entries (#1205)

---
 js/localization.js | 26 ++++++++++++++++++++------
 manage/events.js   |  4 ++--
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/js/localization.js b/js/localization.js
index 37d3aa19..da62ec75 100644
--- a/js/localization.js
+++ b/js/localization.js
@@ -140,17 +140,31 @@ Object.assign(t, {
     }
   },
 
-  formatDate(date) {
+  _intl: null,
+  _intlY: null,
+  _intlYHM: null,
+  _intlWYHM: null,
+
+  formatDate(date, needsTime) {
     if (!date) {
       return '';
     }
     try {
+      const now = new Date();
       const newDate = new Date(Number(date) || date);
-      const string = newDate.toLocaleDateString([chrome.i18n.getUILanguage(), 'en'], {
-        day: '2-digit',
-        month: 'short',
-        year: newDate.getYear() === new Date().getYear() ? undefined : '2-digit',
-      });
+      const needsYear = newDate.getYear() !== now.getYear();
+      const needsWeekDay = needsTime && (now - newDate <= 7 * 24 * 3600e3);
+      const intlKey = `_intl${needsWeekDay ? 'W' : ''}${needsYear ? 'Y' : ''}${needsTime ? 'HM' : ''}`;
+      const intl = t[intlKey] ||
+        (t[intlKey] = new Intl.DateTimeFormat([chrome.i18n.getUILanguage(), 'en'], {
+          day: 'numeric',
+          month: 'short',
+          year: needsYear ? '2-digit' : undefined,
+          hour: needsTime ? 'numeric' : undefined,
+          minute: needsTime ? '2-digit' : undefined,
+          weekday: needsWeekDay ? 'long' : undefined,
+        }));
+      const string = intl.format(newDate);
       return string === 'Invalid Date' ? '' : string;
     } catch (e) {
       return '';
diff --git a/manage/events.js b/manage/events.js
index 0e77c066..826807e2 100644
--- a/manage/events.js
+++ b/manage/events.js
@@ -23,8 +23,8 @@ const Events = {
     const style = link.closest('.entry').styleMeta;
     const ucd = style.usercssData;
     link.title =
-      `${t('dateInstalled')}: ${t.formatDate(style.installDate) || '—'}\n` +
-      `${t('dateUpdated')}: ${t.formatDate(style.updateDate) || '—'}\n` +
+      `${t('dateInstalled')}: ${t.formatDate(style.installDate, true) || '—'}\n` +
+      `${t('dateUpdated')}: ${t.formatDate(style.updateDate, true) || '—'}\n` +
       (ucd ? `UserCSS, v.${ucd.version}` : '');
   },