Empty search result is misleading

[m-mohr]

Once you've excluded all search results (e.g. by ticking all features), the list of back-ends ist just empty and nothing is shown at all. A small indication like "No back-end matches the selected criteria" would be nice.

[christophfriedrich]

This one is not as easy as it looks: Evaluating the filters is done at the BackendGroup level, not at the DiscoverSection level -- i.e. the "GEE" section checks whether it has to show something, "VITO" checks whether it has to show something etc. Therefore I can't just add a v-if/v-else construct to the parent of the v-for.

On top of that, hiding non-matching backends is done by setting the enabled prop of the corresponding Tab to false.

So I don't see a way to achieve this without a lot of restructuring...

[m-mohr]

If you could set the display: none for the li elements instead for the child div, could you use the :blank CSS selector (not sure how the support is) to show a message? Or something similar based on JS and the status of the DOM nodes?

[christophfriedrich]

Nice idea with the :blank selector, but the support indeed looks rather blank: https://caniuse.com/mdn-css_selectors_blank

On top of that, even if it was widely available I don't think it would be possible to make it work easily. (I understood it selects elements that contain at most comments and whitespace.)

With JS it's most certainly possible, but I don't know what event the code should ideally listen to.

[m-mohr]

That's underwhelming, indeed 😂

You would probably set a listener for the data that is passed to the prop for the left component, right? And then you could check the DOM for all li's being hidden. But indeed that's some lines of code again...

[christophfriedrich]

Thanks for pointing me into the right direction -- a watcher on filters indeed does the trick quite easily (it has to check the li's firstChilds though). Then it's actually not even that many lines of code :)