Add support for hovering over some dates to see the non-recent day

plan-player-analytics · Mar 26, 2024 · 1bb9437 · 1bb9437
1 parent fff2f32
commit 1bb9437
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/Plan/react/dashboard/src/components/navigation/Header.jsx b/Plan/react/dashboard/src/components/navigation/Header.jsx
@@ -58,7 +58,7 @@ const Header = ({page, tab, hideUpdater}) => {
                     </button>}
                     {staticSite && <Fa icon={faClockRotateLeft} title={t('html.label.exported')}/>}
                     {' '}
-                    <span className="refresh-time"><FormattedDate date={lastUpdate.date}/></span>
+                    <span className="refresh-time"><FormattedDate date={lastUpdate.date} react/></span>
                 </div>
             </>}
 

diff --git a/Plan/react/dashboard/src/components/text/FormattedDate.jsx b/Plan/react/dashboard/src/components/text/FormattedDate.jsx
@@ -40,14 +40,20 @@ export function formatDate(date, offset, pattern, recentDays, recentDaysPattern,
     return date !== 0 ? new SimpleDateFormat(format).format(timestamp) : '-'
 }
 
-const FormattedDate = ({date}) => {
+const FormattedDate = ({date, react}) => {
     const {t} = useTranslation();
 
     const {pattern, recentDays, recentDaysPattern, offset} = useDatePreferences();
 
     if (!pattern || date === undefined || date === null) return <></>;
     if (!isNumber(date)) return date;
 
+    if (react) {
+        return <span title={formatDate(date, offset, pattern, false, null, t)}>
+            {formatDate(date, offset, pattern, recentDays, recentDaysPattern, t)}
+        </span>
+    }
+
     return formatDate(date, offset, pattern, recentDays, recentDaysPattern, t);
 };