i'm trying to create a filter with mapPropsStream
but it does not work. This is my code:
const BaseComponent = ({ onSearch, data }) => (
<div>
<input onChange={({ target }) => onSearch(target.value)} />
<br/>
<ul>
{data.map((item) => /* render list */)}
</ul>
</div>
);
const DataList = mapPropsStream((props$) => {
const { handler: onSearch, stream: onSearch$ } = createEventHandler();
const filteredData$ = Observable.merge(
onSearch$.switchMap((query) =>
props$.pluck('data').filter((item) =>
item.title.includes(query) ||
item.body.includes(query) ||
item.event.includes(query)
)
),
props$.pluck('data') // props$.map(({ data }) => data)
).startWith([]);
return props$.combineLatest(
filteredData$,
(props, data) => ({
...props,
data,
onSearch
})
);
})(BaseComponent)
export default DataList;
i don't know if this is a correct way to filter data, if not, which is the correct way keeping in mind that my data is stored in redux?, if yes, what's wrong with my code?
Thanks