This repository was archived by the owner on Dec 30, 2022. It is now read-only.
Displaying some sort of placeholder instead of hiding component when there are no facets #347
Labels
Comments
|
Interesting feedback @Rias500 , WDYT @ronanlevesque ? |
|
Just chiming in, but I think this term is known as “ghosts”. Essentially showing facet links that would result in zero results. I think it’d be nice to have this, especially from a UX perspective as it can help the user have a better understanding with what’s going on. There is a plugin for WordPress that produces Facet searching and it had this option. See example doc here: |
|
@Haroenv Can you please tell me if such a function is planned in |
|
In v2 you can do this, but only when you are making fully custom components (using createWidgetMixin). This is probably something we should make achievable using the panel. |
Haroenv
added a commit
that referenced
this issue
Apr 30, 2019
This allows you to create interface like:
```vue
<ais-panel>
<template slot="header">Hi</template>
<template slot="default" slot-scope="{ noRefinement }">
<p v-if="noRefinement">no results</p>
<ais-refinement-list attribute="brand" />
</template>
</ais-panel>
```
sandbox with this: https://codesandbox.io/s/znw7ry52wl (which now obviously doesn't work).
fixes #347
Haroenv
added a commit
that referenced
this issue
Apr 30, 2019
* feat(panel): provide noRefinement scope to slots
This allows you to create interface like:
```vue
<ais-panel>
<template slot="header">Hi</template>
<template slot="default" slot-scope="{ noRefinement }">
<p v-if="noRefinement">no results</p>
<ais-refinement-list attribute="brand" />
</template>
</ais-panel>
```
sandbox with this: https://codesandbox.io/s/znw7ry52wl (which now obviously doesn't work).
fixes #347
* fix: correct syntax
* fix(panel): correct conditional around slots
* chore(panel): rename to hasRefinements
Haroenv
added a commit
to algolia/instantsearch
that referenced
this issue
Dec 28, 2022
…tsearch#670) * feat(panel): provide noRefinement scope to slots This allows you to create interface like: ```vue <ais-panel> <template slot="header">Hi</template> <template slot="default" slot-scope="{ noRefinement }"> <p v-if="noRefinement">no results</p> <ais-refinement-list attribute="brand" /> </template> </ais-panel> ``` sandbox with this: https://codesandbox.io/s/znw7ry52wl (which now obviously doesn't work). fixes algolia/vue-instantsearch#347 * fix: correct syntax * fix(panel): correct conditional around slots * chore(panel): rename to hasRefinements
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Do you want to request a feature or report a bug?
Feature
Feature: What is your use case for such a feature?
When a component has no facets or results then they get hidden, but in my current implementation this makes it look like the interface broke, see screenshots for an example:
With results (ok)
Without results (looks broken)
I can't see any way to still display something when there are no results.
Feature: What is your proposed API entry? The new option to add? What is the behavior?
Add a
placeholderslot or something comparable to still show some sort of message or button when the component would be hidden.What is the version you are using? Always use the latest one before opening a bug issue.
Latest
The text was updated successfully, but these errors were encountered: