Skip to content

"Select Media" picker: search nests a new panel per keystroke and does not filter #890

Description

@PlusA2M

Version: 2.19.0 (also present on main)

Describe the bug

In any media-type field, clicking Select Media opens the picker fine, but
typing in its search box (a) doesn't filter the results, and (b) renders a whole
new search-box-plus-grid panel inside the grid — nesting one level deeper
with every keystroke.

Root cause

Two defects in GET /admin/media/selector (packages/core/src/routes/admin-media.ts):

  1. The search input has an id but no name, yet relies on
    hx-include="[name='search']" — so the typed term is never sent:
    <input type="search" id="media-selector-search" 
           hx-target="#media-selector-grid"
           hx-include="[name='search']">   <!-- nothing on the page is named "search" -->
  2. The endpoint always returns the full panel (search box +
    #media-selector-grid). Since the input's hx-target is the inner grid,
    htmx swaps that entire panel into the grid → a nested panel per keystroke.

To reproduce

  1. Edit any content type that has a media field.
  2. Click Select Media.
  3. Type in the picker's search box.
  4. Results don't filter; a nested search-box+grid appears inside the grid and
    deepens with each keystroke.

Expected

Typing filters the grid in place; the search box stays put (single, not nested);
selecting a file still fills the field.

Proposed fix

  1. Add name="search" to the input so hx-include sends the term.
  2. Return a grid-only fragment for the HTMX search request (detected via the
    HX-Target: media-selector-grid header) and the full panel only on the
    initial modal load.

I have a working fix with a regression test and can open a PR.

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