# divergentav

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

Latest version **0.0.1** (published 2023-04-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install divergentav
pnpm add divergentav
yarn add divergentav
bun add divergentav
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2023-04-27 |
| First published | 2023-04-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 19 |
| Unpacked size | 121 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | ishitaa2809 |

## Links

- npm: https://www.npmjs.com/package/divergentav
- npm.io page: https://npm.io/package/divergentav

## Dependencies (19)

- [i](https://npm.io/package/i.md) ^0.3.7
- [npm](https://npm.io/package/npm.md) ^9.1.1
- [pino](https://npm.io/package/pino.md) ^8.6.1
- [uuid](https://npm.io/package/uuid.md) ^9.0.0
- [axios](https://npm.io/package/axios.md) ^1.1.3
- [react](https://npm.io/package/react.md) 18.2.0
- [ethers](https://npm.io/package/ethers.md) ^5.7.2
- [graphql](https://npm.io/package/graphql.md) ^16.6.0
- [zustand](https://npm.io/package/zustand.md) 4.0.0-rc.1
- [ed2curve](https://npm.io/package/ed2curve.md) ^0.3.0
- [socket.io](https://npm.io/package/socket.io.md) ^4.5.3
- [tweetnacl](https://npm.io/package/tweetnacl.md) ^1.0.3
- [simple-peer](https://npm.io/package/simple-peer.md) ^9.11.1
- [crypto-aes-gcm](https://npm.io/package/crypto-aes-gcm.md) ^1.1.0
- [diffie-hellman](https://npm.io/package/diffie-hellman.md) ^5.0.3
- [tweetnacl-util](https://npm.io/package/tweetnacl-util.md) ^0.15.1
- [socket.io-client](https://npm.io/package/socket.io-client.md) ^4.5.3
- [@metamask/providers](https://npm.io/package/@metamask/providers.md) ^10.2.0
- [@ethersproject/providers](https://npm.io/package/@ethersproject/providers.md) ^5.7.2

## Recent versions

- 0.0.1 (latest) — 2023-04-27

## README

# Getting started with Divergent SDK’s

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
```

<aside>
💡 For developers who just want to utilise 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 utilise the messaging features can use the package
`npm install @0xvaibhav/divergent-messenger` or `yarn add @0xvaibhav/divergent-messenger`

</aside>

### Import

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

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

### Configure

Configure your Divergent Client to use locally in the project.

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

// Ex:
const divergentClient = getDivergentClient(["http://localhost:40011"](https://www.notion.so/Setting-up-the-Node-Local-development-environment-74e8b2c12812407d98483abb9c4c3d82));
// The above example is when you setup local development environment
// Run a hosted node:
// https://huddle01.notion.site/Setting-up-the-Node-Local-development-environment-74e8b2c12812407d98483abb9c4c3d82
```

### Wrap Providers

Wrap your application with `DivergentClientProvider`

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

### Usage

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

const client = useDivergentClient();

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

### Using the `useDivergentStore` hook

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

```tsx
// EXAMPLE

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

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

## `init(”wallet”)`:

Authenticate a user with their crypto wallet

### Usage:

```tsx
import { useDivergentClient } from "divergent-client";

const client = useDivergentClient();

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

## Getting started

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

const client = useDivergentClientContext();
```

## `dial(walletAddress)`:

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

### Usage:

```tsx
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:

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

On usage of this method, a call gets connected.

## `end()`:

Terminates an ongoing call.

### Usage:

```tsx
client.end();
```

# Accessing call data

All the data of caller like caller id, caller stream can be accessed using the `useDivergentStore` hook.

### Usage:

```tsx
// The following codeblock demonstrates how to play the audio stream of the caller

import { useDivergentStore } 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" }} />;
```

All the following variables can be used in the similar way as shown above:

```tsx
caller: {
	callerUid: undefined, // Can be used to display the name of the caller
  callerSignal: "",
  callerStream: null,
  connection: null,
}
```

# 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:

```tsx
import { useDivergentStore, useDivergentClient } from "divergent-client";

const client = useDivergentClient();

// otherWalletAddress: The wallet address with who conversation
// is required to be initialized
const startConversation = (otherWalletAddress) => {
  await client.startConversation(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:

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

### Usage

```tsx
import { useDivergentStore, useDivergentClient } from "divergent-client";
const client = useDivergentClientContext();
const user = useDivergentStore((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)`:

<aside>
💡 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.

</aside>

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`

## 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:

```tsx
import { useDivergentStore } from "divergent-client";

const conversations = useDivergentStore((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:

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

# Methods for Group Chat

# `createGroup(name: string)`

The above method is used to create and initialise 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

```jsx
import { useDivergentClient } from "divergent-client";

const client = useDivergentClient();

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

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

Message payload should be of the type:

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

## Usage

```jsx
import { useDivergentStore, useDivergentClient } from "divergent-client";
const client = useDivergentClient();
const user = useDivergentStore(state => state.user);

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

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

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

</aside>

# `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

```jsx
import { useDivergentClient } from "divergent-client";

const client = useDivergentClient();

// 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

```jsx
import { useDivergentClient } from "divergent-client";

const client = useDivergentClient();

// 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.

```jsx
import { useDivergentStore  } from "divergent-client";
const groups = useDivergentStore(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

```tsx
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

```tsx
import { useDivergentStore } from "divergent-client";

const errorType = useDivergentStore((state) => state.errorType);
const errorMessage = useDivergentStore((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.

- user

  ```tsx
  user: {
      uid: "0xc111Ea84c2FBF21E45d837FF32DD3399CBfeF480",
      socket: "",
      node: "",
      avatarUrl: "",
      messages: [],
    },
    connection: null,
    peer: null,
    conversations: {},
    syncMessages: [],
    incorrectKeys: false,
  ```

  ### Usage

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

  // SIMILARLY ALL THE ABOVE MENTIONED VARIABLES CAN BE USED.
  ```

- caller

  ```tsx
  caller: {
  	callerUid: undefined,
    callerSignal: "",
    callerStream: null,
    connection: null,
  }
  ```

  ### Usage

  ```tsx
  import { useDivergentStore } from "divergent-client";

  const callerRef = useRef<any>();
  const callerStream = useDivergentStore((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.
  ```

- mic

  ```tsx
  micState: {
      mediaDevice: undefined,
      stream: undefined,
      streamError: null,
      deviceLoading: true,
   },
  ```

  ### Usage:

  ```tsx
  import { useDivergentStore } from "divergent-client";

  const stream = useDivergentStore((state) => state.micState.stream);
  ```

---
_Source: https://npm.io/package/divergentav · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._