@dative-gpi/foundation-shared-services 1.0.7 → 1.0.10

package/composables/app/useAppTimeZone.ts

@@ -1,256 +1,145 @@
-import { format, subDays, addDays, addMilliseconds, parse } from "date-fns";
-import type { Locale } from "date-fns/locale";
-import { enUS, enGB, fr, it, es, de } from "date-fns/locale";
+import { addMilliseconds, format, parse, subDays } from "date-fns";
 import { computed, ref } from "vue";
 
 import { useTranslations as useTranslationsProvider } from "@dative-gpi/bones-ui/composables";
-import type { TimeZoneInfos } from "@dative-gpi/foundation-shared-domain/models";
-import { isoTimeFormat } from "@dative-gpi/foundation-shared-domain/tools";
+import { ISO_FORMAT, OPTIONS } from "@dative-gpi/foundation-shared-domain/tools";
 
 import { useAppLanguageCode } from "./useAppLanguageCode";
 
-const timeZone = ref<TimeZoneInfos | null>(null);
+const timeZone = ref<string | undefined>(undefined);
 
 export const useAppTimeZone = () => {
-  const setAppTimeZone = (payload: TimeZoneInfos) => {
+  const { $tr } = useTranslationsProvider();
+
+  const setAppTimeZone = (payload: string) => {
     timeZone.value = payload;
   };
 
-  const getOffsetNumber = (offsetString: string, hours: boolean = false): number => {
-    let offset = 0;
-    switch (offsetString.toLowerCase().replaceAll(" ", "")) {
-      case "utc-11:00:00": offset = -11; break;
-      case "utc-10:00:00": offset = -10; break;
-      case "utc-09:00:00": offset = -9; break;
-      case "utc-08:00:00": offset = -8; break;
-      case "utc-07:00:00": offset = -7; break;
-      case "utc-06:00:00": offset = -6; break;
-      case "utc-05:00:00": offset = -5; break;
-      case "utc-04:00:00": offset = -4; break;
-      case "utc-03:00:00": offset = -3; break;
-      case "utc-02:00:00": offset = -2; break;
-      case "utc-01:00:00": offset = -1; break;
-      case "utc+01:00:00": offset = +1; break;
-      case "utc+02:00:00": offset = +2; break;
-      case "utc+03:00:00": offset = +3; break;
-      case "utc+04:00:00": offset = +4; break;
-      case "utc+05:00:00": offset = +5; break;
-      case "utc+06:00:00": offset = +6; break;
-      case "utc+07:00:00": offset = +7; break;
-      case "utc+08:00:00": offset = +8; break;
-      case "utc+09:00:00": offset = +9; break;
-      case "utc+10:00:00": offset = +10; break;
-      case "utc+11:00:00": offset = +11; break;
-      case "utc+12:00:00": offset = +12; break;
-      case "utc+13:00:00": offset = +13; break;
-      case "utc+14:00:00": offset = +14; break;
+  const epochToShortDateFormat = (value: number | null | undefined): string => {
+    if (value == null || !isFinite(value)) {
+      return "";
     }
-    return hours ? offset : offset * 60 * 60 * 1000;
+    const date = new Date(value);
+    return date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value });
   };
 
-  const userOffset = (): number => {
-    return getOffsetNumber(getUserOffset());
+  const epochToLongDateFormat = (value: number | null | undefined): string => {
+    if (value == null || !isFinite(value)) {
+      return "";
+    }
+    const date = new Date(value);
+    const now = new Date();
+    if (date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value }) === now.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value })) {
+      return $tr("ui.time-zone.today", "Today");
+    }
+    if (date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value }) === subDays(now, 1).toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value })) {
+      return $tr("ui.time-zone.yesterday", "Yesterday");
+    }
+    const dateString = date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.longDate, timeZone: timeZone.value });
+    return dateString[0].toLocaleUpperCase() + dateString.slice(1);
   };
 
-  const machineOffset = (): number => {
-    return getOffsetNumber(getMachineOffset());
+  const epochToShortTimeFormat = (value: number | null | undefined): string => {
+    if (value == null || !isFinite(value)) {
+      return "";
+    }
+    const date = new Date(value);
+    return date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortTime, timeZone: timeZone.value });
   };
 
-  const getUserOffset = (): string => {
-    return timeZone?.value?.offset ?? "UTC +00:00:00";
+  const epochToLongTimeFormat = (value: number | null | undefined): string => {
+    if (value == null || !isFinite(value)) {
+      return "";
+    }
+    const date = new Date(value);
+    const now = new Date();
+    if (date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value }) === now.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value })) {
+      return `${$tr("ui.time-zone.today-at", "Today at")} ${date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.time, timeZone: timeZone.value })}`;
+    }
+    if (date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value }) === subDays(now, 1).toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.shortDate, timeZone: timeZone.value })) {
+      return `${$tr("ui.time-zone.yesterday-at", "Yesterday at")} ${date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.time, timeZone: timeZone.value })}`;
+    }
+    const dateString = date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.longTime, timeZone: timeZone.value });
+    return dateString[0].toLocaleUpperCase() + dateString.slice(1);
   };
 
-  const getUserOffsetMillis = (): number => {
-    const offset = timeZone?.value?.offset.slice(3) ?? "";
-    const matchData = offset.match(/([+-])(\d+)(?::(\d+))?/);
-    if (matchData) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      const [_, sign, hour, minute] = matchData;
-      return parseInt(sign + "1") * ((hour ? parseInt(hour) : 0) * 60 + (minute ? parseInt(minute) : 0)) * 60 * 1000;
+  const epochToTimeOnlyFormat = (value: number | null | undefined): string => {
+    if (value == null || !isFinite(value)) {
+      return "";
     }
-    return 0;
+    const date = new Date(value);
+    return date.toLocaleString(useAppLanguageCode().languageCode.value, { ...OPTIONS.time, timeZone: timeZone.value });
   };
 
-  const getMachineOffset = (): string => {
-    const timeZoneName = Intl.DateTimeFormat("ia", {
-      timeZoneName: "short",
-      timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
-    }).formatToParts().find((i) => i.type === "timeZoneName")?.value ?? "";
-
-    const offset = timeZoneName.slice(3);
-    if (!offset) {
-      return "UTC +00:00:00";
-    }
-    const matchData = offset.match(/([+-])(\d+)(?::(\d+))?/);
-    if (matchData) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      const [_, sign, hour, minute] = matchData;
-      return `UTC ${sign}${hour.padStart(2, "0")}:${(minute ?? "").padStart(2, "0")}:00`;
-    }
-    return "UTC +00:00:00";
+  const getOffsetUser = (): number => {
+    const offsetParts = (Intl.DateTimeFormat(undefined, {
+      timeZone: timeZone.value,
+      timeZoneName: "longOffset"
+    }).formatToParts(new Date).pop()?.value.slice(3) || "+00:00").split(':');
+    return (parseInt(offsetParts[0]) * 60 + parseInt(offsetParts[1])) * 60 * 1000;
   };
 
-  const getMachineOffsetMillis = (): number => {
-    const timeZoneName = Intl.DateTimeFormat("ia", {
-      timeZoneName: "short",
-      timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
-    }).formatToParts().find((i) => i.type === "timeZoneName")?.value ?? "";
+  const getOffsetMachine = (): number => {
+    const offsetParts = (Intl.DateTimeFormat(undefined, {
+      timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+      timeZoneName: "longOffset"
+    }).formatToParts(new Date).pop()?.value.slice(3) || "+00:00").split(':');
+    return (parseInt(offsetParts[0]) * 60 + parseInt(offsetParts[1])) * 60 * 1000;
+  };
 
-    const offset = timeZoneName.slice(3);
-    if (!offset) {
+  const getOffsetDifference = (): number => {
+    if (timeZone.value == null) {
       return 0;
     }
-    const matchData = offset.match(/([+-])(\d+)(?::(\d+))?/);
-    if (matchData) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      const [_, sign, hour, minute] = matchData;
-      return parseInt(sign + "1") * ((hour ? parseInt(hour) : 0) * 60 + (minute ? parseInt(minute) : 0)) * 60 * 1000;
-    }
-    return 0;
+    return getOffsetUser() - getOffsetMachine();
   };
 
-  const todayToEpoch = (resetHours: boolean): number => {
-    const today = new Date();
-    if (resetHours) {
-      today.setHours(0, 0, 0, 0);
-    }
-    return today.getTime() + getMachineOffsetMillis() - getUserOffsetMillis();
+  const todayToEpoch = (): number => {
+    return (new Date().getTime() + getOffsetDifference());
   };
 
   const pickerToEpoch = (value: Date | null | undefined): number => {
     if (value != null) {
-      // FSCalendar is always in machine time zone, so we need to convert it to user time zone
-      return value.getTime() + getMachineOffsetMillis() - getUserOffsetMillis();
+      return value.getTime() - getOffsetDifference();
     }
     return 0;
   };
 
   const epochToPicker = (value: number | null | undefined): Date => {
-    const date = new Date(0);
     if (value != null) {
-      // Epoch is always without time zone, so we need to convert it to user time zone
-      date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
+      return new Date(value + getOffsetDifference());
     }
-    return date;
+    return new Date(0);
   };
 
   const epochToPickerHeader = (value: number): { d: number, m: number, y: number } => {
-    const date = new Date(0);
-    if (value != null) {
-      date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    }
+    const date = epochToPicker(value);
     return { d: date.getDate(), m: date.getMonth(), y: date.getFullYear() };
   };
 
-  const epochToLongDateFormat = (value: number | null | undefined): string => {
-    if (value == null || !isFinite(value)) {
-      return "";
-    }
-    const date = new Date(0);
-    date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    return format(date, "EEEE dd LLLL yyyy", { locale: getLocale() });
-  };
-
-  const epochToLongTimeFormat = (value: number | null | undefined): string => {
-    if (value == null || !isFinite(value)) {
-      return "";
-    }
-    const date = new Date(0);
-    date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    return format(date, overrideFormat(date, "EEEE dd LLLL yyyy HH:mm"), { locale: getLocale() })
-  };
-
-  const epochToShortDateFormat = (value: number | null | undefined): string => {
-    if (value == null || !isFinite(value)) {
-      return "";
-    }
-    const date = new Date(0);
-    date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    switch (getLocale()) {
-      case enUS: {
-        return format(date, "MM/dd/yyyy", { locale: getLocale() });
-      }
-      default: {
-        return format(date, "dd/MM/yyyy", { locale: getLocale() });
-      }
-    }
-  };
-
-  const epochToTimeOnlyFormat = (value: number | null | undefined): string => {
-    if (value == null || !isFinite(value)) {
-      return "";
-    }
-    const date = new Date(0);
-    date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    return format(date, "HH:mm:ss", { locale: getLocale() });
-  };
-
-  const epochToShortTimeFormat = (value: number | null | undefined): string => {
-    if (value == null || !isFinite(value)) {
-      return "";
-    }
-    const date = new Date(0);
-    date.setUTCMilliseconds(value - getMachineOffsetMillis() + getUserOffsetMillis());
-    switch (getLocale()) {
-      case enUS: {
-        return format(date, "MM/dd/yyyy HH:mm", { locale: getLocale() });
-      }
-      default: {
-        return format(date, "dd/MM/yyyy HH:mm", { locale: getLocale() });
-      }
-    }
-  };
-
-  const todayTimeFormat = (): string => {
-    return `'${useTranslationsProvider().$tr("ui.time-zone.today-at", "Today at").replace(/'/g, "''")}' HH:mm:ss`;
-  };
-
-  const yesterdayTimeFormat = (): string => {
-    return `'${useTranslationsProvider().$tr("ui.time-zone.yesterday-at", "Yesterday at").replace(/'/g, "''")}' HH:mm:ss`;
-  };
-
-  const overrideFormat = (date: Date, askedFormat: string): string => {
-    const now = new Date();
-    if (date.toDateString() === now.toDateString()) {
-      return todayTimeFormat();
-    }
-    if (date.toDateString() === subDays(now, 1).toDateString()) {
-      return yesterdayTimeFormat();
-    }
-    return askedFormat;
+  const todayToPicker = (): string => {
+    const date = addMilliseconds(new Date(), -getOffsetMachine());
+    date.setSeconds(0, 0);
+    return format(date, ISO_FORMAT);
   };
 
-  const getLocale = (): Locale => {
-    switch (useAppLanguageCode().languageCode.value) {
-      case "fr-FR": return fr;
-      case "es-ES": return es;
-      case "it-IT": return it;
-      case "en-GB": return enGB;
-      case "de-DE": return de;
-      default: return enUS;
-    }
+  const yesterdayToPicker = (): string => {
+    const date = addMilliseconds(subDays(new Date(), 1), -getOffsetMachine());
+    date.setSeconds(0, 0);
+    return format(date, ISO_FORMAT);
   };
 
-  const parseForPicker = (value: string, dateFormat: string = isoTimeFormat()): number | null => {
-    let date = parse(value!, dateFormat, new Date());
-    date = addMilliseconds(date, userOffset());
+  const parseForPicker = (value: string, dateFormat: string = ISO_FORMAT): number | null => {
+    const date = addMilliseconds(parse(value, dateFormat, new Date()), getOffsetUser());
     if (!isFinite(date.getTime())) {
       return null;
     }
     return date.getTime();
   };
 
-  const formatCurrentForPicker = (daysOffset: number = -1): string => {
-    let date = new Date();
-    date.setSeconds(0, 0);
-    date = addMilliseconds(addDays(date, daysOffset), -machineOffset());
-    return format(date, isoTimeFormat());
-  };
-
   const formatFromPicker = (date: number | null): string => {
     if (date != null) {
-      const epoch = date - machineOffset() + (machineOffset() - userOffset());
-      return format(epoch, isoTimeFormat());
+      return format(date - getOffsetMachine(), ISO_FORMAT);
     }
     return "";
   };
@@ -259,7 +148,7 @@ export const useAppTimeZone = () => {
     if (epoch == null || !isFinite(epoch)) {
       return "";
     }
-    return format(epoch - machineOffset(), isoTimeFormat());
+    return format(epoch, ISO_FORMAT);
   };
 
   const ready = computed(() => timeZone.value !== null);
@@ -268,10 +157,6 @@ export const useAppTimeZone = () => {
     ready,
     timeZone,
     setAppTimeZone,
-    getUserOffset,
-    getMachineOffset,
-    getUserOffsetMillis,
-    getMachineOffsetMillis,
     todayToEpoch,
     pickerToEpoch,
     epochToPicker,
@@ -282,8 +167,12 @@ export const useAppTimeZone = () => {
     epochToShortTimeFormat,
     epochToTimeOnlyFormat,
     parseForPicker,
-    formatCurrentForPicker,
+    todayToPicker,
+    yesterdayToPicker,
     formatFromPicker,
-    formatEpochToVariable
+    formatEpochToVariable,
+    getOffsetUser,
+    getOffsetMachine,
+    getOffsetDifference
   };
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-shared-services",
   "sideEffects": false,
-  "version": "1.0.7",
+  "version": "1.0.10",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,7 +10,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-shared-domain": "1.0.7"
+    "@dative-gpi/foundation-shared-domain": "1.0.10"
   },
   "peerDependencies": {
     "@dative-gpi/bones-ui": "^0.0.75",
@@ -18,5 +18,5 @@
     "vue": "^3.4.29",
     "vue-router": "^4.3.0"
   },
-  "gitHead": "d0380d86664f9d28f757a4f2c0d06bf5cd9ca5e9"
+  "gitHead": "018a67489fc022344c90d45b02bfabdcd0dcefec"
 }