> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-rn-guide-message-privately.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Sound Manager

> Manage and customize audio cues for incoming/outgoing calls and messages in CometChat React Native UI Kit.

<Accordion title="AI Integration Quick Reference">
  | Field            | Value                                                                                            |
  | ---------------- | ------------------------------------------------------------------------------------------------ |
  | Goal             | Manage audio playback for incoming/outgoing calls and messages                                   |
  | Import           | `import { CometChatSoundManager } from "@cometchat/chat-uikit-react-native";`                    |
  | Play sound       | `CometChatSoundManager.play("incomingMessage")`                                                  |
  | Custom sound     | `CometChatSoundManager.play("outgoingMessage", "path/to/sound.mp3")`                             |
  | Pause sound      | `CometChatSoundManager.pause()`                                                                  |
  | Sound events     | `incomingMessage`, `incomingMessageFromOther`, `outgoingMessage`, `incomingCall`, `outgoingCall` |
  | Default behavior | Plays built-in sounds; pass custom path as second arg to override                                |
</Accordion>

`CometChatSoundManager` is a helper class for managing and playing audio cues in the UI Kit — incoming/outgoing calls and messages.

***

## Sound Events

| Event Key                  | When It Plays                                      |
| -------------------------- | -------------------------------------------------- |
| `incomingMessage`          | New message received from current conversation     |
| `incomingMessageFromOther` | New message received from a different conversation |
| `outgoingMessage`          | Message sent                                       |
| `incomingCall`             | Incoming call detected (loops)                     |
| `outgoingCall`             | Outgoing call initiated (loops)                    |

***

## Methods

### play

Plays the default or custom audio resource for a given sound event.

| Parameter     | Type      | Description                                                                                   |
| ------------- | --------- | --------------------------------------------------------------------------------------------- |
| `sound`       | `string`  | Sound event key: `"incomingMessage"`, `"outgoingMessage"`, `"incomingCall"`, `"outgoingCall"` |
| `customSound` | `string`  | Optional custom audio file path. Defaults to built-in sound.                                  |
| `isRequire`   | `boolean` | Optional. Set to `true` if using `require()` for local assets.                                |

```ts theme={null}
import { CometChatSoundManager } from "@cometchat/chat-uikit-react-native";

// Play default sound
CometChatSoundManager.play("incomingMessage");

// Play custom sound
CometChatSoundManager.play("outgoingMessage", "path/to/custom-sound.mp3");
```

### pause

Pauses the currently playing sound and resets playback position.

```ts theme={null}
CometChatSoundManager.pause();
```

***

## Usage

Here is how to use `CometChatSoundManager`:

```javascript theme={null}
// Play sound with default sound:
CometChatSoundManager.play("incomingMessage"); // To play default incoming message sound
CometChatSoundManager.play("outgoingMessage"); // To play default outgoing message sound

// Play sound with custom sound
CometChatSoundManager.play("outgoingMessage", "assetPath"); // To play custom message sound

// Pause Sound:
CometChatSoundManager.pause();
```

By using the `CometChatSoundManager`, you can enhance the user experience in your chat application by integrating audible cues for chat interactions.

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Localize" icon="globe" href="/ui-kit/react-native/localize">
    Add multi-language support with automatic device language detection
  </Card>

  <Card title="Introduction to Theming" icon="paintbrush" href="/ui-kit/react-native/theme">
    Learn how CometChatThemeProvider manages light and dark modes
  </Card>

  <Card title="Components Overview" icon="grid-2" href="/ui-kit/react-native/components-overview">
    Explore all available UI Kit components
  </Card>

  <Card title="Getting Started" icon="rocket" href="/ui-kit/react-native/react-native-cli-integration">
    Set up CometChat UI Kit in your React Native app
  </Card>
</CardGroup>
