Skip to content

Relation widget: Make a datetime widget in displayFields use the specified dateFormat/timeFormat instead of UTC #3421

@sholtrop

Description

@sholtrop

Is your feature request related to a problem? Please describe.
When displayFields inside a Relation widget references another collection's DateTime widget, it will display it in a (rather ugly) UTC format in the CMS menu, even if that referenced DateTime has a dateFormat and timeFormat specified:
image
This does not seem very user-friendly.
Relevant config:

collections:
  - name: 'blog_en'
    label: 'Blog post (English)'
    format: 'json'
    folder: 'assets/content/blogPostsEN'
    create: true
    slug: '{{slug}}'
    editor:
      preview: false
    fields:
      - label: 'Title'
        name: 'title'
        widget: 'string'
      - label: 'Published'
        name: 'published'
        dateFormat: 'YYYY-M-D' # <--- Display in this format!
        timeFormat: 'H:m:s' # <--- Display in this format!
        widget: datetime
      - label: 'Body'
        name: 'body'
        widget: markdown
      - label: Dutch translation
        name: translationNL
        widget: relation
        required: false
        collection: blog_nl
        searchFields: ['title']
        valueField: 'title'
        displayFields: ['title', 'published']

      - label: Japanese translation
        name: translationJA
        widget: relation
        required: false
        collection: blog_ja
        searchFields: ['blog_ja.title']
        valueField: 'blog_ja.title'
        displayFields: ['title', 'published']

  - name: 'blog_ja'
    label: 'Blog post (Japanese)'
    format: 'json'
    folder: 'assets/content/blogPostsJA'
    create: true
    slug: '{{slug}}'
    editor:
      preview: false
    fields:
      - label: 'Title'
        name: 'title'
        widget: 'string'
      - label: 'Published'
        name: 'published'
        dateFormat: 'YYYY-M-D'
        widget: datetime
        timeFormat: 'H:m:s'
      - label: 'Body'
        name: 'body'
        widget: markdown
      - label: Dutch translation
        name: translationNL
        widget: relation
        required: false
        collection: blog_nl
        searchFields: ['title']
        valueField: 'title'
        displayFields: ['title', 'published']
      - label: English translation
        name: translationEN
        widget: relation
        required: false
        collection: blog_en
        searchFields: ['title']
        valueField: 'title'
        displayFields: ['title', 'published']

Describe the solution you'd like
My proposed solution is having the CMS display the date according to the dateFormat and timeFormat specified in the referenced DateTime widget, and have it display like this for example:
image
This makes it consistent with the format you see when you picked the DateTime of the referenced collection.
Describe alternatives you've considered
I suppose changing the format (which it is saved in) of the referenced DateTime would work too, but that seems like a bit of a hacky solution. You would also lose any information (like timezones) if you were to save it in a more human-readable format.

If you want the displayField's time format to be able to be different from the original's, you could also add a displayFieldDateFormat and/or displayFieldTimeFormat on a Relation widget I think?

Additional context
None.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions