Fix time and date-time 12h formats (#16692) (#16805)

* Fix time and date-time 12h formats  (#16692)

- am/pm check possible for other languages
- adjusted date format gallery page for consistency
- added gallery pages for date-time and time formats

* Fix typo in am/pm check (#16692)
This commit is contained in:
Christoph Wen, B.Sc
2023-06-20 12:52:53 +02:00
committed by GitHub
parent baaa012101
commit 922e95b895
21 changed files with 1227 additions and 94 deletions

View File

@@ -15,20 +15,15 @@ export const formatDateTime = (
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,
}
)
new Intl.DateTimeFormat(locale.language, {
year: "numeric",
month: "long",
day: "numeric",
hour: useAmPm(locale) ? "numeric" : "2-digit",
minute: "2-digit",
hourCycle: useAmPm(locale) ? "h12" : "h23",
timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
})
);
// Aug 9, 2021, 8:23 AM
@@ -40,20 +35,15 @@ export const formatShortDateTimeWithYear = (
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,
}
)
new Intl.DateTimeFormat(locale.language, {
year: "numeric",
month: "short",
day: "numeric",
hour: useAmPm(locale) ? "numeric" : "2-digit",
minute: "2-digit",
hourCycle: useAmPm(locale) ? "h12" : "h23",
timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
})
);
// Aug 9, 8:23 AM
@@ -65,19 +55,14 @@ export const formatShortDateTime = (
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,
}
)
new Intl.DateTimeFormat(locale.language, {
month: "short",
day: "numeric",
hour: useAmPm(locale) ? "numeric" : "2-digit",
minute: "2-digit",
hourCycle: useAmPm(locale) ? "h12" : "h23",
timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
})
);
// August 9, 2021, 8:23:15 AM
@@ -89,21 +74,16 @@ export const formatDateTimeWithSeconds = (
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,
}
)
new Intl.DateTimeFormat(locale.language, {
year: "numeric",
month: "long",
day: "numeric",
hour: useAmPm(locale) ? "numeric" : "2-digit",
minute: "2-digit",
second: "2-digit",
hourCycle: useAmPm(locale) ? "h12" : "h23",
timeZone: locale.time_zone === "server" ? serverTimeZone : undefined,
})
);
// 9/8/2021, 8:23 AM