Custom widget : using facets as hierarchicalFacets

[tdutreui]

Describe the bug 🐛 Calling addHierarchicalFacet() does nothing.

I noticed that using the "breadcrumb" widget, the targeted attribute is moved from the "facets" property to the "hierarchicalFacets" property. I would like to implement the same behavior in my custom widget, but nothing seems to happen when using addHierarchicalFacet() :

To Reproduce 🔍

//in my custom widget implementation
init: function (initOptions) {
initOptions.helper.state.addHierarchicalFacet({
          name: 'filter_category.lvl0',
          attributes: [ "filter_category.lvl0", "filter_category.lvl1" ],
          separator: " > ",
          rootPath: null
        });
}
console.log(initOptions.helper.state.hierarchicalFacets) //empty

The last line here prints an empty Array. Also, calling addHierarchicalFacet 2 times with the same name do not raise an error, but calling it 1 time after adding the "breadcrumb" widget does.

Could you explain me how to flag a facet as a hierarchicalFacet ?

Versions : [email protected] [email protected]:

workaround I found a workaround, noticing the state was returned by the function :

initOptions.helper.state=initOptions.helper.state.addHierarchicalFacet({
          name: 'filter_category.lvl0',
          attributes: [ "filter_category.lvl0", "filter_category.lvl1" ],
          separator: " > ",
          rootPath: null
        });

[francoischalifour]

Algolia doesn't (yet) support the concept of "hierarchical facets". A hierarchical facet is a concept that exists at the Helper level. It adds the facet to the facets search parameter.

You should therefore be able to see your hierarchical facet attribute in helper.state.facets.

[tdutreui]

Hi @francoischalifour Thank you for this answer. I indeed notice it in helper.state.facets. But the issue is that in the results, at render time, results.facets disappears when you mount the breadcrumb widget. I need to avoid cross-widget dependency.

Example :

render: function (renderOptions) {
console.log( renderOptions.results)

The above will show :

• facets populated when no breadcrumb widget is used, and hierarchicalFacets empty.
• hierarchicalFacets populated and facets empty otherwise

[francoischalifour]

Can you please reproduce the behavior in this InstantSearch.js sandbox?

[tdutreui]

@francoischalifour done, but unexpectedly I hit the following error on breadcrumb mount:

TypeError
B(...)[0] is undefined

This error do not prevent us to reproduce the bug : You just have to comment lines from 46 to 55 to see the console output change

[francoischalifour]

Sorry, I forgot to mention, can you send the link back here? (it created a forked sandbox)

[tdutreui]

here you go : https://codesandbox.io/s/gifted-khorana-l4rf8

[francoischalifour]

You can use an index widget so that the search parameters computed are independent from the breadcrumb widget.

I built an example in this sandbox. I hope this helps!

[tdutreui]

@francoischalifour That would not resolve the problem, being that I want to implement a custom widget that can be applied to any search object through addWidgets(), regardless if they are already using the breadcrumb widget or not. For the moment I use the workaround stated in the description at the init step, is it the correct way to proceed?

[dhayab]

Hi! We're doing a round of clean up in this repository. Is this still an issue for you or does the workaround works well enough?

[tdutreui]

Hi ! I no longer work with Algolia, please close this issue if you wish to

Le lun. 19 déc. 2022 à 18:13, Dhaya @.***> a écrit :

Hi! We're doing a round of clean up in this repository. Is this still an issue for you or does the workaround works well enough?

— Reply to this email directly, view it on GitHub https://github.com/algolia/instantsearch.js/issues/4377#issuecomment-1357982139, or unsubscribe https://github.com/notifications/unsubscribe-auth/AASO5BSEHFZKTI37RELODP3WOCJT7ANCNFSM4MD6RGVA . You are receiving this because you authored the thread.Message ID: @.***>