chore: reduces date-fns locales loaded

This commit is contained in:
James
2024-03-13 13:59:38 -04:00
parent a86c1b7cd3
commit 6ea456d6da
12 changed files with 92 additions and 129 deletions

View File

@@ -1,4 +1,6 @@
/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
import type { Metadata } from 'next'
import config from '@payload-config'
/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
import { RootPage, generatePageMetadata } from '@payloadcms/next/views/Root/index.js'
@@ -12,7 +14,7 @@ type Args = {
}
}
export const generateMetadata = ({ params, searchParams }: Args) =>
export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
generatePageMetadata({ config, params, searchParams })
const Page = ({ params, searchParams }: Args) => RootPage({ config, params, searchParams })

View File

@@ -1,4 +1,3 @@
export { AdminLayout } from './layouts/Admin/index.js'
export { RootLayout } from './layouts/Root/index.js'
export { Dashboard as DashboardPage } from './views/Dashboard/index.js'
export { Login } from './views/Login/index.js'

View File

@@ -1,28 +0,0 @@
import type { SanitizedConfig } from 'payload/types'
import { DefaultTemplate } from '@payloadcms/ui'
import '@payloadcms/ui/scss/app.scss'
import React from 'react'
import { initPage } from '../../utilities/initPage.js'
export const metadata = {
description: 'Generated by Next.js',
title: 'Next.js',
}
export const AdminLayout = async ({
children,
config,
}: {
children: React.ReactNode
config: Promise<SanitizedConfig> | SanitizedConfig
}) => {
const { permissions, req } = await initPage({ config })
return (
<DefaultTemplate config={config} i18n={req.i18n} permissions={permissions} user={req.user}>
{children}
</DefaultTemplate>
)
}

View File

@@ -1,25 +0,0 @@
import type { TFunction } from '@payloadcms/translations'
import type { SanitizedConfig } from 'payload/types'
import { initI18n } from '@payloadcms/translations'
import { translations } from '@payloadcms/translations/client'
import { cookies, headers } from 'next/headers.js'
import { getRequestLanguage } from './getRequestLanguage.js'
export const getNextT = async ({
config,
language,
}: {
config: SanitizedConfig
language?: string
}): Promise<TFunction> => {
const i18n = await initI18n({
config: config.i18n,
context: 'client',
language: language || getRequestLanguage({ cookies: cookies(), headers: headers() }),
translations,
})
return i18n.t
}

View File

@@ -1,38 +0,0 @@
/**
* sets request locale
*/
export default function localizationMiddleware(req, res, next) {
const localization = req.payload.config.localization
if (!localization) {
next()
return
}
const validLocales = [...localization.localeCodes, 'all']
const validFallbackLocales = [...localization.localeCodes, 'null']
let requestedLocale = req.query.locale || localization.defaultLocale
let requestedFallbackLocale = req.query['fallback-locale']
if (req.body) {
if (req.body.locale) requestedLocale = req.body.locale
if (req.body['fallback-locale']) {
requestedFallbackLocale = req.body['fallback-locale']
}
}
if (requestedFallbackLocale === 'none') requestedFallbackLocale = 'null'
if (requestedLocale === '*' || requestedLocale === 'all') {
requestedLocale = 'all'
}
req.fallbackLocale = validFallbackLocales.find((locale) => locale === requestedFallbackLocale)
req.locale = validLocales.find((locale) => locale === requestedLocale)
if (!req.fallbackLocale) {
req.fallbackLocale =
localization.locales.find(({ code }) => req.locale === code)?.fallbackLocale ||
localization.defaultLocale
}
next()
}

View File

@@ -1,15 +0,0 @@
const sanitizeFallbackLocale = (fallbackLocale) => {
if (
fallbackLocale === 'null' ||
fallbackLocale === 'none' ||
fallbackLocale === 'false' ||
fallbackLocale === false ||
fallbackLocale === null
) {
return null
}
return fallbackLocale
}
export default sanitizeFallbackLocale

View File

@@ -1,6 +1,5 @@
import type { ReactDatePickerProps } from 'react-datepicker'
import * as Locales from 'date-fns/locale'
import React from 'react'
import ReactDatePickerDefaultImport, { registerLocale } from 'react-datepicker'
const ReactDatePicker = (ReactDatePickerDefaultImport.default ||
@@ -12,7 +11,7 @@ import type { Props } from './types.js'
import { Calendar as CalendarIcon } from '../../icons/Calendar/index.js'
import { X as XIcon } from '../../icons/X/index.js'
import { useTranslation } from '../../providers/Translation/index.js'
import { getSupportedDateLocale } from '../../utilities/formatDate/getSupportedDateLocale.js'
import { getDateLocale } from '../../utilities/formatDate/getDateLocale.js'
import './index.scss'
const baseClass = 'date-time-picker'
@@ -37,12 +36,13 @@ const DateTime: React.FC<Props> = (props) => {
// Use the user's AdminUI language preference for the locale
const { i18n } = useTranslation()
const locale = getSupportedDateLocale(i18n.language)
const { locale, localeData } = getDateLocale(i18n.language)
try {
registerLocale(locale, Locales[locale])
registerLocale(locale, localeData)
} catch (e) {
console.warn(`Could not find DatePicker locale for ${locale}`)
console.warn(`Could not find DatePicker locale for ${i18n.language}`)
}
let dateFormat = customDisplayFormat

View File

@@ -0,0 +1,24 @@
import type { Locale } from 'date-fns'
import { dateLocales } from '../../utilities/formatDate/locales.js'
export const getDateLocale = (
locale = 'enUS',
): {
locale: string
localeData: Locale
} => {
const formattedLocales = {
en: 'enUS',
my: 'enUS', // Burmese is not currently supported
ua: 'uk',
zh: 'zhCN',
}
const formattedLocale = formattedLocales[locale] || locale
return {
locale: formattedLocale,
localeData: dateLocales[formattedLocale],
}
}

View File

@@ -1,10 +0,0 @@
export const getSupportedDateLocale = (locale = 'enUS'): string => {
const formattedLocales = {
en: 'enUS',
my: 'enUS', // Burmese is not currently supported
ua: 'uk',
zh: 'zhCN',
}
return formattedLocales[locale] || locale
}

View File

@@ -1,7 +1,6 @@
import { format, formatDistanceToNow } from 'date-fns'
import * as Locale from 'date-fns/locale'
import { getSupportedDateLocale } from './getSupportedDateLocale.js'
import { getDateLocale } from './getDateLocale.js'
export const formatDate = (
date: Date | number | string | undefined,
@@ -9,8 +8,8 @@ export const formatDate = (
locale?: string,
): string => {
const theDate = new Date(date)
const currentLocale = Locale[getSupportedDateLocale(locale)]
return format(theDate, pattern, { locale: currentLocale })
const { localeData } = getDateLocale(locale)
return format(theDate, pattern, { locale: localeData })
}
export const formatTimeToNow = (
@@ -18,6 +17,6 @@ export const formatTimeToNow = (
locale?: string,
): string => {
const theDate = new Date(date)
const currentLocale = Locale[getSupportedDateLocale(locale)]
return formatDistanceToNow(theDate, { locale: currentLocale })
const { localeData } = getDateLocale(locale)
return formatDistanceToNow(theDate, { locale: localeData })
}

View File

@@ -0,0 +1,55 @@
import ar from 'date-fns/locale/ar'
import az from 'date-fns/locale/az'
import bg from 'date-fns/locale/bg'
import cs from 'date-fns/locale/cs'
import de from 'date-fns/locale/de'
import enUS from 'date-fns/locale/en-US'
import es from 'date-fns/locale/es'
import faIR from 'date-fns/locale/fa-IR'
import fr from 'date-fns/locale/fr'
import hr from 'date-fns/locale/hr'
import hu from 'date-fns/locale/hu'
import it from 'date-fns/locale/it'
import ja from 'date-fns/locale/ja'
import ko from 'date-fns/locale/ko'
import nb from 'date-fns/locale/nb'
import nl from 'date-fns/locale/nl'
import pl from 'date-fns/locale/pl'
import pt from 'date-fns/locale/pt'
import ro from 'date-fns/locale/ro'
import ru from 'date-fns/locale/ru'
import sv from 'date-fns/locale/sv'
import th from 'date-fns/locale/th'
import tr from 'date-fns/locale/tr'
import vi from 'date-fns/locale/vi'
import zhCN from 'date-fns/locale/zh-CN'
import zhTW from 'date-fns/locale/zh-TW'
export const dateLocales = {
ar,
az,
bg,
cs,
de,
enUS,
es,
fa: faIR,
fr,
hr,
hu,
it,
ja,
ko,
nb,
nl,
pl,
pt,
ro,
ru,
sv,
th,
tr,
vi,
zh: zhCN,
'zh-tw': zhTW,
}