DateField bugs in admin actions extension

Extensions
1

Hello!

I found a bug and a problem with the documentation for the DateField component.

When using the Datefield component, if the date picker opens up on the side of the modal actions, the date picker appears under the action buttons:

image
image1100×826 51.9 KB

As for the documentation:

It says to use the “selected” prop for the date value, though that doesn’t seem to work. Typescript says it’s not valid for the type of the component and ignoring the warning doesn’t do anything (field is initialized as blank even if I set a value).

image
image2152×486 105 KB

Only way it works is to use “value” instead of “selected”, but value only takes a string so not possible to set a range of date.

Also, the “disabled” prop doesn’t seem to do anything. Here’s how I used it:

<DateField value={since.since} onChange={(value) => {
  setSince({...since, since: value});
}} label={i18n.translate('since',{TARGET})} disabled={{
  end: new Date().toISOString().split('T')[0],
}} />

I’m using the 2025-01 version.

2

Hi Tommy,

Thanks for flagging this here - I’ve connected with the relevant team to ask for their recommendation on this. Will be back in touch when I have an update.

3

Hi again,

It appears that this could be an issue with the docs. Datepicker does not support selected, but DateField does - we’ll update this asap and also look into the modal buttons appearing on top of the picker.