From 3afb5b497f10ad7981a45d3f6345c3dd572da240 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Thu, 1 Aug 2024 13:39:26 +0200
Subject: [PATCH] fix(web): correctly format future timeline dates (#11506)

---
 web/src/lib/utils/timeline-util.spec.ts | 22 +++++++++++++++++-----
 web/src/lib/utils/timeline-util.ts      |  2 +-
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/web/src/lib/utils/timeline-util.spec.ts b/web/src/lib/utils/timeline-util.spec.ts
index 863b6e613a..4643ae1218 100644
--- a/web/src/lib/utils/timeline-util.spec.ts
+++ b/web/src/lib/utils/timeline-util.spec.ts
@@ -1,3 +1,4 @@
+import { parseUtcDate } from '$lib/utils/date-time';
 import { formatGroupTitle } from '$lib/utils/timeline-util';
 import { DateTime } from 'luxon';
 
@@ -12,35 +13,46 @@ describe('formatGroupTitle', () => {
   });
 
   it('formats today', () => {
-    const date = DateTime.fromISO('2024-07-27T01:00:00Z');
+    const date = parseUtcDate('2024-07-27T01:00:00Z');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('today');
     expect(formatGroupTitle(date.setLocale('es'))).toBe('hoy');
   });
 
   it('formats yesterday', () => {
-    const date = DateTime.fromISO('2024-07-26T23:59:59Z');
+    const date = parseUtcDate('2024-07-26T23:59:59Z');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('yesterday');
     expect(formatGroupTitle(date.setLocale('fr'))).toBe('hier');
   });
 
   it('formats last week', () => {
-    const date = DateTime.fromISO('2024-07-21T00:00:00Z');
+    const date = parseUtcDate('2024-07-21T00:00:00Z');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('Sunday');
     expect(formatGroupTitle(date.setLocale('ar-SA'))).toBe('الأحد');
   });
 
   it('formats date 7 days ago', () => {
-    const date = DateTime.fromISO('2024-07-20T00:00:00Z');
+    const date = parseUtcDate('2024-07-20T00:00:00Z');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('Sat, Jul 20');
     expect(formatGroupTitle(date.setLocale('de'))).toBe('Sa., 20. Juli');
   });
 
   it('formats date this year', () => {
-    const date = DateTime.fromISO('2020-01-01T00:00:00Z');
+    const date = parseUtcDate('2020-01-01T00:00:00Z');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('Wed, Jan 1, 2020');
     expect(formatGroupTitle(date.setLocale('ja'))).toBe('2020年1月1日(水)');
   });
 
+  it('formats future date', () => {
+    const tomorrow = parseUtcDate('2024-07-28T00:00:00Z');
+    expect(formatGroupTitle(tomorrow.setLocale('en'))).toBe('Sun, Jul 28');
+
+    const nextMonth = parseUtcDate('2024-08-28T00:00:00Z');
+    expect(formatGroupTitle(nextMonth.setLocale('en'))).toBe('Wed, Aug 28');
+
+    const nextYear = parseUtcDate('2025-01-10T12:00:00Z');
+    expect(formatGroupTitle(nextYear.setLocale('en'))).toBe('Fri, Jan 10, 2025');
+  });
+
   it('returns "Invalid DateTime" when date is invalid', () => {
     const date = DateTime.invalid('test');
     expect(formatGroupTitle(date.setLocale('en'))).toBe('Invalid DateTime');
diff --git a/web/src/lib/utils/timeline-util.ts b/web/src/lib/utils/timeline-util.ts
index fe5f799bc3..76a0d1b5cb 100644
--- a/web/src/lib/utils/timeline-util.ts
+++ b/web/src/lib/utils/timeline-util.ts
@@ -32,7 +32,7 @@ export function formatGroupTitle(_date: DateTime): string {
   }
 
   // Last week
-  if (date >= today.minus({ days: 6 })) {
+  if (date >= today.minus({ days: 6 }) && date < today) {
     return date.toLocaleString({ weekday: 'long' });
   }