Skip to content

Commit 429ee0f

Browse files
chohongmbang9
chohongm
and
bang9
authored
feat: Added messageStackDirection in Constant (#405)
## Changes - ticket: [AC-4550] ## Additional Notes - Added `messageStackDirection` in `Constant` ## Checklist Before requesting a code review, please check the following: - [ ] **[Required]** CI has passed all checks. - [ ] **[Required]** A self-review has been conducted to ensure there are no minor mistakes. - [ ] **[Required]** Unnecessary comments/debugging code have been removed. - [ ] **[Required]** All requirements specified in the ticket have been accurately implemented. - [ ] Ensure the ticket has been updated with the sprint, status, and story points. [AC-4550]: https://sendbird.atlassian.net/browse/AC-4550?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ --------- Co-authored-by: Hyungu Kang | Airen <gusrn1423@naver.com>
1 parent 86d1096 commit 429ee0f

File tree

3 files changed

+30
-18
lines changed

3 files changed

+30
-18
lines changed

‎README.md

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -108,25 +108,26 @@ export default App;
108108
```
109109

110110
### Available props
111-
| Prop Name | Type | Required | Default Value | Description |
112-
|-------------------------|-----------------------------------------|----------|---------------|----------------------------------------------------------------------------------------------------------------|
113-
| `applicationId` | `string` | Yes | N/A | Your Sendbird application ID |
114-
| `botId` | `string` | Yes | N/A | Your Sendbird bot ID | |
115-
| `userNickName` | `string` | No | N/A | The nickname of the user | |
116-
| `enableEmojiFeedback` | `boolean` | No | `true` | Enables emoji feedback functionality. |
117-
| `enableMention` | `boolean` | No | `true` | Enables mention functionality. |
118-
| `deviceType` | `'desktop' \| 'mobile'` | No | N/A | Device type to be used in the widget |
119-
| `stringSet` | `{ [key: string]: string }` | No | N/A | Customizable string set. Available string sets can be found [here](https://github.com/sendbird/sendbird-uikit-react/blob/main/src/ui/Label/stringSet.ts). |
120-
| `customRefreshComponent` | `{ icon: string, style: React.CSSProperties, width: string, height: string, onClick: () => void }` | No | N/A | Customizable refresh component. You can set properties such as `icon`, `style`, `width`, `height`, and `onClick`. |
121-
| `userId` | `string` | No | N/A | User ID to be used in the widget connect. Must be used with `sessionToken` and `configureSession`. The example usage can be found [here](./custom-session-guide.md). |
122-
| `sessionToken` | `string` | No | N/A | Session token to be used in the widget connect. Must be used with `userId` and `configureSession`. The example usage can be found [here](./custom-session-guide.md). |
123-
| `configureSession` | `() => SessionHandler` | No | N/A | Session configuration function. Must be used with `userId` and `sessionToken`. The example usage can be found [here](./custom-session-guide.md). |
124-
| `autoOpen` | `boolean` | No | N/A | Determines whether the chatbot widget automatically opens when the browser window is opened. This property is being ignored in mobile view. |
125-
| `enableResetHistoryOnConnect` | `boolean` | No | `false` | Determines whether the chatbot widget history is reset when the user connects. |
111+
| Prop Name | Type | Required | Default Value | Description |
112+
|-------------------------|---------------------------------------|----------|------------|----------------------------------------------------------------------------------------------------------------|
113+
| `applicationId` | `string` | Yes | N/A | Your Sendbird application ID |
114+
| `botId` | `string` | Yes | N/A | Your Sendbird bot ID | |
115+
| `userNickName` | `string` | No | N/A | The nickname of the user | |
116+
| `enableEmojiFeedback` | `boolean` | No | `true` | Enables emoji feedback functionality. |
117+
| `enableMention` | `boolean` | No | `true` | Enables mention functionality. |
118+
| `deviceType` | `'desktop' \| 'mobile'` | No | N/A | Device type to be used in the widget |
119+
| `stringSet` | `{ [key: string]: string }` | No | N/A | Customizable string set. Available string sets can be found [here](https://github.com/sendbird/sendbird-uikit-react/blob/main/src/ui/Label/stringSet.ts). |
120+
| `customRefreshComponent` | `{ icon: string, style: React.CSSProperties, width: string, height: string, onClick: () => void }` | No | N/A | Customizable refresh component. You can set properties such as `icon`, `style`, `width`, `height`, and `onClick`. |
121+
| `userId` | `string` | No | N/A | User ID to be used in the widget connect. Must be used with `sessionToken` and `configureSession`. The example usage can be found [here](./custom-session-guide.md). |
122+
| `sessionToken` | `string` | No | N/A | Session token to be used in the widget connect. Must be used with `userId` and `configureSession`. The example usage can be found [here](./custom-session-guide.md). |
123+
| `configureSession` | `() => SessionHandler` | No | N/A | Session configuration function. Must be used with `userId` and `sessionToken`. The example usage can be found [here](./custom-session-guide.md). |
124+
| `autoOpen` | `boolean` | No | N/A | Determines whether the chatbot widget automatically opens when the browser window is opened. This property is being ignored in mobile view. |
125+
| `enableResetHistoryOnConnect` | `boolean` | No | `false` | Determines whether the chatbot widget history is reset when the user connects. |
126126
| `messageInputControls.blockWhileBotResponding` | `boolean \| number` | No | N/A | Allows to control enabled/disabled state of the message input for waiting for the bot's reply mesage. If number value is given, a timer will be set to force unblock the message input. |
127127
| `dateLocale` | `Locale` | No | `enUS` | Locale value to be applied to string values of message timestamp and date separator. Locale values must be imported from `date-fns`. |
128-
| `enableHideWidgetForDeactivatedUser` | `boolean` | No | `false` | Determines whether the chatbot widget is hidden when the user is deactivated. |
128+
| `enableHideWidgetForDeactivatedUser` | `boolean` | No | `false` | Determines whether the chatbot widget is hidden when the user is deactivated. |
129129
| `enableWidgetExpandButton` | `boolean` | No | `false` | Determines whether the expand button is displayed in the chatbot widget. |
130+
| `messageStackDirection` | `'top' \| 'bottom'` | No | `'bottom'` | Determines direction at which message stack starts in the message list. |
130131

131132
## For internal contributors
132133
- [Release guide](./release-guide.md)

‎src/components/chat/ui/ChatMessageList.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,14 @@ import { useTypingTargetMessageId } from '../hooks/useTypingTargetMessageId';
2020

2121
export const ChatMessageList = () => {
2222
const { channel, dataSource, scrollSource, handlers } = useChatContext();
23-
const { botStudioEditProps, customUserAgentParam, stringSet, dateLocale, enableMessageGrouping } = useConstantState();
23+
const {
24+
botStudioEditProps,
25+
customUserAgentParam,
26+
stringSet,
27+
dateLocale,
28+
enableMessageGrouping,
29+
messageStackDirection = 'bottom',
30+
} = useConstantState();
2431

2532
const typingTargetMessageId = useTypingTargetMessageId();
2633
const { filteredMessages, shouldShowOriginalDate, renderBotStudioWelcomeMessages } = useBotStudioView();
@@ -42,7 +49,7 @@ export const ChatMessageList = () => {
4249
scrollPositionRef={scrollSource.scrollPositionRef}
4350
scrollDistanceFromBottomRef={scrollSource.scrollDistanceFromBottomRef}
4451
onScrollPosition={(it) => scrollSource.setIsScrollBottomReached(it === 'bottom')}
45-
stackDirection={'bottom'}
52+
stackDirection={messageStackDirection}
4653
messages={filteredMessages}
4754
onLoadPrev={dataSource.loadPrevious}
4855
onLoadNext={dataSource.loadNext}

‎src/const.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -187,6 +187,10 @@ export interface Constant extends ConstantFeatureFlags, ConstantAIFeatures, Cons
187187
* @description Message input state controlling properties.
188188
*/
189189
messageInputControls?: MessageInputControls;
190+
/**
191+
* @public
192+
* */
193+
messageStackDirection?: 'top' | 'bottom';
190194
/**
191195
* @private
192196
* @description Whether to show the beta mark.

0 commit comments

Comments
 (0)