Allow to use index in ChannelList custom Preview

[jpalumickas]

Motivation We need to know a position of Channel List item to show different style, so we can use renderItem index for that, but currently it's not available in custom ChannelList Preview

Proposed solution in renderItem we can get index which we can pass to custom Preview

Acceptance Criteria index is available in custom provided Preview

[khushal87]

Hey @jpalumickas. Thanks for pointing out the issue and it really makes sense to add an index for the channel item which can be used in the ChannelPreview component. We have added this to our backlog. Keep on following this card.

[vanGalilea]

Hey team! Please add your planning poker estimate with ZenHub @Enigma-I-am @khushal87 @madsroskar @santhoshvai @vishalnarkhede

[vishalnarkhede]

@jpalumickas we won't be able to prioritize this in near future. But you can use the following workaround:

import {
  ChannelList,
  ChannelPreview,
} from 'stream-chat-react-native';

const PreviewContext = React.createContext({});

<ChannelList
  additionalFlatListProps={{
    renderItem: ({ index, item }) => (
      <PreviewContext.Provider data={{ index }}>
        <ChannelPreview channel={item} Preview={CustomPreviewComponent} />
      </PreviewContext.Provider>
    ),
  }}
  filters={filters}
/>

And within CustomPreviewComponent, use the PreviewContext consumer to access the index. Technically it should work