Keeping track of the delivery status for outgoing WhatsApp messages is crucial for effective communication and customer engagement. Rocket.Chat WhatsApp apps provide a convenient way to receive real-time updates on the status of your messages. To start receiving these updates, go to the WhatsApp app and follow these steps: Navigate to the Settings tab and set the Message Status Endpoint URL . Enable Allow Quote Messages settings. Click Save Changes. The app sends a request with the status payload to the specified URL each time your message's status changes, such as when it is sent, delivered, or read. Always confirm that the " Allow Quote Messages " setting is enabled to receive the full information payload. The table below highlights the payload format you will receive on the endpoint for status update: Field Name Type Description msId string or undefined The message Id. mobileNo string The recipient’s WhatsApp phone

The Rocket.Chat server, powered by Node.js, MongoDB, and Meteor, ensures you enjoy a seamless, scalable, and secure experience. Deploying a server is the first step towards setting up the development environment. Rocket.Chat clients communicate with the server in real-time using APIs and WebSockets . Data is stored in MongoDB, a NoSQL database, and files can be stored locally on the server or on a network service like Amazon S3. For a deeper understanding of how these components work together, see architecture and components . Deploy Rocket.Chat server Rocket.Chat offers various deployment methods, including Docker and Kubernetes. For testing and production purposes, the deployment document provides a comprehensive overview of the deployment process, covering prerequisites, installation steps, and configuration options. For development and customization purposes, use this section to: Explore Rocket.Chat server further by checking out the server source code on GitHub , along with the repository

Rocket.Chat enhances team collaboration and communication by providing versatile open-source usage options: desktop applications for physical locations, mobile apps for on-the-go access, and a robust server solution. This section introduces the three options of Rocket.Chat and guides on getting started with each. Server application This is the core of Rocket.Chat. With the server, you can: Deploy Rocket.Chat server application on-premise or on the cloud Set up a development environment on Gitpod, Linux, etc., to contribute to Rocket.Chat Customize the server application to suit your brand needs Visit the server documentation for in-depth information on carrying out these processes. Desktop application Rocket.Chat’s desktop application is a multiplatform solution that works on platforms like Windows and macOS. Check out the desktop application documentation for details on how to: Develop a Rocket.Chat desktop application. Use the Desktop white-labeling to

When you white-label the mobile app, the default push notification gateway is unavailable. To enable push notifications for your custom app build, follow this guide to configure them manually. This ensures that your workspace users on mobile devices continue to receive push notifications. Configuring gateway Navigate to Administration > Workspace > Settings > Push on your workspace. Disable Gateway . Disable Production if you’re trying in debug mode. Configuring Android Generating FCM service account Navigate to the Cloud Messaging tab on the Firebase project. Under Firebase Cloud Messaging API , tap on Manage Service Accounts to be redirected to Google Cloud Console. Go to Create Service Account , fill name and ID and click Create and Continue On Grant this service account access to project , filter for a role called Firebase Cloud Messaging API Admin Click Done and navigate to the Service Account you just created Go to Keys > Add Key Service account > Keys

After learning how to create and deploy a basic app, you can now extend the app to add more features such as slash commands, HTTP requests, handling events, and UI interactions supported by the Apps-Engine to expand the functionality of your app to meet business requirements. The IConfigurationExtend accessor contains methods to declare your app's configuration. It is created during app initialization. Using this, you can add new features to your app. Here is a list of accessors that Apps-Engine supports: Accessor Description api Declare API endpoints. http Configure how your app handles HTTP requests and responses. scheduler Designate tasks that can be scheduled. settings Declare the configurations of your app. slashCommands Declare the commands that your app offers. ui Register various host UI elements. videoConfProviders Declare the video conferencing providers that your app offers. In the following sections, we will learn how to implement these accessors

The Scheduler API allows apps to create tasks that run in a defined schedule . These tasks can be one-time events or recurring tasks.  It uses agenda.js as the backend, so the schedule syntax and internal processes are all according to its documentation. The API details are in the  Module scheduler  definition and this  example app  can also be used as a guide. Check the app logs to see the example in action . Add permissions As per the permission system , the Schedule API needs the following permission in your app's manifest ( app.json file): { "permissions": [ { "name": "scheduler" } ] } Register jobs (processors) To use the Scheduler API you'll need two things: The functions to be run as jobs (we call them processors ). The schedule in which they run. This is configured using the app's extendConfiguration method. The processors are registered during the app's startup to make them

This document provides solutions to some common Rocket.Chat development problems, but remember, each issue is unique, and sometimes, you may need to dig deeper to find the root cause. General troubleshooting Resolving the missing babel-runtime npm package If you encounter an error stating: (STDERR) Error: The babel-runtime npm package could not be found in your node_modules (STDERR) directory. Please run the following command to install it: (STDERR) (STDERR) meteor npm install --save babel-runtime (STDERR) (...) => Exited with code: 1 => Your application is crashing. Waiting for file change. You can resolve this by installing the mentioned package with the command: meteor npm install --save babel-runtime Resolving the slower JavaScript implementation of bcrypt If you see the following warning in the meteor logs: (STDERR) Note: you are using a pure-JavaScript implementation of bcrypt. (STDERR) While this implementation will work correctly, it is known to be (STDERR

Rocket.Chat’s Omnichannel feature is designed to provide a seamless multi-channel communication environment between companies and their customers. It integrates various communication platforms , such as SMS , Facebook , or Telegram, into a single workspace, improving the customer service experience. A typical use case of omnichannel is a healthcare provider using Rocket.Chat omnichannel feature to handle appointment requests and patient inquiries through SMS, phone calls, and online chat, providing a unified and efficient scheduling system. This documentation section will show you how to set up your Livechat development environment and manage WhatsApp messages.

Blocks are the components you will use to create the UI layout in surfaces. Within some of these blocks, you can add block elements and objects. The available blocks are: section divider image actions context input preview We will now look at the JSON payload and more details to define each of these blocks in your apps. section A section is used to display text and can contain additional block elements. Supported surfaces : Messages, contextual bars, modals Field Type Required? Description blockId String No A unique identifier for the block. type String Yes The type of the block, in this case, the value is section . text Object{} No An array of text elements that should contain the following: type : The type in which you want to enter the text. It can either be plain_text or mrkdown . text : The text that you want to enter. emoji : A boolean that indicates

this.appLogger = this.getLogger() } } We have just stored the accessor for the log file in the appLogger variable. Now, we can record anything with it. Add the line shown below to the constructor and save the file. this.appLogger.debug('Hello, World!') Step 5: Deploy to the server In the command line, go to the hello-world app folder that was created in Step 1: Execute the create command . To deploy the app, run: rc-apps deploy --url -u -p Replace with the URL of your Rocket.Chat workspace. Replace and with your username and password, respectively. After executing this command, your application will be deployed to the server. To explore alternative authentication options for deploying your app, such as using 2FA codes or personal access tokens, run the   rc-apps deploy --help  command. Packaging your app Alternatively, you can execute the rc-apps package command. This gives you a

Explore the Rocket.Chat server architecture to understand the platform’s structure. Whether you're a developer or just curious, this document offers a clear look into Rocket.Chat’s scalable designs and component interactions that shape the server’s robustness and versatility. See architecture and components for a holistic view of Rocket.Chat's architecture and components. The overview is as follows: Core server : This component contains packages essential for user authentication, messaging, and other core functionalities of the Rocket.Chat server. Database : Rocket.Chat uses MongoDB to store its data, such as chat messages, user information, and system configurations. File storage : Additionally, the server employs a file storage system for storing assets, user files, images, and various media files. Services The Rocket.Chat server architecture consists of internal and external services. Internal services operate within the meteor instance, closely integrated with the main process. On the other hand

This example will show how to manage the persistence of message-related data using Rocket.Chat Apps-Engine. Doing this involves creating a class MessagePersistence in the Apps root folder that interacts with Rocket.Chat persistence layer. This class will host static methods to add, remove, and query data associated with messages, rooms, and specific IDs. import { IPersistence, IPersistenceRead } from '@rocket.chat/apps-engine/definition/accessors'; import { RocketChatAssociationModel, RocketChatAssociationRecord } from '@rocket.chat/apps-engine/definition/metadata'; import { IRoom } from '@rocket.chat/apps-engine/definition/rooms'; export class MessagePersistence { // add records public static async persist(persis: IPersistence, room: IRoom, id: string): Promise { const associations: Array = [ new RocketChatAssociationRecord(RocketChatAssociationModel.MISC, 'message'), new RocketChatAssociationRecord(RocketChatAssociationModel.ROOM, room.id), new RocketChatAssociationRecord(RocketChatAssociationModel.MISC, id), ]; try { await persis.updateByAssociations(associations, { id }, true); } catch (err) { console.warn(err); return false; } return true; } // query all records within the "scope" - message public static async findAll(persis: IPersistenceRead): Promise

With the Apps-Engine UIKit, we have seen how to create the interactions in our apps displayed on the Rocket.Chat UI. Follow these guidelines for any interface that you are creating for your Rocket.Chat app using the Apps-Engine. Surface types There are two surface types: Simple : Examples like menus that can contain only the predefined list of menu items Complex : Examples like contextual bars and modal views can use all available UIKit components to build the intended user experience. User menu The user menu contains items specific to the user such as status and preferences. Every item on this menu should relate to a user. Do add only user-specific items to this menu User menu visual guide Room kebab menu The room kebab menu is located at the top-right side of any Rocket.Chat room . This menu opens up a contextual bar and not a

like this: // ...import files... import { settings} from './config/Settings'; // import the settings file that we created export class SampleApp extends App { constructor(info: IAppInfo, logger: ILogger, accessors: IAppAccessors) { super(info, logger, accessors); } public async extendConfiguration(configuration: IConfigurationExtend, environmentRead: IEnvironmentRead): Promise { await Promise.all( settings.map((setting) => configuration.settings.provideSetting(setting) ) ); } } Now deploy the app and access it on your workspace. Go to the App Info page and select the Settings tab. You will find the settings that we defined. Additionally, check the logs after updating any settings and saving the changes. Each time a setting is updated, you will find the  onSettingUpdated  and  onPreSettingUpdate  methods in the logs . By default, the logs show the debug method for an instance. We can also use the onSettingUpdated and onPreSettingUpdate methods in our app to modify the logs as necessary. After the main class, add the method as follows: public async onSettingUpdated(setting

internal testing. Provide links to other informative articles and frequently asked questions where necessary. To enhance user experience, be sure to include explicit instructions on how to utilize the app's features. This can be further clarified through the use of visual aids such as images or videos. Lastly, convey the value of the app and specify the purposes for which user data will and will not be utilized. You can follow the structure suggested in the table below. Feel free to tweak the structure based on how it relates to your app. Section Description About the app Give a brief introduction to your app. Summarize what it offers in about 50-70 characters. How does the app work Provide details about what the app does, and how it does it in simple words. Pricing model / compatible versions State the pricing model of your app, if applicable. Mention the versions

the file and redeploy the app by running the following command: rc-apps deploy --url <server_url> -u <user> -p <pwd> --update All that's left is for you to test it! Go to the channel in Rocket.Chat where you want to test your app by typing /phone text and /phone call in the message composer. Press Enter and you can see the output as Texting! or Calling! in the channel. Similarly, you can register and define multiple slash commands tailored to your organization's requirements. Head over to the next page to find more slash command examples. In addition to slash commands, you can use other properties supported by the Apps-Engine to expand the functionality of your app to meet business requirements, as we will see in the upcoming sections.

An app can listen to certain events and react according to your requirements. You can implement an event interface to listen to an event and handle its payload. The Rocket.Chat Apps-Engine provides various event interfaces. Typically, each interface contains methods that will be called before or after a Rocket.Chat event. Here we will learn some concepts about event interfaces and handlers in Rocket.Chat. Event interfaces Event interfaces are the mechanism by which apps can connect to the events on Rocket.Chat. For instance, when a message is sent, when a room or channel is created, or when a file is uploaded, the app can take some actions. For each of these events, there are respective interfaces that the app needs to use to connect to the events properly. Let's consider an example, an app implements the post-room creation interface with the PostRoomCreate method. This

After configuring iFrame auth , you can explore Rocket.Chat, customize, and embed by adding a Rocket.Chat room to your webapp. Iframe integration in Rocket.Chat allows you to embed chat rooms from your Rocket.Chat server on other websites or web apps. Once iframe integration is enabled on your Rocket.Chat server, you can connect your application to the server. Prerequisites A running Rocket.Chat server with at least one room. See the official deployment guide to explore various ways of setting up your Rocket.Chat workspace. Activate the Iframe integration To enable the Iframe integration setting in your Rocket.Chat server, Navigate to Administration > Workspace > Settings > Accounts > Iframe. Toggle on the Enabled option. Fill in the iframe URL with the application URL where you want to integrate the current Rocket.Chat application. Add the API URL , which is essential for Rocket.Chat to verify that a user is

The quickest way to set up a Rocket.Chat development environment is by using Gitpod. Gitpod offers a shared workspace for open-source project developers, including those working on SaaS projects like Rocket.Chat. It provides a hosted development environment accessible through a web browser, allowing you to contribute to Rocket.Chat conveniently. This documentation is based on Gitpod Flex . Follow the steps below to set up your Rocket.Chat development environment in Gitpod. Prerequisites Create a GitHub account Sign up for a Gitpod account Generate a GitHub Personal Access Token (PAT) if you don’t already have one Set up a runner for your Gitpod development environment using one of the following options: Gitpod Desktop for local development Remote self-hosted runners such as AWS Fork the Rocket.Chat GitHub repository to your GitHub account Step 1: Create a Gitpod environment Once your runner is ready: Navigate to Gitpod

updateByAssociations method is used to update the record. For details, see the IPersistence interface . Finally, we will define the sendMessage and sendNotification functions to send messages to the channel. These functions are added after the numberPersis class. export async function sendMessage( modify: IModify, room: IRoom, sender: IUser, message: string, ): Promise { const msg = modify.getCreator().startMessage() .setSender(sender) .setRoom(room) .setText(message); return await modify.getCreator().finish(msg); } export async function sendNotification( modify: IModify, room: IRoom, sender: IUser, message: string ): Promise { let msg = modify.getCreator().startMessage().setRoom(room).setText(message); // uncomment below if you want the notification to be sent by the sender instead of the app bot user // msg = msg.setSender(sender); // lets build a really simple block const block = modify.getCreator().startMessage(); // we want this block to have a Text supporting MarkDown block.setBlocks([ { type: 'section', text: { type: 'mrkdwn', text: message } } ]) // now let's set the blocks in our