Skip to content

Commit 7c5f92c

Browse files
MartinCupelaMartinCupela
authored
Merge pull request #1797 from GetStream/develop
v10.1.2
2 parents 9b03bc5 + 4c2c0a1 commit 7c5f92c

File tree

30 files changed

+380
-114
lines changed

30 files changed

+380
-114
lines changed

‎.env.example‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,5 @@ E2E_TEST_USER_2='test-user-2'
66
E2E_TEST_USER_2_TOKEN='test-user-2-jwt'
77
E2E_JUMP_TO_MESSAGE_CHANNEL='jump-to-message'
88
E2E_ADD_MESSAGE_CHANNEL='add-message'
9-
E2E_ADDITIONAL_CHANNELS="mr-channel-1,mr-channel-2,edit-message-channel"
9+
E2E_ADDITIONAL_CHANNELS="mr-channel-1,mr-channel-2,edit-message-channel,pin-message-channel"
1010
E2E_LONG_MESSAGE_LISTS_CHANNEL='navigate-long-message-lists'

‎.github/workflows/ci.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ jobs:
5454
E2E_APP_SECRET: ${{ secrets.E2E_APP_SECRET }}
5555
E2E_TEST_USER_1_TOKEN: ${{ secrets.E2E_TEST_USER_1_TOKEN }}
5656
E2E_TEST_USER_2_TOKEN: ${{ secrets.E2E_TEST_USER_2_TOKEN }}
57-
E2E_ADDITIONAL_CHANNELS: mr-channel-1, mr-channel-2, edit-message-channel
57+
E2E_ADDITIONAL_CHANNELS: mr-channel-1, mr-channel-2, edit-message-channel, pin-message-channel
5858
E2E_LONG_MESSAGE_LISTS_CHANNEL: navigate-long-message-lists
5959

6060
- name: 🎥 Upload Artifacts

‎docusaurus/docs/React/contexts/channel-action-context.mdx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,15 @@ The function to load next page/batch of `messages` (used for pagination).
111111
|----------|
112112
| function |
113113

114+
115+
### loadMoreNewer
116+
117+
The function to load next page/batch of `messages` (used for pagination).
118+
119+
| Type |
120+
|-------------------------------------|
121+
| (limit?: number) => Promise<number\> |
122+
114123
### loadMoreThread
115124

116125
The function to load next page/batch of `messages` in a currently active/open `Thread` (used for pagination).

‎docusaurus/docs/React/contexts/channel-state-context.mdx‎

Lines changed: 45 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ title: ChannelStateContext
55
---
66

77
The `ChannelStateContext` is a one of the context providers exposed in the [`Channel`](../core-components/channel.mdx) component and is consumable by all of the `Channel` children components.
8-
The context provides all of the state properties and logic for a `channel`, and you can access these by calling the `useChannelStateContext` custom hook.
8+
The context provides all the state properties and logic for a `channel`, and you can access these by calling the `useChannelStateContext` custom hook.
99

1010
## Basic Usage
1111

@@ -67,20 +67,37 @@ Error object (if any) in loading the `channel`, otherwise null.
6767

6868
### giphyVersion
6969

70-
The giphy version to use when displaying giphies.
70+
The giphy version to use when displaying giphies.
7171

7272
| Type |
7373
| --------------------------------------------------------------------------------------------------------------------------------------------------- |
7474
| `'original' | 'fixed_height' | 'fixed_height_still' | 'fixed_height_downsampled' | 'fixed_width' | 'fixed_width_still' | 'fixed_width_downsampled'` |
7575

7676
### hasMore
7777

78-
If the channel has more messages to paginate through.
78+
If the channel has more, older, messages to paginate through.
7979

8080
| Type |
8181
| ------- |
8282
| boolean |
8383

84+
85+
### hasMoreNewer
86+
87+
If the channel has more, newer, messages to paginate through.
88+
89+
| Type |
90+
| ------- |
91+
| boolean |
92+
93+
#### highlightedMessageId
94+
95+
Value is used internally for jump-to-message logic. Once the user "jumped" to the message, the message with the given ID is highlighted by manipulating its styles attribute.
96+
97+
| Type |
98+
|--------|
99+
| string |
100+
84101
### loading
85102

86103
Boolean for the `channel` loading state.
@@ -97,6 +114,14 @@ Boolean for the `channel` loading more messages.
97114
| ------- |
98115
| boolean |
99116

117+
### loadingMoreNewer?
118+
119+
Flag signalling whether newer messages are being loaded as the user scrolls down in the message list. Used internally by `VirtualizedMessageList`.
120+
121+
| Type |
122+
|---------|
123+
| boolean |
124+
100125
### maxNumberOfFiles
101126

102127
The maximum number of attachments allowed per `message`, defaults to the Stream Chat API maximum.
@@ -169,6 +194,15 @@ The read state for each `channel` member.
169194
| ------ |
170195
| object |
171196

197+
198+
### suppressAutoscroll
199+
200+
Flag signalling whether the scroll to the bottom is prevented. Used internally by `MessageList` and `VirtualizedMessageList` components.
201+
202+
| Type |
203+
|---------|
204+
| boolean |
205+
172206
### thread
173207

174208
The parent message for a `thread`, if there is one, otherwise null.
@@ -201,6 +235,14 @@ Array of messages within a `thread`.
201235
| -------- |
202236
| object[] |
203237

238+
### threadSuppressAutoscroll
239+
240+
Flag signalling whether the scroll to the bottom is prevented in thread. Used internally by `MessageList` and `VirtualizedMessageList` components.
241+
242+
| Type |
243+
|---------|
244+
| boolean |
245+
204246
### watcherCount
205247

206248
The number of watchers on the `channel`.

‎docusaurus/docs/React/contexts/message-context.mdx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -202,6 +202,15 @@ Function that retries sending a message after a failed request (overrides the fu
202202
| ------------------------------------------ |
203203
| (message: StreamMessage) => Promise<void\> |
204204

205+
206+
### highlighted
207+
208+
Whether to highlight and focus the message on load.
209+
210+
| Type |
211+
|---------|
212+
| boolean |
213+
205214
### initialMessage
206215

207216
When true, signifies the message is the parent message in a thread list.

‎docusaurus/docs/React/contexts/message-input-context.mdx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,15 @@ Function to close the `EmojiPicker` component.
7070
| ------------------------------------------- |
7171
| React.MouseEventHandler<HTMLButtonElement\> |
7272

73+
74+
### closeEmojiPickerOnClick
75+
76+
If true, picking an emoji from the `EmojiPicker` component will close the picker.
77+
78+
| Type |
79+
|---------|
80+
| boolean |
81+
7382
### closeMentionsList
7483

7584
Function to manually close the list of potential users to mention.
@@ -463,6 +472,15 @@ Function to upload a file to the `fileUploads` mapping.
463472
| -------------------- |
464473
| (id: string) => void |
465474

475+
### uploadImage
476+
477+
Function to upload an image.
478+
479+
| Type |
480+
| -------------------- |
481+
| (id: string) => void |
482+
483+
466484
### uploadNewFiles
467485

468486
Function to upload an array of files to the `fileUploads` and `imageUploads` mappings.

‎docusaurus/docs/React/custom-code-examples/override-submit-handler.mdx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,13 @@ function.
1919
You do not have to implement your custom submit handler, if the only thing you need is to pass custom message data to the underlying API call. In that case you can use the [`handleSubmit`](https://github.com/GetStream/stream-chat-react/blob/master/src/components/MessageInput/hooks/useSubmitHandler.ts) function from the [`MessageInputContext`](../contexts/message-input-context.mdx). The `handleSubmit` function allows you to pass custom message data through its second parameter `customMessageData`. This applies to sending a new message as well as updating an existing one. In order for this to work, you will have to implement custom message input components and pass them to [`Channel`](../core-components/channel.mdx) props `EditMessageInput` or `Input` respectively.
2020
:::
2121

22-
The `overrideSubmitHandler` function receives two arguments, the message to be sent and the `cid` (channel type prepended to channel id)
23-
for the currently active channel. The message object is of the following type:
22+
The `overrideSubmitHandler` function receives three arguments, the message to be sent, the `cid` (channel type prepended to channel id)
23+
for the currently active channel and optionally custom message data. The message object (the first argument) is of the following type:
2424

2525
```tsx
2626
type MessageToSend = {
2727
attachments?: MessageAttachments;
28+
error?: ErrorFromResponse<APIErrorResponse>;
2829
errorStatusCode?: number;
2930
id?: string;
3031
mentioned_users?: UserResponse[];

‎docusaurus/docs/React/utility-components/channel-preview-ui.mdx‎

Lines changed: 25 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,11 @@ sidebar_position: 4
44
title: ChannelPreview UI
55
---
66

7+
import GHComponentLink from '../_docusaurus-components/GHComponentLink';
8+
79
The ChannelPreview UI component receives props via the [`ChannelPreview`](./channel-preview.mdx) wrapper, and
810
these props are a combination of the `ChannelPreview` props with additional UI specific items. The wrapper also handles the required logic
9-
while the UI component is responsible for the UI display and the click functionality for channel selection.
11+
while the UI component is responsible for the UI display and the click functionality for channel selection.
1012

1113
This UI component is set via the `Preview` prop on `ChannelList`, and if nothing is provided then the default is used, [`ChannelPreviewMessenger`](https://github.com/GetStream/stream-chat-react/blob/master/src/components/ChannelPreview/ChannelPreviewMessenger.tsx).
1214

@@ -54,11 +56,11 @@ The currently selected channel object.
5456

5557
### Avatar
5658

57-
The custom UI component to display the an avatar for the channel.
59+
The custom UI component to display the avatar for the channel.
5860

59-
| Type | Default |
60-
| --------- | ----------------------------------------------------------------------------------------------------- |
61-
| component | [Avatar](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Avatar/Avatar.tsx) |
61+
| Type | Default |
62+
|-----------|------------------------------------------------------------|
63+
| component | <GHComponentLink text='Avatar' path='/Avatar/Avatar.tsx'/> |
6264

6365
### channelUpdateCount
6466

@@ -68,6 +70,13 @@ A number that forces the update of the preview component on channel update.
6870
| ------ |
6971
| number |
7072

73+
### className
74+
75+
Custom class for the channel preview root
76+
77+
| Type |
78+
|--------|
79+
| string |
7180

7281
### displayImage
7382

@@ -99,13 +108,21 @@ Latest message preview to display. Will be either a string or a JSX.Element rend
99108
| --------------------- |
100109
| string \| JSX.Element |
101110

111+
### onSelect
112+
113+
Custom handler invoked when the `ChannelPreview` is clicked. The SDK uses `ChannelPreview` to display items of channel search results. There, behind the scenes, the new active channel is set.
114+
115+
| Type |
116+
|-----------------------------------|
117+
| (event: React.MouseEvent) => void |
118+
102119
### Preview
103120

104121
The UI component to use for display.
105122

106-
| Type | Default |
107-
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
108-
| component | [ChannelPreviewMessenger](https://github.com/GetStream/stream-chat-react/blob/master/src/components/ChannelPreview/ChannelPreviewMessenger.tsx) |
123+
| Type | Default |
124+
|-----------|------------------------------------------------------------------------------------------------------|
125+
| component | <GHComponentLink text='ChannelPreviewMessenger' path='/ChannelPreview/ChannelPreviewMessenger.tsx'/> |
109126

110127
### setActiveChannel
111128

‎docusaurus/docs/React/utility-components/channel-preview.mdx‎

Lines changed: 29 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ sidebar_position: 3
44
title: ChannelPreview
55
---
66

7+
import GHComponentLink from '../_docusaurus-components/GHComponentLink';
8+
79
The `ChannelPreview` component is a wrapper component that handles the logic and functionality for a provided (or the default) channel preview and ultimately dictates the display via the component's `Preview` prop.
810

911
## Basic Usage
@@ -16,9 +18,9 @@ This prop from the parent component ultimately sets the `Preview` prop in `Chann
1618

1719
```tsx
1820
const YourCustomChannelPreview = ({ latestMessage, lastMessage }) => {
19-
// "lastMessage" property is for for the last
21+
// "lastMessage" property is for the last
2022
// message that has been interacted with (pinned/edited/deleted)
21-
23+
2224
// to display last message of the channel use "latestMessage"
2325
return <span>{latestMessage}</span>
2426
};
@@ -32,7 +34,7 @@ const YourCustomChannelPreview = ({ latestMessage, lastMessage }) => {
3234

3335
## Props
3436

35-
### channel
37+
### <div class="label required basic">Required</div> channel
3638

3739
This required prop is the `channel` to be previewed; comes from either the `channelRenderFilterFn` or `usePaginatedChannels` call from
3840
[ChannelList](https://github.com/GetStream/stream-chat-react/blob/master/src/components/ChannelList/ChannelList.tsx) and does not need to be set manually.
@@ -51,11 +53,11 @@ The currently selected channel object.
5153

5254
### Avatar
5355

54-
The custom UI component to display the an avatar for the `channel`.
56+
The custom UI component to display the avatar for the `channel`.
5557

56-
| Type | Default |
57-
| --------- | ----------------------------------------------------------------------------------------------------- |
58-
| component | [Avatar](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Avatar/Avatar.tsx) |
58+
| Type | Default |
59+
|-----------|------------------------------------------------------------|
60+
| component | <GHComponentLink text='Avatar' path='/Avatar/Avatar.tsx'/> |
5961

6062
### channelUpdateCount
6163

@@ -65,13 +67,30 @@ A number that forces the update of the preview component on channel update.
6567
| ------ |
6668
| number |
6769

70+
### className
71+
72+
Custom class for the channel preview root
73+
74+
| Type |
75+
|--------|
76+
| string |
77+
78+
79+
### onSelect
80+
81+
Custom handler invoked when the `ChannelPreview` is clicked. The SDK uses `ChannelPreview` to display items of channel search results. There, behind the scenes, the new active channel is set.
82+
83+
| Type |
84+
|-----------------------------------|
85+
| (event: React.MouseEvent) => void |
86+
6887
### Preview
6988

7089
The UI component to use for display.
7190

72-
| Type | Default |
73-
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
74-
| component | [ChannelPreviewMessenger](https://github.com/GetStream/stream-chat-react/blob/master/src/components/ChannelPreview/ChannelPreviewMessenger.tsx) |
91+
| Type | Default |
92+
|-----------|------------------------------------------------------------------------------------------------------|
93+
| component | <GHComponentLink text='ChannelPreviewMessenger' path='/ChannelPreview/ChannelPreviewMessenger.tsx'/> |
7594

7695
### setActiveChannel
7796

0 commit comments

Comments
 (0)