React Native refinements problems

Hi, I’m using Algolia to implement search in my app.
Search is working pretty well, Algolia is so powerful :heart:

Now I need to filter my result by zip_code selected by the user.
I’ve searched a lot but I didn’t find anything.
This is my search page code: https://pastebin.com/LWq4ZSYk
I’ve use this repo as guide: https://github.com/algolia/hn-reactnative-sample

PS I’ve tried to use the docs but seems that my implementation is different from https://community.algolia.com/react-instantsearch/Getting_started_React_native.html

Thanks in advance :slight_smile:

Hi @matteo.pennisi98,

Sorry for the late answer and thanks for using Algolia!

I saw that you are using Algolia with React Native, but you are not using React InstantSearch. Is there a reason to that? Did you try it?

We recommend to all our users working with the React ecosystem to use this library. It’s an abstraction on top of Algolia with an approach “component driven”. We support both react-dom & react-native you can follow the “Getting Started” guide of React Native from the documentation.

Hope that helps, feel free to ping me if you have more questions! :wink:

Hi @samuel.vaillant, thanks for your reply.

Now I’ve refactored my code following Algolia docs.
Filtering is working but I recive this Warning from RN:

Warning: Each child in an array or iterator should have an unique “key” prop.

I think that this issue is related to VirtualizedList/RefinementList.
There is my RefinementList code: https://pastebin.com/Ju6L8wy4

Anyway thanks for your help :smile:

Hi @matteo.pennisi98,

You are right, your issue come from the VirtualizedList / FlatList. The FlatList component require to have a keyExtractor who returns a unique value for each item. In you implementation this prop looks like:

keyExtractor={(item, index) => item.objectID}

But item doesn’t have an objectID property. So the keyExtractor always receive undefined as key. You should probably use item.value instead.

Hope that helps :slightly_smiling_face:

Sorry for late reply @samuel.vaillant,

I’ve refactored keyExtractor to
keyExtractor={(item, index) => item.value}
and now the Warning disappeared.

Many thanks :smiley: