frontend/src/common/datetime/format_date_time.ts

import { HassConfig } from "home-assistant-js-websocket";
import memoizeOne from "memoize-one";
import { FrontendLocaleData } from "../../data/translation";
import "../../resources/intl-polyfill";
import { formatDateNumeric } from "./format_date";
import { formatTime } from "./format_time";
import { useAmPm } from "./use_am_pm";

// August 9, 2021, 8:23 AM
export const formatDateTime = (
  dateObj: Date,
  locale: FrontendLocaleData,
  config: HassConfig
) => formatDateTimeMem(locale, config.time_zone).format(dateObj);

const formatDateTimeMem = memoizeOne(
  (locale: FrontendLocaleData, serverTimeZone: string) =>
    new Intl.DateTimeFormat(
      locale.language === "en" && !useAmPm(locale)
        ? "en-u-hc-h23"
        : locale.language,
      {
        year: "numeric",
        month: "long",
        day: "numeric",
        hour: useAmPm(locale) ? "numeric" : "2-digit",
        minute: "2-digit",
        hour12: useAmPm(locale),
        timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
      }
    )
);

// Aug 9, 2021, 8:23 AM
export const formatShortDateTimeWithYear = (
  dateObj: Date,
  locale: FrontendLocaleData,
  config: HassConfig
) => formatShortDateTimeWithYearMem(locale, config.time_zone).format(dateObj);

const formatShortDateTimeWithYearMem = memoizeOne(
  (locale: FrontendLocaleData, serverTimeZone: string) =>
    new Intl.DateTimeFormat(
      locale.language === "en" && !useAmPm(locale)
        ? "en-u-hc-h23"
        : locale.language,
      {
        year: "numeric",
        month: "short",
        day: "numeric",
        hour: useAmPm(locale) ? "numeric" : "2-digit",
        minute: "2-digit",
        hour12: useAmPm(locale),
        timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
      }
    )
);

// Aug 9, 8:23 AM
export const formatShortDateTime = (
  dateObj: Date,
  locale: FrontendLocaleData,
  config: HassConfig
) => formatShortDateTimeMem(locale, config.time_zone).format(dateObj);

const formatShortDateTimeMem = memoizeOne(
  (locale: FrontendLocaleData, serverTimeZone: string) =>
    new Intl.DateTimeFormat(
      locale.language === "en" && !useAmPm(locale)
        ? "en-u-hc-h23"
        : locale.language,
      {
        month: "short",
        day: "numeric",
        hour: useAmPm(locale) ? "numeric" : "2-digit",
        minute: "2-digit",
        hour12: useAmPm(locale),
        timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
      }
    )
);

// August 9, 2021, 8:23:15 AM
export const formatDateTimeWithSeconds = (
  dateObj: Date,
  locale: FrontendLocaleData,
  config: HassConfig
) => formatDateTimeWithSecondsMem(locale, config.time_zone).format(dateObj);

const formatDateTimeWithSecondsMem = memoizeOne(
  (locale: FrontendLocaleData, serverTimeZone: string) =>
    new Intl.DateTimeFormat(
      locale.language === "en" && !useAmPm(locale)
        ? "en-u-hc-h23"
        : locale.language,
      {
        year: "numeric",
        month: "long",
        day: "numeric",
        hour: useAmPm(locale) ? "numeric" : "2-digit",
        minute: "2-digit",
        second: "2-digit",
        hour12: useAmPm(locale),
        timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
      }
    )
);

// 9/8/2021, 8:23 AM
export const formatDateTimeNumeric = (
  dateObj: Date,
  locale: FrontendLocaleData,
  config: HassConfig
) =>
  `${formatDateNumeric(dateObj, locale, config)}, ${formatTime(
    dateObj,
    locale,
    config
  )}`;