Improve UX of template inspector "transform into" experience

[annezazu]

Using the patterns surfaced in the template inspector, I've noticed a few oddities:

1. It's not clear how to get back to what you had originally, beyond the undo button. Even if only one option is available to swap out, I don't understand why I can't then switch back to what I had.
2. There's no clarity on what you already have selected, making it hard to know what might be a new option or the current option. If there's only one option, it's even more confusing.
3. The transform into tab is sometimes open and sometimes closed. Open when looking at individual template parts. Closed when looking at the template. At a glance, when it's closed up, it's not clear there are actions I could take.

Google.Chrome.mp4

@WordPress/gutenberg-design for more feedback. Wanted to share early as this was just merged for 17.8 (tested this with 17.8RC4). @scruffian since you implemented this.

[jameskoster]

A simple way to resolve the first and second points could be to include an option in the list, initially selected, based on the current template structure.

It's tricky though, because if you swapped, saved and reloaded, then the 'old' structure would vanish. Perhaps we could prompt the user to save or discard the old design as a custom pattern in multi-entity saving?

[jasmussen]

A simple way to resolve the first and second points could be to include an option in the list, initially selected, based on the current template structure.

This is rather similar to how style variations can easily be lost, and this issue on how to save style variations might be relevant: #45371

That said, my instinct would also go in this direction: show the current one as a "Current" (including the italic that emphasizes it being ephemeral).

Besides, undo still works, no?

[jameskoster]

This is rather similar to how style variations can easily be lost

Yes, and other presets like Typography and Color. We should definitely seek to align the UX around these tasks, especially as they will be more prominent in the upcoming zoomed-out / section work.

[scruffian]

The problem is that there is no connection between the pattern in the canvas and the patterns in the inspector, so these are things we don't know. I think the work we are doing on using patterns on sections could help with this.