import { OverlayProvider, Chat, Channel, PollResults } from 'stream-chat-react-native';
const App = () => {
return (
<OverlayProvider>
<Chat client={client}>
<Channel channel={channel}>
<PollResults message={message} poll={poll} {...otherOptionalProps} />
</Channel>
</Chat>
</OverlayProvider>
);
};
PollResults
A component used to render a list of all of the votes per option that a Poll
has. Each option will display the 5 most recent votes. If an option has more than 5 votes it will add a button at the bottom that opens the PollOptionFullResults
Modal. Needs to be structured inside a Channel
component.
It will render its default PollResultsContent
, which can be overridden for custom UI. Its children have access to the entire poll
state through the usePollState
hook.
General Usage
Props
message
Message object.
Type |
---|
Message type |
poll
*
An instance of the Poll
class containing reactive state.
It is used by the underlying usePollContext
, usePollStateStore
and usePollState
hooks to provide us with the reactive Poll
state.
If you need the Poll
instance you may get it from client.polls.fromState(pollId)
.
Type |
---|
object |
additionalScrollViewProps
A prop used to override the underlying ScrollView
props of the PollResults
.
const flatListProps = { bounces: true };
<PollResults additionalFlatListProps={flatListProps} />;
Type |
---|
object |
PollResultsContent
A Component
prop used to render the content of the PollResults
component.
The component has full access to the entire Poll
reactive state through the usePollState
hook.
Type | Default |
---|---|
ComponentType | PollResultsContent |
Usage
import { Text } from 'react-native';
import { OverlayProvider, Chat, Channel, PollResults, usePollState } from 'stream-chat-react-native';
const MyPollResultsContent = () => {
const { options } = usePollState();
return options.map(option => <Text>{option.id}</Text>);
};
const App = () => {
return (
<OverlayProvider>
<Chat client={client}>
<Channel channel={channel}>
<PollResults message={message} poll={poll} PollResultsContent={MyPollResultsContent} />
</Channel>
</Chat>
</OverlayProvider>
);
};