Skip to content

Commit 937ec0f

Browse files
committed
docs: add docs for most state hooks and fix channel props
1 parent e564c8d commit 937ec0f

File tree

9 files changed

+210
-1
lines changed

9 files changed

+210
-1
lines changed

docusaurus/docs/reactnative/contexts/messages-context.mdx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@ import UrlPreview from '../common-content/ui-components/channel/props/url_previe
7474
import VideoThumbnail from '../common-content/ui-components/channel/props/video_thumbnail.mdx';
7575
import OpenPollCreationDialog from '../common-content/ui-components/channel/props/open-poll-creation-dialog.mdx'
7676
import HasCreatePoll from '../common-content/ui-components/channel/props/has-create-poll.mdx'
77+
import PollContent from '../common-content/ui-components/poll/poll-content.mdx'
7778

7879
## Value
7980

@@ -428,3 +429,7 @@ Upserts a given message in local channel state. Please note that this function d
428429
### <div class="label description">_forwarded from [Channel](../../core-components/channel#videothumbnail)_ props</div> VideoThumbnail {#videoThumbnail}
429430

430431
<VideoThumbnail />
432+
433+
### <div class="label description">_forwarded from [Channel](../../core-components/channel#pollcontent)_ props</div> PollContent {#pollcontent}
434+
435+
<PollContent />

docusaurus/docs/reactnative/core-components/channel.mdx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,7 @@ import UrlPreview from '../common-content/ui-components/channel/props/url_previe
147147
import CreatePollContent from '../common-content/contexts/create-poll-context/create-poll-content.mdx'
148148
import OpenPollCreationDialog from '../common-content/ui-components/channel/props/open-poll-creation-dialog.mdx'
149149
import HasCreatePoll from '../common-content/ui-components/channel/props/has-create-poll.mdx'
150+
import PollContent from '../common-content/ui-components/poll/poll-content.mdx'
150151

151152
The `Channel` component is the main entry point for many Stream Chat customizations and contains the majority of the content providers and a significant amount of the logic utilized by Stream Chat for React Native.
152153
Components, custom and out of the box, channel information, and UI integrated chat functions are disseminated by the contexts contained in `Channel`.
@@ -1043,3 +1044,7 @@ Component to render upload progress indicator as an overlay above [ImageUploadPr
10431044
### CreatePollContent
10441045

10451046
<CreatePollContent />
1047+
1048+
### PollContent
1049+
1050+
<PollContent />
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
id: use-create-poll-context
3+
title: useCreatePollContext
4+
---
5+
6+
A hook that returns the [`CreatePollContext` value](../../contexts/create-poll-context.mdx#value).
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
---
2+
id: use-poll-answers-pagination
3+
title: usePollAnswersPagination
4+
---
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
id: use-poll-context
3+
title: usePollContext
4+
---
5+
6+
A hook that returns the [`PollContext` value](../../contexts/poll-context.mdx#value).
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
---
2+
id: use-poll-option-votes-pagination
3+
title: usePollOptionVotesPagination
4+
---
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
---
2+
id: use-poll-state-store
3+
title: usePollStateStore
4+
---
5+
6+
A utility hook used to access the `poll` state store directly by passing a [`selector`](../../state-and-offline-support/state-overview.mdx#what-are-selectors).
7+
8+
The full extent of the `Poll` state can be found [here](https://github.com/GetStream/stream-chat-js/blob/master/src/poll.ts), under the `PollState` type.
9+
10+
This hook can only be used within a child of [`PollContext`](../../contexts/poll-context.mdx).
11+
12+
## Example usage
13+
14+
```tsx
15+
import { PollVote, PollState } from 'stream-chat';
16+
import { usePollStateStore } from 'stream-chat-react-native';
17+
18+
type PollOptionSelectorReturnValue = {
19+
latest_votes_by_option: Record<string, PollVote[]>;
20+
maxVotedOptionIds: string[];
21+
};
22+
23+
const selector = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(
24+
nextValue: PollState<StreamChatGenerics>,
25+
): PollOptionSelectorReturnValue => ({
26+
latest_votes_by_option: nextValue.latest_votes_by_option,
27+
maxVotedOptionIds: nextValue.maxVotedOptionIds,
28+
});
29+
30+
const { latest_votes_by_option, maxVotedOptionIds } = usePollStateStore(selector);
31+
```
Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
---
2+
id: use-poll-state
3+
title: usePollState
4+
---
5+
6+
This is the hook containing most of the important properties from the `PollState`. It also provides several other utilities that make it easier to handle the UI for polls.
7+
8+
The full extent of the `Poll` state can be found [here](https://github.com/GetStream/stream-chat-js/blob/master/src/poll.ts), under the `PollState` type. If the properties from the hook are not enough for rendering their desired UI, integrators are encouraged to write their own `selectors` and use the [`usePollStateStore`](./use-poll-state-store.mdx) hook instead.
9+
10+
This hook can only be used within a child of [`PollContext`](../../contexts/poll-context.mdx).
11+
12+
It is highly recommended that the user familiarizes themselves with the [`Poll` client documentation](https://getstream.io/chat/docs/javascript/polls_api/?language=javascript&q=poll) in order to understand the properties better.
13+
14+
## Return value
15+
16+
The `usePollState` hook returns an object containing values from the `PollState`.
17+
18+
### `allow_answers`
19+
20+
A property depicting whether answers (comments) are allowed to the `poll`.
21+
22+
| Type |
23+
| ------ |
24+
| `boolean` | `undefined` |
25+
26+
### `allow_user_suggested_options`
27+
28+
A property depicting whether user option suggestions are allowed to the `poll`.
29+
30+
| Type |
31+
| ------ |
32+
| `boolean` | `undefined` |
33+
34+
### `answers_count`
35+
36+
A property containing the number of answers (comments) to the `poll`.
37+
38+
| Type |
39+
| ------ |
40+
| `number` |
41+
42+
### `created_by`
43+
44+
A property containing information about the user who created the `poll`. Its type can be found [here](https://github.com/GetStream/stream-chat-js/blob/b447512922b19bc7e3668bd9df81debcb673dd81/src/types.ts) under `UserResponse`.
45+
46+
This property will be `null` for anonymous polls.
47+
48+
| Type |
49+
| ------ |
50+
| `object` | `null` |
51+
52+
### `enforce_unique_vote`
53+
54+
A property depicting whether each user should have only one and unique vote or they would be able to vote multiple times during the lifespan of a `poll`.
55+
56+
| Type |
57+
| ------ |
58+
| `boolean` |
59+
60+
### `is_closed`
61+
62+
A property depicting whether the `poll` is still open for voting or not.
63+
64+
| Type |
65+
| ------ |
66+
| `boolean` |
67+
68+
### `latest_votes_by_option`
69+
70+
A property containing the latest votes for each option stored in an object by option ID. Only the last 10 votes are maintained here. If all votes are needed for an option, the [`usePollOptionVotesPagination`](./use-poll-option-votes-pagination.mdx) hook should be used instead.
71+
72+
This property is not available for anonymous polls.
73+
74+
| Type |
75+
| ------ |
76+
| `Record<string, PollVote>` |
77+
78+
### `max_votes_allowed`
79+
80+
A property containing the maximum number of votes allowed per user.
81+
82+
| Type |
83+
| ------ |
84+
| `number` |
85+
86+
### `name`
87+
88+
A property depicting the name of the `poll`.
89+
90+
| Type |
91+
| ------ |
92+
| `string` |
93+
94+
### `options`
95+
96+
A property that is a list of all of the options a `poll` has. A `poll` cannot have more than 100 options.
97+
98+
| Type |
99+
| ------ |
100+
| `PollOption[]` |
101+
102+
### `ownAnswer`
103+
104+
A property containing the answer (comment) of a user to the current `poll`. Only one answer can be provided by a single user. This property will not be present in anonymous polls.
105+
106+
| Type |
107+
| ------ |
108+
| `PollAnswer` | `undefined` |
109+
110+
### `ownVotesByOptionId`
111+
112+
A property containing the current user's own votes in a given `poll`, stored in an object by option ID.
113+
114+
| Type |
115+
| ------ |
116+
| `Record<string, PollVote>` |
117+
118+
### `vote_counts_by_option`
119+
120+
A property containing the vote counts in a given `poll`, stored in an object by option ID.
121+
122+
| Type |
123+
| ------ |
124+
| `Record<string, number>` |
125+
126+
### `voting_visibility`
127+
128+
A property depicting the visibility of votes in a given `poll`. It conforms to the `VotingVisibility` enum found [here](https://github.com/GetStream/stream-chat-js/blob/b447512922b19bc7e3668bd9df81debcb673dd81/src/types.ts).
129+
130+
| Type |
131+
| ------ |
132+
| `VotingVisibility` | `undefined` |

docusaurus/sidebars-react-native.json

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,23 @@
9999
"Thread List": ["ui-components/thread-list", "ui-components/thread-list-item"]
100100
},
101101
{
102-
"Poll": ["ui-components/create-poll", "ui-components/poll", "ui-components/poll-all-options", "ui-components/poll-answers-list", "ui-components/poll-results", "ui-components/poll-option-full-results", "ui-components/poll-buttons"]
102+
"Poll": [
103+
"ui-components/create-poll",
104+
"ui-components/poll",
105+
"ui-components/poll-all-options",
106+
"ui-components/poll-answers-list",
107+
"ui-components/poll-results",
108+
"ui-components/poll-option-full-results",
109+
"ui-components/poll-buttons",
110+
{
111+
"Hooks": [
112+
"hooks/poll/use-poll-context",
113+
"hooks/poll/use-create-poll-context",
114+
"hooks/poll/use-poll-state-store",
115+
"hooks/poll/use-poll-state"
116+
]
117+
}
118+
]
103119
},
104120
{
105121
"Contexts": [

0 commit comments

Comments
 (0)