Skip to content

Media selection modal: "Choose from existing" rows are not clickabl #17401

Description

@nabilAhmedN

Describe the Bug

Description
using an upload field in the Payload admin panel and clicking "Choose from existing", the media list opens but the rows/images are not clickable. There is no way to select an existing media file.

Steps to Reproduce

  1. Open the Payload admin panel2. Go to a collection with an upload field (e.g., Pages → Home → Hero Image Carousel).
  2. Click "Choose from existing".
  3. Try clicking on any media row/image in the modal.

Expected Behavior
Clicking a media row should select it and close the modal, attaching the file to the field.

Actual Behavior
Clicking on a row does nothing. modal stays open and no file is selected.

Workaround
Uploading a new file with "Create New" or drag-and-drop works. Only selecting existing files is broken.

Environment

  • Payload version: 3.85.1
  • OS: Windows
  • Browser: (Chrome/Edge/etc.)

Screenshots

Image

Link to the code that reproduces this issue

I can provide a minimal reproduction repository if needed. This occurs in any Payload v3 admin panel with an upload field using the "Choose from existing" media picker.

Reproduction Steps

  1. Start a Payload v3 project with an upload field (e.g., an image field in a global or collection).
  2. Go to the admin panel and open the field.
  3. Click "Choose from existing".
  4. In the media modal, try clicking on any existing media row/image.
  5. The modal does not close and the file is not selected.

Which area(s) are affected?

area: ui

Environment Info

Payload: 3.85.1
Next.js: 16.2.9
Node.js: 22.19.0
OS: Windows
Browser: Chrome/Edge
Package manager: npm

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions