Use "DayJs" instead of "Date"

src/lib/dayjs/Setup.ts

@@ -8,10 +8,30 @@
 
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
+import calendar from 'dayjs/plugin/calendar';
+import relativeTime from 'dayjs/plugin/relativeTime';
+import isToday from 'dayjs/plugin/isToday';
+import isYesterday from 'dayjs/plugin/isYesterday';
+// import localizedFormat from 'dayjs/plugin/localizedFormat';
+// import updateLocale from 'dayjs/plugin/updateLocale';
+// import { t } from 'i18next';
+
 import { loadDayJsLocale } from '@/util/language.tsx';
 
 dayjs.extend(customParseFormat);
+dayjs.extend(calendar);
+dayjs.extend(relativeTime);
+dayjs.extend(isToday);
+dayjs.extend(isYesterday);
+// dayjs.extend(localizedFormat);
+// dayjs.extend(updateLocale);
 
 loadDayJsLocale(navigator.language).then(() => {
     dayjs.locale(navigator.language);
+    // dayjs.updateLocale(navigator.language, {
+    //     calendar: {
+    //         lastDay: `[${t('global.date.label.yesterday_at')}] LT`,
+    //         sameDay: `[${t('global.date.label.today_at')}] LT`,
+    //     },
+    // });
 });

src/screens/settings/About.tsx

@@ -29,6 +29,7 @@ import { LoadingPlaceholder } from '@/components/util/LoadingPlaceholder';
 import { GetAboutQuery, UpdateState } from '@/lib/graphql/generated/graphql.ts';
 import { defaultPromiseErrorHandler } from '@/util/defaultPromiseErrorHandler.ts';
 import { EmptyViewAbsoluteCentered } from '@/components/util/EmptyViewAbsoluteCentered.tsx';
+import { epochToDate } from '@/util/date.ts';
 
 type AboutServer = GetAboutQuery['aboutServer'];
 
@@ -37,7 +38,7 @@ export const getVersion = (aboutServer: AboutServer) => {
     return `${aboutServer.version}-${aboutServer.revision}`;
 };
 
-const getBuildTime = (aboutServer: AboutServer) => new Date(Number(aboutServer.buildTime) * 1000).toUTCString();
+const getBuildTime = (aboutServer: AboutServer) => epochToDate(Number(aboutServer.buildTime)).toString();
 
 const getUpdateCheckButtonIcon = (
     isLoading: boolean,

src/util/date.ts

@@ -6,6 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
+import dayjs, { Dayjs } from 'dayjs';
 import { t } from 'i18next';
 
 export const timeFormatter = new Intl.DateTimeFormat(navigator.language, { hour: '2-digit', minute: '2-digit' });
@@ -22,16 +23,9 @@ export const dateTimeFormatter = new Intl.DateTimeFormat(navigator.language, {
     minute: '2-digit',
 });
 
-export const epochToDate = (epoch: number): Date => {
+export const epochToDate = (epoch: number): Dayjs => dayjs.unix(epoch);
-    const date = new Date(0); // The 0 there is the key, which sets the date to the epoch
-    date.setUTCSeconds(epoch);
-    return date;
-};
 
-export const isTheSameDay = (first: Date, second: Date): boolean =>
+export const isSameDay = (first: Dayjs, second: Dayjs): boolean => first.isSame(second, 'day');
-    first.getDate() === second.getDate() &&
-    first.getMonth() === second.getMonth() &&
-    first.getFullYear() === second.getFullYear();
 
 /**
  * Returns a string in localized format for the passed date.
@@ -41,9 +35,9 @@ export const isTheSameDay = (first: Date, second: Date): boolean =>
  * Optionally this special string can include the localized time of the passed date ("Today/Yesterday at HH:mm").
  *
  * @example
- * const today = new Date();
+ * const today = dayjs();
- * const yesterday = new Date(today.getTime() - 1000 * 60 * 60 * 24);
+ * const yesterday = today.subtract(1, 'day');
- * const someDate = new Date(1337, 4, 20);
+ * const someDate = dayjs('1377-04-20');
  *
  * const todayAsString = getDateString(today); // => "Today"
  * const yesterdayAsString = getDateString(yesterday, true) // => "Yesterday at 02:50 AM"
@@ -53,20 +47,11 @@ export const isTheSameDay = (first: Date, second: Date): boolean =>
  * @param date
  * @param withTime
  */
-export const getDateString = (date: Date | number, withTime: boolean = false) => {
+export const getDateString = (date: Dayjs | number, withTime: boolean = false) => {
-    const actualDate = date instanceof Date ? date : new Date(date);
+    const actualDate = date instanceof dayjs ? date : dayjs(date);
+    const timeString = timeFormatter.format(actualDate.toDate());
 
-    const today = new Date();
+    if (actualDate.isToday()) {
-    const yesterday = new Date();
-    yesterday.setDate(today.getDate() - 1);
-
-    const wasUploadedToday = isTheSameDay(today, actualDate);
-    const wasUploadedYesterday = isTheSameDay(yesterday, actualDate);
-
-    const addTimeString = wasUploadedToday || wasUploadedYesterday;
-    const timeString = addTimeString ? timeFormatter.format(actualDate) : '';
-
-    if (wasUploadedToday) {
         if (withTime) {
             return t('global.date.label.today_at', { timeString });
         }
@@ -74,7 +59,7 @@ export const getDateString = (date: Date | number, withTime: boolean = false) =>
         return t('global.date.label.today');
     }
 
-    if (wasUploadedYesterday) {
+    if (actualDate.isYesterday()) {
         if (withTime) {
             return t('global.date.label.yesterday_at', { timeString });
         }
@@ -82,5 +67,5 @@ export const getDateString = (date: Date | number, withTime: boolean = false) =>
         return t('global.date.label.yesterday');
     }
 
-    return dateFormatter.format(actualDate);
+    return dateFormatter.format(actualDate.toDate());
 };