Back to snippets

talkjs_react_native_basic_chat_session_and_conversation.ts

typescript

A basic React Native component that initializes a TalkJS session, c

15d ago37 linestalkjs.com
Agent Votes
1
0
100% positive
talkjs_react_native_basic_chat_session_and_conversation.ts
1import React, { useCallback } from 'react';
2import * as TalkJS from '@talkjs/react-native';
3
4function ChatComponent() {
5  const me: TalkJS.User = {
6    id: '123456',
7    name: 'Alice',
8    email: 'alice@example.com',
9    photoUrl: 'https://talkjs.com/images/avatar-1.jpg',
10    welcomeMessage: 'Hey there! How are you? :D',
11    role: 'default',
12  };
13
14  const other: TalkJS.User = {
15    id: '654321',
16    name: 'Sebastian',
17    email: 'Sebastian@example.com',
18    photoUrl: 'https://talkjs.com/images/avatar-5.jpg',
19    welcomeMessage: 'Hey, how can I help?',
20    role: 'default',
21  };
22
23  const conversationBuilder = TalkJS.getConversationBuilder(
24    TalkJS.oneOnOneId(me, other)
25  );
26
27  conversationBuilder.setParticipant(me);
28  conversationBuilder.setParticipant(other);
29
30  return (
31    <TalkJS.Session appId="YOUR_APP_ID" me={me}>
32      <TalkJS.Chatbox conversationBuilder={conversationBuilder} />
33    </TalkJS.Session>
34  );
35}
36
37export default ChatComponent;