This is a custom chat for musora apps.
- stream-chat
- react-native-android-keyboard-adjust (this is used on android for keeping the list under the keyboard)
npm i --save https://github.com/railroadmedia/MusoraChat.git
Prop | Type | Required | Description |
---|---|---|---|
appColor | string | yes | App's specific color; it will be used on confirmation btns for moderators for example |
chatId | string | yes | Provided by the BE, chatId is the id of the chat channel |
clientId | string | yes | Provided by the BE, clientId is the id of the client to which the user is then connected and chat & questions channels querried |
isDark | bool | no | MusoraChat can handle light/dark theme |
onRemoveAllMessages | function | yes | Call API's remove all messages endpoint .../chat/delete-user-messages?user_id=${userId} |
onToggleBlockStudent | function | yes | Call API's block student endpoint .../chat/(un)ban-user?user_id=${userId} |
questionsId | string | yes | Provided by the BE, questionsId is the id of the questions channel |
user | object | yes | User's credentials for connecting to client{ id: "user's id", gsToken: "provided by the BE this is the getstream token" } |
Arg | Type | Required | Description |
---|---|---|---|
arg1 (clientId) | string | yes | Provided by the BE clientId is the id of the client to which the user is then connected and chat & questions channels querried |
arg2 (chatId) | string | yes | Provided by the BE chatId is the id of the chat channel |
arg3 (userId) | string/int | yes | User's id |
arg4 (gsToken) | string | yes | Provided by the BE this is the getstream token |
arg5 | function | yes | This is a callback function that receives the viewers/watchers number as an argument |
watchersListener()
returns a promise resolving into a function that once called removes the event listener.
import { MusoraChat } from 'Musorachat';
...
<MusoraChat
appColor={'#0b76db'}
chatId={'app_chat'}
clientId={'a1pvevgrmj91'}
isDark={true}
onRemoveAllMessages={userService.removeAllMessages}
onToggleBlockStudent={userService.toggleBlockStudent}
questionsId={app_questions}
user={{ id: 1920123, gsToken: "ADsAD0ASD8JKV1QiLCJhbGciOiJI..." }}
/>
...
import { watchersListener } from 'MusoraChat';
...
componentDidMount() {
watchersListener(
'a1pvevgrmj91',
'app_chat',
1920123,
'ADsAD0ASD8JKV1QiLCJhbGciOiJI...',
viewers => this.setState({ viewers })
).then(rwl => (this.removeWatchersListener = rwl));
}
componentWillUnmount() {
this.removeWatchersListener?.();
}
...