> ## Documentation Index
> Fetch the complete documentation index at: https://docs.quickblox.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Contact List

> Learn how to create, update, manage, and add users to your contact list.

The Contact List API is rather straightforward. User A sends a request to become "friends" with user B. User B accepts the friend request. And now user A and B appear in each other's roster.

Visit [Key Concepts](/docs/key-concepts) page to learn the most important QuickBlox concepts.

## Before you begin

1. Register a [QuickBlox account](https://admin.quickblox.com/signin). This is a matter of a few minutes and you will be able to use this account to build your apps.
2. Configure QuickBlox SDK for your app. Check out [Setup](/sdks/js-setup) page for more details.
3. Create a user session to be able to use QuickBlox functionality. See [Authentication](/sdks/js-authentication) page to learn how to do it.
4. Connect to the Chat server. See [Connection](/sdks/js-chat-connection) page to learn how to do it.

## Access contact list

You can access the contact list on your login to chat. The contact list object will be returned in callback. Also, the following function gives you an access to contact list.

```JavaScript JavaScript theme={null}
try {
  QB.chat.roster.get(function(contactlist) {

  });
} catch (e) {
  if (e.name === 'ChatNotConnectedError') {
    // not connected to chat
  }
}
```

## Add user to your contact list

To add a user to the contact list, use the `add()` method.

```JavaScript JavaScript theme={null}
var userId = 34;
try {
  QB.chat.roster.add(userId, function() {

  });
} catch (e) {
  if (e.name === 'ChatNotConnectedError') {
    // not connected to chat
  }
}
```

<Note>
  Maximum number of contacts is 300.
</Note>

Another user will receive a request to be added to the contact list. The `onSubscribeListener` callback will be called.

```JavaScript JavaScript theme={null}
QB.chat.onSubscribeListener = function(userId) {

};
```

## Confirm the contact request

To confirm the request, use the `confirm()` method.

```JavaScript JavaScript theme={null}
try {
  QB.chat.roster.confirm(userId, function() {

  });
} catch (e) {
  if (e.name === 'ChatNotConnectedError') {
    // not connected to chat
  }
}
```

A user will be informed that you have accepted the contact request by the `onConfirmSubscribeListener` callback.

```JavaScript JavaScript theme={null}
QB.chat.onConfirmSubscribeListener = function(userId) {

};
```

## Reject the contact request

To reject the request, use the `reject()` method.

```JavaScript JavaScript theme={null}
try {
  QB.chat.roster.reject(userId, function() {

  });
} catch (e) {
  if (e.name === 'ChatNotConnectedError') {
    // not connected to chat
  }
}
```

A user will be informed that you have declined the contact request by `onRejectSubscribeListener` callback.

```JavaScript JavaScript theme={null}
QB.chat.onRejectSubscribeListener = function(userId) {

};
```

## Remove user from the contact list

To remove a previously added user from the contact list, use the following method.

```JavaScript JavaScript theme={null}
try {
  QB.chat.roster.remove(userId, function() {

  });
} catch (e) {
  if (e.name === 'ChatNotConnectedError') {
    // not connected to chat
  }
}
```

## Contact list updates

You can also track contact list updates in real-time by using the code snippet below.

```JavaScript JavaScript theme={null}
QB.chat.onContactListListener = function(userId, type) {
  // type - if a user left the chat, type will be 'unavailable'.
  // Otherwise - 'available'.
};
```