@vonage/client-sdk 1.1.0-alpha.1 → 1.1.0-alpha.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,52 +1,75 @@
1
- # Vonage Voice SDK
1
+ # Vonage Client SDK
2
2
 
3
3
  The Client SDK is intended to provide a ready solution for developers to build Programmable Conversation applications across multiple Channels including: Messages, Voice, SIP, websockets, and App.
4
4
 
5
+ > **⚠️ Warning:** Chat Functionality (Beta)
6
+ >
7
+ > The chat functionality in our SDK is currently in beta. Methods related to chat may undergo changes as we refine and improve this feature. Please be aware of potential updates as we work towards its stability. Your feedback is valuable in shaping its development.
8
+
5
9
  ## Installation
6
10
 
7
11
  The SDK can be installed using the npm install command
8
12
 
9
- ```
13
+ ```bash
10
14
  npm i @vonage/client-sdk
11
15
  ```
12
16
 
13
17
  ## SDK setup
14
18
 
15
- ### With budler (webpack or vite)
19
+ ### With bundler (Webpack, Vite, etc.) and React
16
20
 
17
21
  ```js
18
- import './App.css';
19
- import { VoiceClient, ClientConfig, ConfigRegion } from '@vonage/client-sdk';
20
- import VoiceClient, { ClientConfig, ConfigRegion } from '@vonage/client-sdk/voice'; // NextJS/Webpack users see note below
21
-
22
- const client = new VoiceClient();
23
-
24
- // Config is optional but recomended, default region is US
25
- const config = new ClientConfig(ConfigRegion.US);
26
- client.setConfig(config);
22
+ import { VonageClient, ClientConfig, ConfigRegion } from '@vonage/client-sdk';
23
+ import { useState, useEffect } from 'react';
27
24
 
28
25
  function App() {
29
- const createSession = async () => {
30
- const token = 'my-token';
31
- await client.createSession(token);
32
- };
33
-
34
- return <button onClick={createSession}> create session </button>;
26
+ // Config is optional but recomended, default region is US
27
+ const [config] = useState(() => new ClientConfig(ConfigRegion.US));
28
+ const [client] = useState(() => {
29
+ const client = new VonageClient();
30
+ client.setConfig(config);
31
+ return client;
32
+ });
33
+ const [session, setSession] = useState();
34
+ const [user, setUser] = useState();
35
+ const [error, setError] = useState();
36
+
37
+ // Create Session as soon as client is available
38
+ useEffect(() => {
39
+ if (!client) return;
40
+ client
41
+ .createSession('my-token')
42
+ .then((session) => setSession(session))
43
+ .catch((error) => setError(error));
44
+ }, [client]);
45
+
46
+ // Get User as soon as a session is available
47
+ useEffect(() => {
48
+ if (!client || !session) return;
49
+ client
50
+ .getUser('me')
51
+ .then((user) => setUser(user))
52
+ .catch((error) => setError(error));
53
+ }, [client, session]);
54
+
55
+ if (error) return <pre>{JSON.stringify(error)}</pre>;
56
+
57
+ if (!session || !user) return <div>Loading...</div>;
58
+
59
+ return <div>User {user.displayName || user.name} logged in</div>;
35
60
  }
36
61
 
37
62
  export default App;
38
63
  ```
39
64
 
40
- - **Node**: We have a known issue with NextJS / Webpack that means the main import from `@vonage/client-sdk` doesn't work, however if you import from `@vonage/client-sdk/voice` the voice client successfully imports. we are working on a fix.
41
-
42
65
  ### With script tag (UMD)
43
66
 
44
67
  ```html
45
68
  <!-- <script src="./node_modules/@vonage/client-sdk/dist/vonageClientSDK.js"></script> -->
46
- <!-- <script src="https://cdn.jsdelivr.net/npm/@vonage/client-sdk@0.1.4/dist/vonageClientSDK.min.js"></script> -->
69
+ <!-- <script src="https://cdn.jsdelivr.net/npm/@vonage/client-sdk@1.0.0/dist/vonageClientSDK.min.js"></script> -->
47
70
  <script src="./node_modules/@vonage/client-sdk/dist/vonageClientSDK.min.js"></script>
48
71
  <script>
49
- const token = 'some-token';
72
+ const token = 'my-token';
50
73
  const client = new vonageClientSDK.VoiceClient();
51
74
  const config = new vonageClientSDK.ClientConfig(
52
75
  vonageClientSDK.ConfigRegion.EU
@@ -61,31 +84,160 @@ export default App;
61
84
 
62
85
  ```js
63
86
  import {
64
- VoiceClient,
87
+ VonageClient,
65
88
  ClientConfig,
66
89
  ConfigRegion
67
- } from 'https://cdn.jsdelivr.net/npm/@vonage/client-sdk@0.1.4/dist/vonageClientSDK.esm.min.js';
90
+ } from 'https://cdn.jsdelivr.net/npm/@vonage/client-sdk@1.0.0/dist/vonageClientSDK.esm.min.js';
68
91
 
69
- const client = new VoiceClient();
92
+ const client = new VonageClient();
70
93
 
71
94
  // Config is optional but recomended, default region is US
72
95
  const config = new ClientConfig(ConfigRegion.US);
73
96
  client.setConfig(config);
74
97
 
75
- const token = 'my-token';
76
- client
77
- .createSession(token)
78
- .then((sessionId) => console.log(sessionId))
79
- .catch((err) => console.log(err));
98
+ (async () => {
99
+ const token = 'my-token';
100
+ try {
101
+ // Create Session
102
+ const sessionId = await client.createSession(token);
103
+ // Get User
104
+ const user = await client.getUser('me');
105
+ console.log(
106
+ `User ${
107
+ user.displayName || user.name
108
+ } logged in with session ID: ${sessionId}`
109
+ );
110
+ } catch (error) {
111
+ // Log errors for either createSession or getUser
112
+ console.error(error);
113
+ }
114
+ })();
115
+ ```
116
+
117
+ ## Example Usage
118
+
119
+ Below are several typical scenarios where the SDK is commonly utilized.
120
+
121
+ ### Make an Outbound Call
122
+
123
+ ```ts
124
+ const call = await client.serverCall({
125
+ customData: {
126
+ callee: 'bob',
127
+ type: 'app'
128
+ }
129
+ });
130
+ console.log(call);
131
+ ```
132
+
133
+ ### Answer/Reject an Inbound Call
134
+
135
+ ```ts
136
+ // Answer Call
137
+ client.on(
138
+ 'callInvite',
139
+ async (callId: string, from: string, channelType: string) => {
140
+ client.answerCall(callId);
141
+ console.log(callId, from, channelType);
142
+ }
143
+ );
144
+
145
+ // ----
146
+
147
+ // Reject Call
148
+ client.on(
149
+ 'callInvite',
150
+ async (callId: string, from: string, channelType: string) => {
151
+ client.rejectCall(callId);
152
+ console.log(callId, from, channelType);
153
+ }
154
+ );
155
+ ```
156
+
157
+ ### Hang-up and Collect Stats
158
+
159
+ ```ts
160
+ // await client.hangup(call);
161
+ await client.hangup(call, 'reason-text', 'reason-code');
162
+
163
+ client.on('callHangup', async (callId: string, callQuality: RTCQuality) => {
164
+ if (callId == call) {
165
+ console.log(`Call ${callId} has hanged up, callQuality:${callQuality}`);
166
+ }
167
+ });
168
+ ```
169
+
170
+ ### Get Conversations
171
+
172
+ ```ts
173
+ try {
174
+ let cursor: string | undefined | null = undefined;
175
+ const pageSize = 10;
176
+ const conversations: Conversation[] = [];
177
+ do {
178
+ const response: ConversationsPage = await client.getConversations(
179
+ PresentingOrder.ASC,
180
+ pageSize,
181
+ cursor
182
+ );
183
+ conversations.push(...response.conversations);
184
+ cursor = response.nextCursor;
185
+ } while (cursor !== null);
186
+ console.log(`Conversations successfully fetched: ${conversations}`);
187
+ } catch (e) {
188
+ console.log(`Error in fetching Conversations: ${e}`);
189
+ }
190
+ ```
191
+
192
+ ### Send Text Messages
193
+
194
+ ```ts
195
+ try {
196
+ const timestamp = await client.sendTextMessage(
197
+ 'conversationId',
198
+ 'Hello there'
199
+ );
200
+ console.log(`Message successfully sent with timestamp ${timestamp}`);
201
+ } catch (e) {
202
+ console.log(`Error in sending Message: ${e}`);
203
+ }
204
+ ```
205
+
206
+ ### Listen for Conversation Events
207
+
208
+ ```ts
209
+ client.on('conversationEvent', async (event) => {
210
+ if (event instanceof MemberInvitedEvent) {
211
+ console.log(
212
+ `User ${event.body.invitee.name} invited by ${event.body.inviter?.name} to Conversation ${event.conversationId}`
213
+ );
214
+ } else if (event instanceof MemberJoinedEvent) {
215
+ console.log(
216
+ `User ${event.body.user.name} joined Conversation ${event.conversationId}`
217
+ );
218
+ } else if (event instanceof MemberLeftEvent) {
219
+ console.log(
220
+ `User ${event.body.user.name} left Conversation ${event.conversationId}`
221
+ );
222
+ } else if (event instanceof TextMessageEvent) {
223
+ console.log(
224
+ `User ${event.body.sender.name} sent Text Message '${event.body.text}' in Conversation ${event.conversationId}`
225
+ );
226
+ } else if (event instanceof CustomMessageEvent) {
227
+ console.log(
228
+ `User ${event.body.sender} sent Custom Message '${event.body.customData}' in Conversation ${event.conversationId}`
229
+ );
230
+ }
231
+ });
80
232
  ```
81
233
 
82
234
  ## Documentation and examples
83
235
 
84
- Visit [vonage website] (<https://developer.vonage.com/tools>)
236
+ Visit [Vonage website](https://developer.vonage.com/tools)
85
237
 
86
238
  ## License
87
239
 
88
- Copyright (c) 2023 Vonage, Inc. All rights reserved. Licensed only under the Vonage Client SDK License Agreement (the "License") located at [LICENCE](https://github.com/nexmoinc/conversation-js-sdk/blob/master/LICENSE).
240
+ Copyright (c) 2023 Vonage, Inc. All rights reserved. Licensed only under the Vonage Client SDK License Agreement (the "License") located at [LICENSE](https://github.com/nexmoinc/conversation-js-sdk/blob/master/LICENSE).
89
241
 
90
242
  By downloading or otherwise using our software or services, you acknowledge that you have read, understand and agree to be bound by the Vonage Client SDK License Agreement and Privacy Policy.
91
243
 
@@ -1,9 +1,16 @@
1
1
  import vonage from '../utils/vonage';
2
- export * from '../utils';
3
2
  /**
4
- * Minimal Interface built on top of KMP export
5
- * DO NOT ADD CODE HERE UNLESS REALLY NEEDEED!!111!
3
+ * The Vonage Client SDK for JS/TS provides a simple interface
4
+ * For the Vonage Voice and Messaging APIs.
5
+ *
6
+ * @remarks
7
+ * Built on top of the Kotlin Multiplatform SDK, it provides a
8
+ * more JS-like API, and platform specific implementations for
9
+ * the underlying network and media layers.
10
+ *
11
+ * @packageDocumentation
6
12
  */
13
+ export * from '../utils';
7
14
  export type VonageEvent = vonage.CombinedEvents;
8
15
  export type RTCQuality = vonage.RTCQualityJS;
9
16
  export type CancelReason = vonage.CancelReasonJS;
@@ -12,13 +19,300 @@ export type HangupReason = vonage.HangupReasonJS;
12
19
  export declare const HangupReason: typeof vonage.HangupReasonJS;
13
20
  export type SessionErrorReason = vonage.SessionErrorReasonJS;
14
21
  export declare const SessionErrorReason: typeof vonage.SessionErrorReasonJS;
22
+ export type Leg = vonage.LegJS;
15
23
  export type LegStatus = vonage.LegStatusJS;
16
24
  export declare const LegStatus: typeof vonage.LegStatusJS;
25
+ export type CallSayParams = Partial<vonage.CallSayParams> & {
26
+ text: string;
27
+ };
28
+ type JSONValue = string | number | boolean | {
29
+ [x: string]: JSONValue;
30
+ } | JSONValue[];
31
+ import { Conversation, ConversationsPage, EventsPage, Member, MembersPage, PresentingOrder } from '../utils';
17
32
  export declare const setVonageClientLoggingLevel: typeof vonage.setDefaultLoggingLevel;
33
+ /**
34
+ * VonageClient is the main entry point for the Vonage Client SDK.
35
+ *
36
+ * @privateRemarks
37
+ * This class is a wrapper around the KMP `CombinedClientJS` class.
38
+ * It provides a more JS-like API, and also provides a proxy object
39
+ * to allow for registering callbacks via `on()`.
40
+ *
41
+ * Minimal Interface built on top of KMP export
42
+ * DO NOT ADD CODE HERE UNLESS REALLY NEEDEED!!111!
43
+ */
18
44
  export declare class VonageClient extends vonage.CombinedClientJS {
19
- private callbacks;
20
45
  constructor();
21
- on<T extends keyof VonageEvent, Fn extends VonageEvent[T]>(event: T, callback: Fn): void;
22
- hangup(callId: string, reasonText?: string, reasonCode?: string): Promise<any>;
46
+ /**
47
+ * Register a callback for an event.
48
+ *
49
+ * @example
50
+ * [[include:register_listener.txt]]
51
+ *
52
+ * @param event - the event to register for (e.g. 'legStatusUpdate')
53
+ * @param callback - the callback to register for the event
54
+ * @returns a symbol that can be used to unregister the callback
55
+ * @remarks
56
+ * Besure to store the symbol returned by this method so you can unregister the callback later.
57
+ * We recommend deregistering callbacks when you no longer need them. See {@link off}.
58
+ */
59
+ on<T extends keyof VonageEvent, Fn extends VonageEvent[T]>(event: T, callback: Fn): symbol;
60
+ /**
61
+ * Unregister a callback for an event.
62
+ *
63
+ * @example
64
+ * [[include:unregister_listener.txt]]
65
+ *
66
+ * @param event - the event to register for (e.g. 'legStatusUpdate')
67
+ * @param callbackSymbol - the callback symbol to unregister
68
+ * @returns true if the callback was unregistered, false otherwise
69
+ * @remarks
70
+ * We recommend deregistering callbacks when you no longer need them.
71
+ */
72
+ off<T extends keyof VonageEvent>(event: T, callbackSymbol: symbol): boolean;
73
+ /**
74
+ * Clear all callbacks for an event.
75
+ *
76
+ * @example
77
+ * [[include: clear_callbacks.txt]]
78
+ *
79
+ * @param event - the event to unregister from (e.g. 'legStatusUpdate')
80
+ * @returns void
81
+ *
82
+ * @remarks
83
+ * This is useful for cleaning up callbacks when you no longer need them.
84
+ *
85
+ */
86
+ clearCallbacks<T extends keyof VonageEvent>(event: T): void;
87
+ /**
88
+ * Create a session with a token and optional sessionId
89
+ * If no sessionId is provided, a new one will be generated
90
+ * and returned. If a sessionId is provided, it will be used
91
+ * to resume an existing session.
92
+ *
93
+ * @example
94
+ * [[include:create_session.txt]]
95
+ *
96
+ * @param token
97
+ * @param sessionId - optional sessionId to use
98
+ * @returns the `sessionId` of the session
99
+ */
100
+ createSession(token: string, sessionId?: string | null): Promise<string>;
101
+ /**
102
+ * Get the Peer Connection for a call
103
+ *
104
+ * @experimental
105
+ * @group Voice
106
+ * @param id - The Call Id
107
+ */
108
+ getPeerConnection(id: string): RTCPeerConnection;
109
+ /**
110
+ * Get the Leg for a call
111
+ *
112
+ * @group Voice
113
+ * @param legId - The Leg Id
114
+ */
115
+ getLeg(legId: string): Promise<Leg>;
116
+ /**
117
+ * Make a server call to the Vonage API.
118
+ * This is used to initiate a call using the Voice API and NCCO.
119
+ *
120
+ * @example
121
+ * [[include:outbound_call.txt]]
122
+ *
123
+ * @group Voice
124
+ * @param context - the context to send to the server passed as Custom data to the voice answer webhook
125
+ * @returns the `callId` of the call
126
+ */
127
+ serverCall(context?: Json): Promise<string>;
128
+ /**
129
+ * Hangup a call.
130
+ *
131
+ * @example
132
+ * [[include:call_hangup.txt]]
133
+ *
134
+ * @group Voice
135
+ * @param callId - the `callId` of the call to hangup
136
+ * @param reasonText - optional reason text to send to the other party
137
+ * @param reasonCode - optional reason code to send to the other party
138
+ * @returns void
139
+ */
140
+ hangup(callId: string, reasonText?: string, reasonCode?: string): Promise<void>;
141
+ /**
142
+ * Sends a TTS message to the Call
143
+ *
144
+ * @group Voice
145
+ * @param callId - the `callId` of the call to send the message to
146
+ * @param text - the text to send
147
+ * @returns void
148
+ */
149
+ say(callId: string, text: string): Promise<void>;
150
+ /**
151
+ * Sends a TTS message to the Call
152
+ *
153
+ * @example
154
+ * [[include:call_say.txt]]
155
+ *
156
+ * @group Voice
157
+ * @param callId - the `callId` of the call to send the message to
158
+ * @param params - the `CallSayParams` to send
159
+ * @returns void
160
+ */
161
+ say(callId: string, params: CallSayParams): Promise<void>;
162
+ /**
163
+ * Get a list of Conversations for the user.
164
+ *
165
+ * @example
166
+ * [[include:get_conversations.txt]]
167
+ *
168
+ * @group Chat
169
+ * @beta
170
+ * @param order - the order to return the conversations in (default: 'asc')
171
+ * @param pageSize - the number of conversations to return per page (default: 100)
172
+ * @param cursor - the cursor to use for pagination (default: null)
173
+ * @returns a `ConversationsPage` containing the conversations
174
+ */
175
+ getConversations(order?: PresentingOrder, pageSize?: number, cursor?: string | null): Promise<ConversationsPage>;
176
+ /**
177
+ * Get a Conversation's Events
178
+ *
179
+ * @example
180
+ * [[include:get_conversation_events.txt]]
181
+ *
182
+ * @group Chat
183
+ * @beta
184
+ * @param id - the Conversation's id
185
+ * @param order - the order to return the events in (default: 'asc')
186
+ * @param pageSize - the number of events to return per page (default: 100)
187
+ * @param cursor - the cursor to use for pagination (default: null)
188
+ * @returns a `EventsPage` containing the events
189
+ */
190
+ getConversationEvents(id: string, order?: PresentingOrder, pageSize?: number, cursor?: string | null): Promise<EventsPage>;
191
+ /**
192
+ * Get a Conversation's Members
193
+ *
194
+ * @example
195
+ * [[include:get_conversation_members.txt]]
196
+ *
197
+ * @group Chat
198
+ * @beta
199
+ * @param id - the Conversation's id
200
+ * @param order - the order to return the members in (default: 'asc')
201
+ * @param pageSize - the number of members to return per page (default: 100)
202
+ * @param cursor - the cursor to use for pagination (default: null)
203
+ * @returns a `MembersPage` containing the members
204
+ */
205
+ getConversationMembers(id: string, order?: PresentingOrder, pageSize?: number, cursor?: string | null): Promise<MembersPage>;
206
+ /**
207
+ * Create a conversation
208
+ *
209
+ * @example
210
+ * [[include:create_conversation.txt]]
211
+ *
212
+ * @group Chat
213
+ * @beta
214
+ * @param name - the name of the conversation
215
+ * @param displayName - the display name of the conversation
216
+ * @returns the `cid` of the conversation
217
+ */
218
+ createConversation(name?: string, displayName?: string): Promise<string>;
219
+ /**
220
+ * Get a Conversation
221
+ *
222
+ * @example
223
+ * [[include:get_conversation.txt]]
224
+ *
225
+ * @param id - the Conversation's id
226
+ * @returns the `Conversation`
227
+ */
228
+ getConversation(cid: string): Promise<Conversation>;
229
+ /**
230
+ * Leave a Conversation
231
+ *
232
+ * @example
233
+ * [[include:leave_conversation.txt]]
234
+ *
235
+ * @group Chat
236
+ * @beta
237
+ * @param id - the Conversation's id
238
+ * @returns void
239
+ */
240
+ leaveConversation(id: string): Promise<void>;
241
+ /**
242
+ * Join a Conversation
243
+ *
244
+ * @example
245
+ * [[include:join_conversation.txt]]
246
+ *
247
+ * @group Chat
248
+ * @beta
249
+ * @param id - the Conversation's id
250
+ * @returns the `memberId` of the member
251
+ */
252
+ joinConversation(id: string): Promise<string>;
253
+ /**
254
+ * Delete a Conversation
255
+ *
256
+ * @example
257
+ * [[include:delete_conversation.txt]]
258
+ *
259
+ * @group Chat
260
+ * @beta
261
+ * @param id - the Conversation's id
262
+ * @returns void
263
+ */
264
+ deleteConversation(id: string): Promise<void>;
265
+ /**
266
+ * Invite a user to a Conversation by user's `name`
267
+ *
268
+ * @example
269
+ * [[include:invite_to_conversation.txt]]
270
+ *
271
+ * @group Chat
272
+ * @beta
273
+ * @param id - the Conversation's id
274
+ * @param name - the namne of the user to invite
275
+ * @returns the `memberId` of the member
276
+ */
277
+ inviteToConversation(id: string, name: string): Promise<string>;
278
+ /**
279
+ * Send a text message to a Conversation
280
+ *
281
+ * @example
282
+ * [[include:send_text_message.txt]]
283
+ *
284
+ * @group Chat
285
+ * @beta
286
+ * @param id - the Conversation's id
287
+ * @param text - the Body of the message
288
+ * @returns the `timestamp` of the message
289
+ */
290
+ sendTextMessage(id: string, text: string): Promise<string>;
291
+ /**
292
+ * Send a custom message to a Conversation
293
+ *
294
+ * @example
295
+ * [[include:send_custom_message.txt]]
296
+ *
297
+ * @group Chat
298
+ * @beta
299
+ * @param id - the Conversation's id
300
+ * @param customData - the body of the message
301
+ * @returns the `timestamp` of the message
302
+ */
303
+ sendCustomMessage(id: string, customData: JSONValue): Promise<string>;
304
+ /**
305
+ * Get a Member of a Conversation
306
+ *
307
+ * @example
308
+ * [[include:get_conversation_member.txt]]
309
+ *
310
+ * @group Chat
311
+ * @beta
312
+ * @param cid - the Conversation's id
313
+ * @param mid - the Member's id
314
+ * @returns the `Member`
315
+ */
316
+ getConversationMember(cid: string, mid: string): Promise<Member>;
23
317
  }
24
318
  export default VonageClient;