datetime.ts

import moment from "moment";

export enum DateTimeFormat {
  HUMAN,
  ISO,
}

export interface DateTimeFormatterProps {
  format: DateTimeFormat;
  date: Date;
}

type DateTimeFormatFn = (props: DateTimeFormatterProps) => string;

export interface DateTimeFormatter {
  formatDateTime: DateTimeFormatFn;
}

const momentFormats = {
  [DateTimeFormat.HUMAN]: (date: Date): string => {
    return moment(date).format("ddd, hA");
  },
  [DateTimeFormat.ISO]: (date: Date): string => {
    return date.toISOString();
  },
};

const momentFormatter: DateTimeFormatFn = (
  props: DateTimeFormatterProps
): string => {
  const { format, date } = props;

  return momentFormats[format](date);
};

export function useDateTimeFormatter(): DateTimeFormatter {
  return {
    formatDateTime: momentFormatter,
  };
}

FormattedDatetime.tsx

import {
  DateTimeFormat,
  DateTimeFormatterProps,
  useDateTimeFormatter,
} from "./utils/datetime";

export const FormattedDateTime = ({ format, date }: DateTimeFormatterProps) => {
  const { formatDateTime } = useDateTimeFormatter();

  return (
    <time
      dateTime={formatDateTime({
        format: DateTimeFormat.ISO,
        date,
      })}
    >
      {formatDateTime({ format, date })}
    </time>
  );
};