Implement getFormatHelperText for luxon

[bhadreshdesai]

You can implement the getFormatHelperText for luxon based on the comments from the following stackoverflow answer

https://stackoverflow.com/a/69095836

const getDateFormatPattern = (
  locale: string,
  options: Intl.DateTimeFormatOptions
) => {
  const getPatternForPart = (part: Intl.DateTimeFormatPart) => {
    switch (part.type) {
      case "day":
        return "d".repeat(part.value.length);
      case "month":
        return "m".repeat(part.value.length);
      case "year":
        return "y".repeat(part.value.length);
      case "literal":
        return part.value;
      case "weekday":
        return "e".repeat(part.value.length);
      case "hour":
        return "h".repeat(part.value.length);
      case "minute":
        return "m".repeat(part.value.length);
      case "second":
        return "s".repeat(part.value.length);
      case "dayPeriod":
        return "(a|p)m";
      default:
        console.log("Unsupported date part", part);
        return "";
    }
  };

  return new Intl.DateTimeFormat(locale, options)
    .formatToParts(new Date("2021-01-01T21:21:21+0000"))
    .map(getPatternForPart)
    .join("");
};


public getFormatHelperText = (format: string) => {
  if (typeof Intl === "undefined" || typeof Intl.DateTimeFormat === "undefined") {
    return "";
  }
  const formatKey = Object.keys(this.formats).find(
    (key) => this.formats[key] === format
  );
  let formatHelperText = "";
  switch (formatKey) {
    case "dayOfMonth":
      formatHelperText = getDateFormatPattern(this.locale, { day: "numeric" });
      break;
    case "fullDate":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short",
        year: "numeric"
      });
      break;
    case "fullDateWithWeekday":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short",
        year: "numeric",
        weekday: "long"
      });
      break;
    case "fullDateTime":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short",
        year: "numeric",
        hour: "numeric",
        minute: "numeric"
      });
      break;
    case "fullDateTime12h":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short",
        year: "numeric",
        hour: "numeric",
        minute: "numeric",
        hour12: true
      });
      break;
    case "fullDateTime24h":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short",
        year: "numeric",
        hour: "numeric",
        minute: "numeric"
      });
      break;
    case "fullTime":
      formatHelperText = getDateFormatPattern(this.locale, {
        hour: "2-digit",
        minute: "2-digit"
      });
      break;
    case "fullTime12h":
      formatHelperText = getDateFormatPattern(this.locale, {
        hour: "2-digit",
        minute: "2-digit",
        hour12: true
      });
      break;
    case "fullTime24h":
      formatHelperText = getDateFormatPattern(this.locale, {
        hour: "2-digit",
        minute: "2-digit"
      });
      break;
    case "hours12h":
      formatHelperText = getDateFormatPattern(this.locale, {
        hour: "2-digit",
        hour12: true
      });
      break;
    case "hours24h":
      formatHelperText = getDateFormatPattern(this.locale, { hour: "2-digit" });
      break;
    case "keyboardDate":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "numeric",
        year: "numeric"
      });
      break;
    case "keyboardDateTime":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "numeric",
        year: "numeric",
        hour: "2-digit",
        minute: "2-digit"
      });
      break;
    case "keyboardDateTime12h":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "numeric",
        year: "numeric",
        hour: "2-digit",
        minute: "2-digit",
        hour12: true
      });
      break;
    case "keyboardDateTime24h":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "numeric",
        year: "numeric",
        hour: "2-digit",
        minute: "2-digit"
      });
      break;
    case "minutes":
      formatHelperText = getDateFormatPattern(this.locale, { minute: "2-digit" });
      break;
    case "month":
      formatHelperText = getDateFormatPattern(this.locale, { month: "long" });
      break;
    case "monthAndDate":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "long"
      });
      break;
    case "monthAndYear":
      formatHelperText = getDateFormatPattern(this.locale, {
        month: "long",
        year: "numeric"
      });
      break;
    case "monthShort":
      formatHelperText = getDateFormatPattern(this.locale, { month: "short" });
      break;
    case "weekday":
      formatHelperText = getDateFormatPattern(this.locale, { weekday: "long" });
      break;
    case "weekdayShort":
      formatHelperText = getDateFormatPattern(this.locale, { weekday: "short" });
      break;
    case "normalDate":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "long"
      });
      break;
    case "normalDateWithWeekday":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "long",
        weekday: "long"
      });
      break;
    case "seconds":
      formatHelperText = getDateFormatPattern(this.locale, { second: "2-digit" });
      break;
    case "shortDate":
      formatHelperText = getDateFormatPattern(this.locale, {
        day: "numeric",
        month: "short"
      });
      break;
    case "year":
      formatHelperText = getDateFormatPattern(this.locale, { year: "numeric" });
      break;
    default:
  }
  return formatHelperText;
}