import { GenericPollButton } from 'stream-chat-react-native';
const button = () => <GenericPollButton title='Button title' onPress={() => console.log('I got pressed !')} />;
Poll Buttons
For the purposes of managing the Poll
UI more easily, we expose various button components that have an overridable onPress
property in case the default behaviour needs to be changed.
The onPress
property should be typically used to navigate to the various Poll
screens using a popular navigation library rather than relying on the default React Native Modal implementation. Integrators are encouraged to handle navigation to these screens like this rather than relying on the defaults.
In order to be able to render the screens, all of the required props will be passed to the onPress
method.
Conversely, if one wishes to use the default button behaviour they may render them without any props.
All of the buttons need to be structured inside a Channel
component.
GenericPollButton
A generic button component that has the default UI encapsulated within it.
Props
title
*
The text that is going to be rendered as the button’s content.
Type |
---|
string |
onPress
*
A press handler that will be invoked whenever the button is pressed.
Type |
---|
() => void |
Example usage
ViewResultsButton
A button responsible for opening the PollResults
modal.
Props
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { ViewResultsButton } from 'stream-chat-react-native';
const button = () => (
<ViewResultsButton onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)} />
);
EndVoteButton
A button responsible for closing voting on the Poll
.
Example usage
import { EndVoteButton } from 'stream-chat-react-native';
const button = () => <EndVoteButton />;
AddCommentButton
A button responsible for opening the Poll
input dialog used to add a new comment to it.
Props
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { AddCommentButton } from 'stream-chat-react-native';
const button = () => (
<AddCommentButton onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)} />
);
ShowAllCommentsButton
A button responsible for opening the PollAnswersList
modal.
Props
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { ShowAllCommentsButton } from 'stream-chat-react-native';
const button = () => (
<ShowAllCommentsButton
onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)}
/>
);
AnswerListAddCommentButton
A button responsible for opening the Poll
input dialog used to add a new comment to it, from within PollAnswersList
.
It has the same props and usage as AddCommentButton
.
SuggestOptionButton
A button responsible for opening the Poll
input dialog used to suggest new options to the it.
Props
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { SuggestOptionButton } from 'stream-chat-react-native';
const button = () => (
<SuggestOptionButton onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)} />
);
ShowAllOptionsButton
A button responsible for opening the PollAllOptions
modal.
Props
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { ShowAllOptionsButton } from 'stream-chat-react-native';
const button = () => (
<ShowAllOptionsButton
onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)}
/>
);
VoteButton
A button responsible for voting on a specific option within a Poll
.
Props
option
*
The poll
option that we want to vote on.
Type |
---|
object |
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, poll }) => void |
Example usage
import { VoteButton } from 'stream-chat-react-native';
const button = () => (
<VoteButton
option={option}
onPress={({ message, poll }) => console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}`)}
/>
);
ShowAllVotesButton
A button responsible for opening the PollOptionFullResults
modal.
Props
option
*
The poll
option that we want to vote on.
Type |
---|
object |
onPress
A press handler that will be invoked whenever the button is pressed.
Type |
---|
({ message, option, poll }) => void |
Example usage
import { ShowAllVotesButton } from 'stream-chat-react-native';
const button = () => (
<ShowAllVotesButton
option={option}
onPress={({ message, option, poll }) =>
console.log(`Poll ID: ${poll.id}; Message ID: ${message.id}; Option ID: ${option.id}`)
}
/>
);