A React group chat with channels, 1:1 and group chats, reactions, and image sharing. It is the chat app that the Moderation Dashboard demo moderates. Built with the deprecated PubNub React Chat Components.
This group chat is the companion app for the Moderation Dashboard demo. Both use the same sample keyset. When you open the chat, you join as a random sample user. You can send messages, react, share images, and report other users. In the Moderation Dashboard you then see the reports and can mute, block, or ban users, and this app enforces it.
The app is built with React and the PubNub React Chat Components. Messages, files, reactions, typing indicators, Presence, and App Context all come from PubNub. The sample keyset is public, so you may see messages from other visitors.
PubNub React Chat Components are deprecated, and the repository is archived. To build a new chat app, use the Chat SDK. If you already use Chat Components, follow the migration guide.
Join public channels from the list, or start a 1:1 or group chat with other sample users. Leave any of them again. Channels and memberships are stored in App Context.
Send a message and it shows up for everyone in the channel. When you open a channel, the last 25 messages load from Message Persistence.
Pick an emoji for your message, or react to any message. Reactions are stored as message actions on the message.
Attach an image to a message. It is uploaded with File Sharing and shown in the channel.
Open the members panel to see who is in the channel and who is online with Presence. A typing indicator shows when someone is writing.
Report a message’s author with a reason. The report is saved on the user in App Context for the Moderation Dashboard. Muted users can’t post, and blocked or banned users lose access.
The source of this app is open, but React Chat Components are deprecated and the repository is archived. For a new chat app, start with the Chat SDK.
GitHub
The app is in samples/react/group-chat. Add your keys to samples/.env, run yarn and yarn run setup to add sample users and channels, then yarn run start.
git clone https://github.com/pubnub/react-chat-components.gitModerate a chat app from one dashboard. Filter text and images before they are published, review messages, and flag or ban users. Open source, built with React and the PubNub JavaScript SDK.
Log in as a support agent or as a customer and see how support chat, bot-to-agent handoff, and case management work in real time. Built with React and the PubNub Chat SDK.
Create a stream as the host, open the viewer link, and chat with your audience next to the video. Viewers can report messages and users to the host. Built with Next.js and the PubNub Chat SDK.
Bring chat, live updates, and real-time interactions into your application without building the infrastructure from scratch.
