avc-sdk-react
TypeScript icon, indicating that this package has built-in type declarations

1.0.17 • Public • Published

avc-sdk-react

Before install

Before using this library, you must publish it into your package registry, for example into gitlab or jfrog.

Then update ~/.npmrc file, to be able to install it later:

@nites:registry=https://gitlab.com/api/v4/packages/npm/
//gitlab.com/api/v4/packages/npm/:_authToken=<token>

Build library

In order to build a library, run the following commands:

yarn build

It will produce a dist folder with all components and primitives.

To publish the library, run the command:

yarn publish

Documentation for connecting calls from livekit/components-react

Local development

For faster local development, you can use yalc package to link this library with another local project.

API

SDK can be used in two ways:

  • use hooks to create custom UI

Using hooks to build custom UI:

import { useState } from 'react';
import { useVideoChat } from 'avc-sdk-react';

function CustomVideoChat() {
  const chatId = '...'; // Id of the chat to enter
  const token = '...'; // JWT token of the user
  const url = 'https://...'; // HTTPS url to video-chat app backend
  const acceptCalls = true; // Enable video/audio calls
  const authParams = { // Authorization parameters
        langCode: 'en',
        firebaseToken: 'test',
        deviceType: 2
  }

  const [ text, setText ] = useState('');
  const vc = useVideoChat({
    chatId,
    token,
    url,
    acceptCalls,
    authParams
  });

  return (
    <div>
      {vc.chat.title}

      <div>
        {vc.messages.map(message => (
          <p key={message.id}>{messate.text}</p>
        ))}
      </div>

      <input onInput={e => setText(e.target.value)}/>
      <button onClick={() => vc.sendMessage(text)}>
        Send Message
      </button>
    </div>
  );
}

Hook Parameters

The useVideoChat hook accepts the following input parameters:

  • url (string): The URL for the socket connection.

  • token (string): The authentication token for the socket connection.

  • chatId (string): The unique identifier for the chat or conversation you want to associate with the video chat functionality.

  • acceptCalls (boolean, optional, default: true): A flag to indicate whether the application should accept incoming calls. If set to false, the hook will not subscribe to call-related events.

  • authParams (Object): Authorization parameters.

Hook Returned Fields

The useVideoChat hook returns an object with the following fields and functions:

  • socket (object): Socket object

  • online (boolean): Indicates whether the user is currently online.

  • user (object): Information about the connected user.

  • currentChat (object): Information about the current chat, including its id, title, and a list of users.

  • chatsList (array): An array of user chats.

  • chat (array): Сhat received from getChat.

  • createdChat (object): Сhat received from createChat.

  • modifiedChat (object): Сhat received from modifyChat.

  • messages (array): An array of messages in the current chat. Each message includes details like chatId, text, and attachments.

  • currentUserId (string): The ID of the current user.

  • room (object): Information about the call room, including its chatId and userId.

  • calling (boolean): Indicates whether a call is currently in progress.

  • activeCall (object): Details about the active call, including its chatId and userId.

  • incomingCall (object): Details about an incoming call, including its chatId and userId.

  • chatVisible (boolean): Indicates whether the chat interface is currently visible.

  • error (object): An error message with a title and message. This can be used to display global errors in the UI.

  • filesDownloadProgress (object): A dictionary that tracks the download progress of files in the chat.

  • toggleChat (function): A function to toggle the chat interface's visibility.

  • startCall (function): Initiates a call with the specified chatId and an optional video flag to indicate video calling.

  • acceptCall (function): It accepts chatId, Accepts an incoming call.

  • declineCall (function): It accepts chatId, Declines an incoming call.

  • sendNotification (function): Sends a notification to a specific user.

  • sendMessage (function): Sends a message to the chat. It accepts text and an optional file for attachments and an optional type.

  • loadMessages (function): Loads messages in the chat, with an optional beforeId and a messageСontain for message retrieval.

  • getMessages async (function): Loads messages by the chatId, with an optional beforeId, limit and a messageСontain. Returns the requested messages

interface GetMessagesOptions {
  chatId: string;
  limit?: number;
  beforeId?: string;
  messageСontain?: string;
}

const getMessages: (options: GetMessagesOptions) => Promise<Message[]>
  • getChats async (function): Load all available chats for current user, with an optional title, contactPermission, usersType, connectionType, chatType, limit, skip. Returns the requested chats.
interface GetChats {
  skip?: number;
  limit?: number;
  title?: string;
  contactPermission?: boolean;
  usersType?: number;
  connectionType?: number;
  chatType?: number;
}

const getChats: (options?: GetChats) => Promise<Chat[]>
  • downloadFile (function): Downloads a file with the specified id and name. This function checks if the file is available and ready for download.

  • leaveCall (function): Leaves an ongoing call.

  • createChat (function): Create a new chat.

  • modifyChat (function): Modify a chat.

  • getChat (function): Load chat by chatId.

Readme

Keywords

none

Package Sidebar

Install

npm i avc-sdk-react

Weekly Downloads

3

Version

1.0.17

License

UNLICENSED

Unpacked Size

124 kB

Total Files

149

Last publish

Collaborators

  • deeops