430ebd42ff
Adds support for timezone selection on date fields.
### Summary
New `admin.timezones` config:
```ts
{
// ...
admin: {
// ...
timezones: {
supportedTimezones: ({ defaultTimezones }) => [
...defaultTimezones,
{ label: '(GMT-6) Monterrey, Nuevo Leon', value: 'America/Monterrey' },
],
defaultTimezone: 'America/Monterrey',
},
}
}
```
New `timezone` property on date fields:
```ts
{
type: 'date',
name: 'date',
timezone: true,
}
```
### Configuration
All date fields now accept `timezone: true` to enable this feature,
which will inject a new field into the configuration using the date
field's name to construct the name for the timezone column. So
`publishingDate` will have `publishingDate_tz` as an accompanying
column. This new field is inserted during config sanitisation.
Dates continue to be stored in UTC, this will help maintain dates
without needing a migration and it makes it easier for data to be
manipulated as needed. Mongodb also has a restriction around storing
dates only as UTC.
All timezones are stored by their IANA names so it's compatible with
browser APIs. There is a newly generated type for `SupportedTimezones`
which is reused across fields.
We handle timezone calculations via a new package `@date-fns/tz` which
we will be using in the future for handling timezone aware scheduled
publishing/unpublishing and more.
### UI
Dark mode
Light mode
28 lines
917 B
TypeScript
28 lines
917 B
TypeScript
import type { DateField } from '../../payload-types.js'
|
|
|
|
export const dateDoc: Partial<DateField> = {
|
|
default: '2022-08-12T10:00:00.000+00:00',
|
|
timeOnly: '2022-08-12T10:00:00.157+00:00',
|
|
timeOnlyWithCustomFormat: '2022-08-12T10:00:00.157+00:00',
|
|
dayOnly: '2022-08-11T22:00:00.000+00:00',
|
|
dayAndTime: '2022-08-12T10:00:00.052+00:00',
|
|
monthOnly: '2022-07-31T22:00:00.000+00:00',
|
|
defaultWithTimezone: '2027-08-12T10:00:00.000+00:00',
|
|
defaultWithTimezone_tz: 'Europe/London',
|
|
dayAndTimeWithTimezone: '2027-08-12T01:00:00.000+00:00', // 10AM tokyo time — we will test for this in e2e
|
|
dayAndTimeWithTimezone_tz: 'Asia/Tokyo',
|
|
timezoneBlocks: [
|
|
{
|
|
blockType: 'dateBlock',
|
|
dayAndTime: '2025-01-31T09:00:00.000Z',
|
|
dayAndTime_tz: 'Europe/Berlin',
|
|
},
|
|
],
|
|
timezoneArray: [
|
|
{
|
|
dayAndTime: '2025-01-31T09:00:00.549Z',
|
|
dayAndTime_tz: 'Europe/Berlin',
|
|
},
|
|
],
|
|
}
|