Add cancel button to media library widget popup

This adds the button

But isn't that what the X button is for in the corner? If I go create an basic page with a media library field there isn't a cancel button there either..

Changed the 'steps to reproduce' to use taxonomy instead of layout builder which seems a bit simpler. Updated screenshot.

Modals can be closed using the ❎ button, and the escape key. I don't think we really use cancel buttons for modals (I'm not even sure we need them). This would be a good question to ask the UX team. If we want to add cancel buttons in modals, we might want to add them everywhere, not just for the media library.

Delete confirmation modals have cancel buttons. There lots of modals in views config with cancel buttons. Layout builder delete confirmation has cancel.

Sounds like a new feature required more than a bug.

The Needs Review Queue Bot → tested this issue.

While you are making the above changes, we recommend that you convert this patch to a merge request → . Merge requests are preferred over patches. Be sure to hide the old patch files as well. (Converting an issue to a merge request without other contributions to the issue will not receive credit.)

Created an issue fork with a commit which adds the cancel button

If usability signs off on it will need test coverage also.

Verified and tested patch 3399161-media_widget_cancel_button-2.patch on Drupal version- 10.1.7-dev. The patch was applied successfully and looks good to me.

Testing Steps:

1. Enable media and media library modules
2. Add a media field to a taxonomy (/admin/structure/taxonomy/manage/tags/overview/fields)
3. Add a term to the vocabulary (/admin/structure/taxonomy/manage/tags/add)
4. Click the Add Media button to reproduce this
5. Download this patch3399161-media_widget_cancel_button-2.patch and apply
6. Reverify this- Go to taxonomy(/admin/structure/taxonomy/manage/tags/add)
7. Click the Add Media button

Testing Results:
Now the cancel button is added & working fine.

Usability review

We discussed this issue at 📌 Drupal Usability Meeting 2023-12-08 Needs work . That issue will have a link to a recording of the meeting.

For the record, the attendees at the usability meeting were @AaronMcHale, @benjifisher, @rkoller, @simohell, and @worldlinemine.

We agree that it is a good idea to have a Cancel button. As pointed out in Comment #6,

There [are] lots of modals in views config with cancel buttons.

In fact, most forms in Drupal that can be used in modals can also be used on separate pages. (For example, try right-clicking on the "Add field" link when editing a view.) It looks as though the form in this issue can only be used in the modal, but it is still a form, and it is a good idea to be consistent with other forms and have a Cancel button.

The Usability team would like to review forms in general and update the standard recommendations. But let's not wait for that to happen before adding the Cancel button here.

@Sandeep_k, thanks for testing and for adding the "before and after" screenshots. It would be really helpful to add them to the issue description, under "User interface changes". I am adding the tag for an issue summary update. Because of that, and because this issue already has the "Needs tests" tag, I am setting the status back to NW.

If you want more feedback from the usability team, a good way to reach out is in the #ux channel in Slack.

Add before & after screenshots to summary. Thanks @Sandeep_k.