React Native chat UI + chat core for iOS and Android, powered by the Ethora platform (REST + XMPP). Mount a <Chat /> component, point it at an Ethora app, and get a production-oriented mobile chat experience: rooms, threads, message history, media, push notifications, and pluggable auth.
Part of the Ethora SDK ecosystem — see all SDKs, tools, and sample apps. Follow cross-SDK updates in the Release Notes.
Looking for the React.js (web) version? See
@ethora/chat-component.
- Room list and room chat UI (Native / iOS + Android)
- Message history (MAM), replies, edits, deletes
- Typing indicators
- Push notifications (FCM / APNs)
- Pluggable auth (default / JWT / injected user / custom)
- Custom message bubble, input, scroll, and day-separator overrides
The package defaults to the canonical Ethora Cloud endpoints:
| Purpose | Default value |
|---|---|
| API base URL | https://api.chat.ethora.com/v1 |
| XMPP WebSocket | wss://xmpp.chat.ethora.com:5443/ws |
| XMPP host | xmpp.chat.ethora.com |
| XMPP MUC (conference) | conference.xmpp.chat.ethora.com |
| Web / sign up | https://app.chat.ethora.com |
| Swagger / API docs | https://api.chat.ethora.com/api-docs/#/ |
To target QA, point the equivalent props/env vars at chat-qa.ethora.com. To self-host, override with your own xmppSettings and baseUrl — see the example below.
# inside an existing React Native project
npm install @ethora/chat-component-rn
# or
yarn add @ethora/chat-component-rniOS only:
cd ios && pod installimport React from 'react';
import { SafeAreaView } from 'react-native';
import { Chat, XmppProvider } from '@ethora/chat-component-rn';
export default function App() {
return (
<SafeAreaView style={{ flex: 1 }}>
<XmppProvider>
<Chat
config={{
appId: 'YOUR_APP_ID',
baseUrl: 'https://api.chat.ethora.com/v1',
xmppSettings: {
devServer: 'wss://xmpp.chat.ethora.com:5443/ws',
host: 'xmpp.chat.ethora.com',
conference: 'conference.xmpp.chat.ethora.com',
},
}}
/>
</XmppProvider>
</SafeAreaView>
);
}Sign up at app.chat.ethora.com/register to get an appId (and optionally an app token / JWT for backend integrations). For a guided setup that writes config files into your project, run npx @ethora/setup.
// JWT login (recommended for production apps that already have user auth)
<Chat config={{ jwtLogin: { enabled: true, token: 'PLACEHOLDER_JWT' } }} />
// Inject an already-authenticated user
<Chat
config={{
userLogin: {
enabled: true,
user: {
_id: 'PLACEHOLDER_USER_ID',
appId: 'PLACEHOLDER_APP_ID',
firstName: 'Jane',
lastName: 'Doe',
token: 'PLACEHOLDER_ACCESS_TOKEN',
refreshToken: 'PLACEHOLDER_REFRESH_TOKEN',
xmppPassword: 'PLACEHOLDER_XMPP_PASSWORD',
username: 'PLACEHOLDER_USERNAME',
walletAddress: 'PLACEHOLDER_WALLET_ADDRESS',
defaultWallet: { walletAddress: 'PLACEHOLDER_WALLET_ADDRESS' },
},
},
}}
/><Chat
roomJID="ROOM_JID@conference.xmpp.chat.ethora.com"
config={{ setRoomJidInPath: false }}
/>This repo is bootstrapped with @react-native-community/cli. To run it as its own RN sample app rather than as a library:
git clone https://github.com/dappros/ethora-chat-component-rn.git
cd ethora-chat-component-rn
yarn install
cd ios && pod install && cd ..
yarn start # Metro
yarn ios # in another terminal
yarn android # in another terminalMake sure you have completed the React Native environment setup before proceeding.
@ethora/chat-component— React.js (web) chat SDKethora-sdk-android— Native Android SDK (Kotlin / Compose)ethora-sdk-swift— Native iOS SDK (Swift / SwiftUI)ethora-setup—npx @ethora/setupto bootstrap an Ethora app- Ethora monorepo — full ecosystem entry point
- API docs (Swagger): api.chat.ethora.com/api-docs/#/
- Forum: https://forum.ethora.com/
- Discord: https://discord.gg/Sm6bAHA3ZC
- Status: https://uptime.chat.ethora.com
AGPL. See LICENSE.