npm package: @0xvaibhav/divergent-messenger
Description: The Divergent Network provides developers with three different Software Development Kits (SDKs) to interact with the network. These SDKs are:
Latest version: 0.0.2

The Divergent Network provides developers with three different Software Development Kits (SDKs) to interact with the network. These SDKs are:

1. `divergent-client`: This SDK is intended for developers who want to integrate both calling and messaging functionality in their decentralized application (dApp). It provides access to the full suite of features offered by the Divergent Network.
2. `divergent-av`: This SDK is specifically designed for developers who want to incorporate decentralized calling capabilities into their dApp. It allows developers to add peer-to-peer audio and video calls to their dApp.
3. `divergent-messenger`: This SDK is intended for developers who want to integrate decentralized messaging or chat functionality in their dApp. It provides access to the messaging features of the Divergent Network.

These SDKs allow developers to build applications that take advantage of the secure, open and decentralized nature of the Divergent Network, without having to build the underlying infrastructure from scratch. The SDKs include various functionalities and features such as key management, encryption, and identity management. They also provide the ability to interact with the network, allowing developers to make and receive calls, send and receive messages, and more.

### Quick Start

Install the `divergent-client` pkg from npm or yarn inside your React or Next App.

```bash
// NPM
npm install @0xvaibhav/divergent-client

// YARN
yarn add @0xvaibhav/divergent-client
```

> 💡 For developers who just want to utilize the audio and video features can use the package  
> `npm install @0xvaibhav/divergent-av` or `yarn add @0xvaibhav/divergent-av`
>
> For developers who just want to utilize the messaging features can use the package  
> `npm install @0xvaibhav/divergent-messenger` or `yarn add @0xvaibhav/divergent-messenger`

### Import

Import `DivergentClientProvider` and `getDivergentClient` from the install pkg to your application entry point.

```typescript
import { DivergentClientProvider, getDivergentClient } from "divergent-client";
```

### Configure

Configure your Divergent Client to use locally in the project.

```typescript
const divergentClient = getDivergentClient(rpcEndpoint);

// Ex:
const divergentClient = getDivergentClient("http://localhost:40011");
// The above example is when you setup local development environment.
```

### Wrap Providers

Wrap your application with `DivergentClientProvider`

```typescript
const App = () => {
  return (
    <DivergentClientProvider value={divergentClient}>
      <YourApp />
    </DivergentClientProvider>
  );
};
```

### Usage

```typescript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

// Ready to access methods
await client.init("wallet");
```

### Using the `useRootStore` hook

To access all the information from the client and listen to any changes in the state, we can use the useRootStore hook.

```typescript
// EXAMPLE

import { useRootStore } from "divergent-client";
const user = useRootStore((state) => state.user);

<h1> Logged in User: {user.uid} </h1>;
```

## `init(”wallet”)`:

Authenticate a user with their crypto wallet

### Usage:

```typescript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

const login = async () => {
  await client.init("wallet");
};
```

The above method requests for a sign from user’s crypto wallet and authenticates them using JWT.

# Methods for Wallet to Wallet Calls

# For Calls

## `dial(walletAddress)`:

The above method initiates a call to the given wallet address.

### Usage:

```typescript
await client.dial("0xc111Ea84c2FBF21E45d837FF32DD3399CBfeF480");
```

On usage of this method, a request to establish a call with the given wallet address is created.

## `answer()`:

The above method create a connection with a peer requesting to be connected.

### Usage:

```typescript
await client.answer();
```

On usage of this method, a call gets connected.

## `end()`:

Terminates an ongoing call.

### Usage:

```typescript
client.end();
```

# For Messaging

# Methods for Wallet to Wallet messaging

Messages sent and received using the `divergent-client` are end-to-end encrypted. The Divergent Protocol makes use of a set of Ed25519 based public and private keys to send and receive encrypted messages.

## `startConversation(selfWalletAddress, otherWalletAddress)`:

The above method creates an inbox for given 2 addresses. The first argument to be the wallet address which is currently logged in and second argument of the other peer.

Note: This method only works if both the peers have logged into the network atleast once. Else, this method will throw an `error`.

### Usage:

```typescript
import { useRootStore, useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();
const user = useRootStore((state) => state.user);

const startConversation = (otherWalletAddress) => {
  await client.startConversation(user.uid, otherWalletAddress);
};
```

## `sendMessageAsync(payload, type: "conversation" | "group")`:

Note: Before using this method, it is mandatory to use the `startConversation(selfWalletAddress, otherWalletAddress)` method. Without this, messages can neither be sent nor received.

Message payload should be of the type:

```typescript
	{
		to: “0xc111Ea84c2FBF21E45d837FF32DD3399CBfeF480”,
		from: “0x171371a0fe069daa9e4cccdf2a9a3040242c8fa6”,
		message: “Hello”,
		timestamp: Date.now().toString()
	}
```

### Usage

```typescript
import { useRootStore, useDivergentClientContext } from "divergent-client";
const client = useDivergentClientContext();
const user = useRootStore((state) => state.user);

const sendMessage = async (to, message) => {
  const payload = {
    to: to,
    from: user.uid,
    message: message,
    timestamp: Date.now().toString()
  };
  await client.sendMessageAsync(payload, "conversation");
};
```

## `sendMessageSync(payload)`:

This method only works once a connection has been established using the `dial` and `answer` methods. Messages sent using this method are not persisted and as lost as soon as the connection has been terminated. The payload schema for this method is same as the payload schema for `sendMessageAsync`

> 💡 Note: In order to send and receive messages using the `sendMessageSync` method, it is mandatory to establish a WebRTC connection between two peers using the `dial` and `answer` method.

## Listening to messages:

### 1. Async Messages

The messages sent using `sendMessageAsync` can be listened and display on the client side using the `conversations` variable through the client.

### Usage:

```typescript
import { useRootStore } from "divergent-client";

const conversations = useRootStore((state) => state.conversations);
```

All the changes which happen real-time are automatically updated into this variable.

### 2. Sync Messages

The messages which are sent using the `sendMessageSync` method can be listened and displayed using the syncMessages variable.

### Usage:

```typescript
import { useRootStore } from "divergent-client";
const syncMessages = useRootStore((state) => state.syncMessages);
```

# Methods for Group Chat

# `createGroup(name: string)`

The above method is used to create and initialize a group with a certain name. Apart from the custom name, the group is also assigned a id by default which will be used as the `to` field in the message type to send a message.

## Usage

```javascript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

// Inside your component
<button onClick={async () => await client.createGroup("groupName")}>
  Create Group
</button>;
```

# `sendMessageAsync(payload, type: "conversation" | "group")`

Note: Before using this method, it is mandatory to use the `startConversation(selfWalletAddress, otherWalletAddress)` method. Without this, messages can neither be sent nor received.

Message payload should be of the type:

```typescript
	{
		to: groupId,
		from: “0x171371a0fe069daa9e4cccdf2a9a3040242c8fa6”,
		message: “Hello”,
		timestamp: Date.now().toString()
	}
```

## Usage

```javascript
	import { useRootStore, useDivergentClientContext } from "divergent-client";
	const client = useDivergentClientContext();
	const user = useRootStore(state => state.user);

	const sendMessage = async(groupId, message) => {
		const payload = {
			to: groupId,
			from: user.uid,
			message: message,
			timestamp: Date.now().toString()
		}
		await client.sendMessageAsync(payload, "conversation");
	}

	// Example
	<button onClick={() => sendMessage(Object.keys(groups)[0], groupMessage, "group")}>
```

> 💡 The group id can be accessed using `useRootStore` hook  
> `const groups = useRootStore(state => state.groups)`  
> `console.log(Object.keys(groups))`

# `addGroupParticipant(groupId: string, walletAddress: string)`

Adds a user with that wallet address to a group providing that the user has used the network atleast once.

## Usage

```javascript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

// Inside your component
<button
  onClick={async () =>
    await client.addGrouParticipant("groupId", "0xWalletAddress")
  }
>
  Create Group
</button>;
```

# `removeGroupParticipant(groupId: string, walletAddress: string)`

Removes a participant from a group. Only the creator of the group can call this function as of now.

## Usage

```javascript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

// Inside your component
<button
  onClick={() => client.removeGrouParticipant("groupId", "0xWalletAddress")}
>
  Create Group
</button>;
```

# Accessing group messages

The group messages can be accessed and displayed using the `useRootStore` hook.

```javascript
	import { useRootStore  } from "divergent-client";
	const groups = useRootStore(state => state.groups)

	// Render
	<div>
		{JSON.stringify(groups)}
	</div>
```

# Error Handling

There are predefined error types when using Divergent-Client. Developers can choose to act upon the type of error.

## Error Types

```typescript
	const IErrorType =
	  | "userNotFound"
	  | "conversationNotFound"
	  | "sendError"
	  | "deleteError"
	  | "callError"
	  | "noLens"
```

    1. userNotFound: Thrown when a user has not been registered on the Divergent Network yet.
    2. conversationNotFound: Error thrown when user tries to send a message without starting a conversation (`startConversation`) i.e when inbox has not be initialized.
    3. sendError: Thrown when an error occurs during sending a message.
    4. callError: Thrown when any error occurs during initializing, end or on-going call.
    5. noLens: Thrown when user is not found on Lens Protocol.

## Listening for Error

    Errors can be listened by listening to the `errorType` variable from the `useRootStore` hook.

### Usage

```typescript
import { useRootStore } from "divergent-client";

const errorType = useRootStore((state) => state.errorType);
const errorMessage = useRootStore((state) => state.errorMessage);

// Example
{
  errorType == "conversationNotFound" ? <h2> {errorMessage} </h2> : null;
}
```

# States

The divergent-client uses Zustand based state management. All the state variables can be accessed by importing `useRootStore` from the divergent-client package.

<details>
	  <summary>user</summary>
	
	
```typescript
	user: {
	    uid: "0xc111Ea84c2FBF21E45d837FF32DD3399CBfeF480",
	    socket: "",
	    node: "",
	    avatarUrl: "",
	    messages: [],
	  },
	  connection: null,
	  peer: null,
	  conversations: {},
	  syncMessages: [],
	  incorrectKeys: false,
```
	
	
### Usage
	
	
```typescript
	import { useRootStore } from "divergent-client"
	const user = useRootStore(state => state.user);
	
	// SIMILARLY ALL THE ABOVE MENTIONED VARIABLES CAN BE USED.
```
	
	
	
</details>

<details>
  <summary>caller</summary>
	
	
```typescript
	caller: {
		callerUid: undefined,
	  callerSignal: "",
	  callerStream: null,
	  connection: null,
	}
```
	
	
### Usage
	
	
```typescript
	import { useRootStore } from "divergent-client"
	
	const callerRef = useRef<any>();
	const callerStream = useRootStore(state => state.callerStream);
	
	useEffect(() => {
	    if(callerStream) callerRef.current.srcObject = callerStream;
	  }, [callerStream]);
	
	<video playsInline ref={callerStream} autoPlay style={{ width: "300px" }} />
	
	// SIMILARLY ALL THE ABOVE MENTIONED VARIABLES CAN BE USED.
```
	
	
	
  </details>

<details>
	  <summary>mic</summary>
	
	
```typescript
	micState: {
	    mediaDevice: undefined,
	    stream: undefined,
	    streamError: null,
	    deviceLoading: true,
	 },
```
	
	
### Usage:
	
	
```typescript
	import { useRootStore } from "divergent-client"
	
	const stream = useRootStore(state => state.micState.stream);
```
	
	
	
 </details>

# Key Management

## `revealKeys()`:

This method is used to export the public and private keys of the currently logged in user. It is highly recommended that developers provide an option to export the keys of the users using this method in their respective apps.

### Usage:

```typescript
import { useDivergentClientContext } from "divergent-client";

const client = useDivergentClientContext();

const getKeys = async () => {
  const keys = await client.revealKeys();
  console.log(keys);
};
```

# Support for Lens Protocol

All the features of Project Divergent are made available to the Lens Protocol users. Which means that you can send E2EE messages, make calls to profiles present the Lens Social Graph!

All of the methods for the divergent-client remain the same except the `init` method which would now take the argument of `“lens”` instead of `“wallet”`

### Usage

```typescript
import { useDivergentClientContext } from "divergent-client";
const client = useDivergentClientContext();

const login = async () => {
  await client.init("lens");
};
```