Fixed refinementlist facet values

We’re using Vue Instantsearch (latest). Is it possible to have fixed facet values (XS, S, M, L, XL) and ignore all other facets that are part of the attribute? We would also like to have all facets to be visible even if there are no results for said facet. Is transform the appropriate method for this?

Hi @victor1,

Yes transform-items is a possible solution. We will return a static list of values whatever comes from the arguments of the function. To display the count we have to look in the provided value if our static value exists: if it does we return the item, but if it doesn’t we return a “fake” value. The logic would look like this (see below). You can find a complete example in CodeSandbox.

export default {
  methods: {
    tranform(items) {
      return ['S', 'M', 'L', 'XL'].map(value => {
        const item = items.find(item => item.value === value)
        if (item) {
          return item
        }

        return {
          isRefined: false,
          count:0,
          label:value,
          highlighted:value,
          value,
        }
      })
    }
  }
};
1 Like