Skip to main content

Editing Chat Messages

As mentioned in introduction, there are 3 types of chat messages - text messages, images, and files. There is a method in to edit a message of each type.

Edit a text message

To edit a text message, the method can be used. This accepts a messageId (type string) and a message (type string).

const message =[0];
const messageId = message?.id;
const newMessage = 'Is this the real life?';
await;, newMessage);

Edit an image

You can send an image with the help of This accepts a messageId of type string and an image of type File.

<label for="img">Edit image:</label>
<input type="file" id="img" name="img" accept="image/*" />
<button onclick="onEditImage()">Edit Image</button>
async function onEditImage() {
const messageId = '...';
const image = document.getElementById('img');
await, image.files[0]);

Edit a file

Editing a file is quite similar to editing an image. To edit a file use

<label for="file">Edit file:</label>
<input type="file" id="file" name="file" />
<button onclick="onEditFile()">Edit File</button>
async function onEditFile() {
const messageId = '...';
const file = document.getElementById('file');
await, file.files[0]);


There is also a common method called that can be used to edit any of the 3 types of messages displayed above. It essentially calls one of the methods from above depending upon the type of payload you send to the method. The editMessage() method accepts a parameters messageId message of the following type:

async function editMessage(
messageId: string,
message: { type: 'text', message: string }
| { type: 'image', image: File }
| { type: 'file', file: File },
) {...}

Here's how you would use the editMessage() method to edit a text message.

const messageId = '...';
const message = 'Is this just fantasy?';
await, { type: 'text', message });