Skip to main content


Enhance State Management: Boost Your Component's Functionality by Wrapping it with ChatUIProvider.

You can seamlessly integrate your main root file with the ChatUIProvider, allowing you to effortlessly incorporate any component throughout your entire application. This simplifies the process of using components independently across the app, eliminating the need to manage common inputs such as account information and PGP private keys, among others.


import { ChatUIProvider } from "@pushprotocol/uiweb";
import { darkChatTheme } from "@pushprotocol/uiweb";

export function App({ Component }) {
return (
<ChatUIProvider theme={darkChatTheme}>
<Component />

Customization parameters

Customize the parameters as per your need and the chat component being used.

accountstring-Supports wallet address or chain agnostic wallet address format
pgpPrivatekeystring-Decrypted pgp private key of the user
themeIChatTheme-Theme object, it can be custom theme object, lightChatTheme darkChatTheme
envEnv-API env - 'prod' or 'staging'
signerSignerType-Ethers or Viem Signer

Note: Parameters in this style are mandatory.