Template Part replacement modal – make results searchable

[jameskoster]

When there are many options in the replace modal it can be difficult to find a specific template part you have in mind. This is already an issue in Twenty Twenty-Two:

replace.mp4

Making the list searchable can help ease this pain point.

searchable-modal.mp4

[shaunandrews]

If you know the name of the template part, this might help. It would be nice to only show the search input if there are more than a few template parts.

Maybe, instead of a search box there were display options to show template parts in different views. For example, instead of just a stacked display of large previews you could switch to a grid of thumbnails, or a simple list with a focus on the label.

[jameskoster]

Good points. The display options are posed in #39308, but still need some design exploration.

[Mamaduka]

@jameskoster, is anyone working on this issue?

[jameskoster]

@Mamaduka not that I am aware of. If you're thinking about picking it up, it may be worth taking a look at #39308 first (#39308 (comment) specifically), for an idea of the overall direction for these pattern modals. Just in case that informs any implementation details here :)

[Mamaduka]

Thanks, I will do.

[Mamaduka]

@jameskoster, I was wondering if moving template part replacements into Block actions dropdown would make this modal obsolete.

P.S. Do we have mockups of how replacements should look in the block actions dropdown - #40208 (comment)?

[jameskoster]

Because we can't account for the appearance or quantity of headers I still think the modal makes sense.

Perhaps something like this could work:

[Mamaduka]

@jameskoster, do we want to hide SearchComponent if there're fewer than X items (#42337)?

[jameskoster]

Good question. I don't know if it's so important to hide the search component here... if the previews happen to be very tall, you may still want to search to avoid scrolling, even if there are only a few options.