Enable content link for no results and add pill in switcher popover item

[fcoveram]

Problem

Currently, Openverse doesn't allow users to land on the meta search page from "All content" results when a search query doesn't bring results. The media link button shows a disabled state and we're missing the opportunity to show external sources.

Description

We can improve this flow by applying three changes

Enable the content type link

In "All content" results, content type link needs to show a "No results" label in the result area, and look and behave as described in #2078. The page should look like the following mockup.

Add a variant to the status pill (Figma component)

'
The pill component has a new variant and the following new styles:

• Height: 24px
• Text style: Time style with uppercase text transformation
• Paddings: 8px for left and right
• "No results" variant with "dark charcoal 10" as background

Switcher item (Figma component)

The component doesn't change any space or visual style for the resting, hover, and focus status, but check icon replaces the status pill when the content type is selected. See the prototype gif below.

Additional context

• Figma file
• New design for content link component (Customized buttons update #2078)

[obulat]

I am a bit concerned about the "No results" pill in the switcher popover and its effect on the perceived performance for our users.

It would not change anything for the "All content" views, but will require us to send additional requests for Image and Audio views.

Currently, if you search for cat images, Nuxt only sends one request to the /image endpoint. However, if we need to display the "No results" pill in the content switcher, we would have to send requests for all media types on single media search view on to decide if we should or shouldn't display it. We would probably do it on the first search for the search term. So, if the user is searching for "cat" images, we would still send 2 requests for both media types (or 3-4 in the future, when we add media types). Sending requests for other media types when the user opens the content switcher would make the switcher much slower.

We currently only display "No results" in the content links on the All content views (where we already loaded both media types and know that there are no results. The content switcher popover does not display anything about the number of results. The users can land on a page without results for a different media type if they use the content switcher popover. Do we really want to introduce the new pill, @WordPress/openverse-frontend ?

My vote would be for making the content links at the top of the "All content" view clickable even if there are no results (now, they are disabled in such case), but not add "No results" pill to the content switcher.

[fcoveram]

I follow your concern @obulat. Thanks for bringing this up. Waiting for other folks to chime in and share their thoughts on the performance impact and what efforts this proposal requires.

My vote would be for making the content links at the top of the "All content" view clickable even if there are no results (now, they are disabled in such case), but not add "No results" pill to the content switcher.

I'm happy with this solution if folks consider it better.

[zackkrida]

@obulat's suggestion is right, especially concerning performance. I didn't think of that but it's very important.

[fcoveram]

So let's continue with enabling the content type link for "no results" and dismiss the "pill in switcher" idea.