Add 'No Preview Available' text to the inserter preview panel

[brentswisher]

Fixes #17720 based on @mapk's feedback to #17740. @youknowriad feel free to use this or not, just saw your PR in the 5.3 project and thought it was something I could take off your plate.

Description

Adds "No Preview Available." in the space where a preview would display if it existed.

How has this been tested?

Open inserter, hover over a block without a preview (video, file, etc) and see that "No Preview Available" now displays

Screenshots

Types of changes

New feature (non-breaking change which adds functionality)

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.

[jorgefilipecosta]

Looks good from the code point of view 👍 I guess we just need a UX approval now cc: @mapk, @karmatosed.

[youknowriad]

I was wondering if we should keep the rounded borders we use for previews around that message? Thoughts @mapk

[karmatosed]

What about using the blank state being considered for block library:

#17122 (comment)

[brentswisher]

To me, a question mark implies that I have done something as a user that the system doesn't understand. That makes sense in the context of searching for something that doesn't exist. In this context though there just is not a preview - It's not changeable or fixable by the user. Put another way, there isn't any action a user can take to answer the "question" the system is posing to them. If that makes sense?

If there's concensus I'm happy to implement, just my thoughts.

[youknowriad]

I tweaked the design a bit with borders to match the style of the other blocks (the ones with previews available). I think it's better this way.

[mapk]

Thanks, @youknowriad! Looks good!