Implement NestedList components

[siddharthlatest]

Feature Request

Description:

Implement the NestedList and NestedMultiList components that were supported in v1.

[aol-nnov]

@metagrover do you plan to add nested properties filtering for DynamicRangeSlider too?

I'd be very glad to see that feature!

Btw, I've made some patching for MultiList to support nested fields. It works for me, but I'm not sure if I made everything right ;)

[siddharthlatest]

Hey @aol-nnov, can you clarify your comment? Not sure what you mean by nested properties filtering for DynamicRangeSlider.

[aol-nnov]

@siddharthlatest by nested properties I mean a property inside a property of type "nested".

so, I have an index with properties, one of them is of type nested and has, say, integer field. I'd like to create a range slider for that integer field to filter documents.

[timtutt]

Any update on when these components will be available in reactivesearch?

[timtutt]

@metagrover - Is this issue being worked? Any idea on when it can be expected in a release?

[metagrover]

hey @timtutt, this is not in development right now. I'm pretty much occupied for the next few weeks, so I can only start on this sometime next month 😓

But we definitely want to ship this in the next major release of reactivesearch in the coming month.

[timtutt]

@metagrover - no worries. Understand how that goes. Thanks for the update.

Would be happy to help on this, just not entirely sure where to start. I know how to write the ES queries to make this happen, but building the component and using the write APIs is a bit beyond me at the moment. Havne't dug enough into the ReactiveSearch code.

[KalleVuorjoki]

I have been trying to achieve following in v.1.4.1 Book catalog with following hierarchy:

• History (10)
  • [+] Europe (2)
  • [] Asia (8)
• Sports (3)
  • [+] Running (1)
  • [] Walking (2)

So selecting Running from Sports and Europe from history would bring only books from those categories and expecting to get 3 items. Don't know if its possible with 1.4.1. it seems only allow to select multiple top level categories. I hope it would be supported in 2.x.

[metagrover]

@KalleVuorjoki that's interesting. Will definitely think on this while figuring out the initial specs and functionality. Thanks for the input.

[aol-nnov]

@metagrover am I heading in the right direction? :)

those changes work well for me, but they might not fit you. Please advise!

[vanja-bertalan]

@metagrover any ideas when could this be available? Do you have any suggestions for a workaround?

[smcguinness]

@vanja-bertalan I'm implementing a custom component for this. An example can be found at https://codesandbox.io/s/reactivecomponent-x118p

@metagrover I'd love feedback on it and better eyes who are more familiar with using ReactiveComponent as I haven't entirely flushed out an optimal way to implement custom filters and handle all the conditions with confidence (ie - internal state, external state, aggs, etc.).

[aol-nnov]

@smcguinness, as far as I can tell, metagrover is not a part of appbase anymore. Sad to find it out too....

[metagrover]

@smcguinness @aol-nnov Ah yes, I don't work with appbase anymore, but I gave a quick look and it seems fine to me.

You may need to watch out for this use-case where you need to update the selectedItems based on the react prop of the NestedList. Say you have your nestedList watching a search component and the search term has changed -> this will trigger a new query for the NestedList component, but I am not sure if you have accounted for this (Ignore if you have already!). In this usecase, you need to filter only those items which are present in the updated list of aggregation results.

componentDidUpdate(prevProps, prevState) {
    const { onItemClick, ...props } = this.props;
    const { selectedItems } = this.state;
    ...
	
	// best to check for the list of items here
	// and see if the current selected values still make sense
}

Maybe you can also utilise components like MultiList to build this:

The internal checkbox list can be a MultiList component and can have a react-prop set to the same react prop of the NestedList to automate this subscription behavior.

---

Kudos to you for implementing it with the ReactiveComponent - it's very tricky to cover all the edge cases there. Great effort! 💯

I'd definitely pull in @lakhansamani and @jyash97 for their reviews!

[priyanksha-monotype]

Feature Request

Description:

Implement the NestedMultiList components that were supported in v1.

Is "NestedMultiList" available in v3 version?

[IntegralProgrammer]

Is NestedMultiList working for v2? There exists documentation which gives the impression that it does (https://opensource.appbase.io/reactive-manual/v2/search-components/nestedmultilist.html) however there appears to be no links leading to this page. The codepen.io example (https://codepen.io/sids-aquarius/pen/ayXeyv) on the documentation page does not work and when used in our project, the error Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. occurs.

[rgb-panda]

@siddharthlatest Is NestedMultiList planned for any future release?