Chat·续1

Sending a file is similar to sending an image. The only difference is that when you send an image, a preview will be shown in the meeting chat, which is not the case for sending files. That being said, an image can be sent as a file too using meeting.chat.sendFileMessage().

import { useRef } from "react";

function ChatComponent() {
    const fileInputRef = useRef(null);

const onSendFile = async () => {
        const file = fileInputRef.current;
        if (file && file.files[0]) {
            await meeting.chat.sendFileMessage(file.files[0]);
        }
    };

return (
        <>
            <label htmlFor="file">Select file:</label>
            <input type="file" id="file" name="file" ref={fileInputRef} />
            <button onClick={onSendFile}>Send File</button>
        </>
    );
}

Sending a file is similar to sending an image. The only difference is that when you send an image, a preview will be shown in the meeting chat, which is not the case for sending files. That being said, an image can be sent as a file too using meeting.chat.sendFileMessage().

meeting.chat.sendFileMessage(fileUri) { err ->
  // Handle error if any
}

Sending a file is similar to sending an image. The only difference is that when you send an image, a preview will be shown in the meeting chat, which is not the case for sending files. That being said, an image can be sent as a file too using meeting.chat.sendFileMessage().

meeting.chat.sendFileMessage(fileURL: url) { err in
  // Handle error if any
}

Sending a file is similar to sending an image. The only difference is that when you send an image, a preview will be shown in the meeting chat, which is not the case for sending files. That being said, an image can be sent as a file too using meeting.chat.sendFileMessage().

import DocumentPicker from "@react-native-documents/picker";

async function onSendFile() {
    // Get the file uri and create an object with the following fields
    const res = await DocumentPicker.pickSingle({
        type: [DocumentPicker.types.allFiles],
    });
    const file = {
        uri: res.uri,
        name: res.name,
        size: res.size,
        type: res.type,
    };
    await meeting.chat.sendFileMessage(file);
}

Send a Custom Message

Use meeting.chat.sendCustomMessage() to send a single message that combines text, HTML, files, images, and videos. The method accepts a payload of the following type:

interface CustomMessagePayload {
    type: "custom";
    message?: string;
    html?: string;
    files?: (File | string)[];
    images?: (File | string)[];
    videos?: (File | string)[];
}

Each entry in files, images, and videos can be either a File, which is uploaded before the message is sent, or a URL string, which is sent as-is.

async function onSendCustomMessage() {
    const file = document.getElementById("file");
    await meeting.chat.sendCustomMessage({
        type: "custom",
        message: "Here are the slides from today's session",
        files: [file.files[0]],
        images: ["https://example.com/architecture-diagram.png"],
    });
}

Participants receive a message of type custom. Each entry in files, images, and videos is a MediaItem with a link and, for uploaded files, the name, size, and type of the file.

Sending a custom message requires permission to send both text and files.

Use meeting.chat.sendCustomMessage() to send a single message that combines text, HTML, files, images, and videos. The method accepts a payload of the following type:

interface CustomMessagePayload {
    type: "custom";
    message?: string;
    html?: string;
    files?: (File | string)[];
    images?: (File | string)[];
    videos?: (File | string)[];
}

Each entry in files, images, and videos can be either a File, which is uploaded before the message is sent, or a URL string, which is sent as-is.

const onSendCustomMessage = async (file) => {
    await meeting.chat.sendCustomMessage({
        type: "custom",
        message: "Here are the slides from today's session",
        files: [file],
        images: ["https://example.com/architecture-diagram.png"],
    });
};

Participants receive a message of type custom. Each entry in files, images, and videos is a MediaItem with a link and, for uploaded files, the name, size, and type of the file.

Sending a custom message requires permission to send both text and files.

Use meeting.chat.sendCustomMessage() to send a single message that combines text, HTML, files, images, and videos. The method accepts a payload of the following type:

interface CustomMessagePayload {
    type: "custom";
    message?: string;
    html?: string;
    files?: (File | string)[];
    images?: (File | string)[];
    videos?: (File | string)[];
}

Each entry in files, images, and videos can be either a file object, which is uploaded before the message is sent, or a URL string, which is sent as-is.

await meeting.chat.sendCustomMessage({
    type: "custom",
    message: "Here are the slides from today's session",
    files: ["https://example.com/slides.pdf"],
    images: ["https://example.com/architecture-diagram.png"],
});

Participants receive a message of type custom. Each entry in files, images, and videos is a MediaItem with a link and, for uploaded files, the name, size, and type of the file.

Sending a custom message requires permission to send both text and files.

Send Any Message Type

There is also a common method called meeting.chat.sendMessage() that can be used to send text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The sendMessage() method accepts a message parameter and an optional list of participant IDs to send the message privately:

type MessagePayload =
    | { type: "text"; message: string }
    | { type: "image"; image: File }
    | { type: "file"; file: File };

async function sendMessage(
    message: MessagePayload,
    participantIds?: string[],
): Promise<void>;

Here is how you would use the sendMessage() method to send a text message:

const message = "Is this just fantasy?";
await meeting.chat.sendMessage({ type: "text", message });

To send a custom message, use sendCustomMessage().

There is also a common method called meeting.chat.sendMessage() that can be used to send text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The sendMessage() method accepts a message parameter and an optional list of participant IDs to send the message privately:

type MessagePayload =
    | { type: "text"; message: string }
    | { type: "image"; image: File }
    | { type: "file"; file: File };

async function sendMessage(
    message: MessagePayload,
    participantIds?: string[],
): Promise<void>;

Here is how you would use the sendMessage() method to send a text message:

const message = "Is this just fantasy?";
await meeting.chat.sendMessage({ type: "text", message });

To send a custom message, use sendCustomMessage().

There is also a common method called meeting.chat.sendMessage() that can be used to send text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The sendMessage() method accepts a message parameter and an optional list of participant IDs to send the message privately:

type MessagePayload =
    | { type: "text"; message: string }
    | { type: "image"; image: File }
    | { type: "file"; file: File };

async function sendMessage(
    message: MessagePayload,
    participantIds?: string[],
): Promise<void>;

Here is how you would use the sendMessage() method to send a text message:

const message = "Is this just fantasy?";
await meeting.chat.sendMessage({ type: "text", message });

To send a custom message, use sendCustomMessage().

Send a Private Message

All send methods accept an optional second argument: an array of participant IDs. When you pass it, the message is only delivered to those participants and to the local participant, who is added automatically.

Pass the participant's id, not their userId.

// Find the participant with name "Freddie".
const participant = meeting.participants.joined
    .toArray()
    .find((p) => p.name === "Freddie");

await meeting.chat.sendTextMessage("Hey Freddie!", [participant.id]);

// Or, using sendMessage()
await meeting.chat.sendMessage({ type: "text", message: "Hey Freddie!" }, [
    participant.id,
]);

Sending private messages requires the private chat permissions (meeting.self.permissions.chatPrivate). Received private messages include targetUserIds.

All send methods accept an optional second argument: an array of participant IDs. When you pass it, the message is only delivered to those participants and to the local participant, who is added automatically.

Pass the participant's id, not their userId.

// Find the participant with name "Freddie".
const participant = meeting.participants.joined
    .toArray()
    .find((p) => p.name === "Freddie");

await meeting.chat.sendTextMessage("Hey Freddie!", [participant.id]);

// Or, using sendMessage()
await meeting.chat.sendMessage({ type: "text", message: "Hey Freddie!" }, [
    participant.id,
]);

Sending private messages requires the private chat permissions (meeting.self.permissions.chatPrivate). Received private messages include targetUserIds.

All send methods accept an optional second argument: an array of participant IDs. When you pass it, the message is only delivered to those participants and to the local participant, who is added automatically.

Pass the participant's id, not their userId.

// Find the participant with name "Freddie".
const participant = meeting.participants.joined
    .toArray()
    .find((p) => p.name === "Freddie");

await meeting.chat.sendTextMessage("Hey Freddie!", [participant.id]);

// Or, using sendMessage()
await meeting.chat.sendMessage({ type: "text", message: "Hey Freddie!" }, [
    participant.id,
]);

Sending private messages requires the private chat permissions (meeting.self.permissions.chatPrivate). Received private messages include targetUserIds.

Message Limits

Text messages are limited to 2,000 characters by default. Sending a longer message throws an error. You can read the current limit from meeting.chat.maxTextLimit and change it with meeting.chat.setMaxTextLimit().

console.log(meeting.chat.maxTextLimit); // 2000

meeting.chat.setMaxTextLimit(500);

The send methods are also rate limited. Calls that exceed the limit throw an error.

Method Default limit
sendTextMessage(), sendMessage() 180 messages per 60 seconds
sendImageMessage(), sendFileMessage() 20 messages per 60 seconds

You can read the rate limit of sendTextMessage() from meeting.chat.rateLimits and change it with meeting.chat.updateRateLimits(), which accepts the maximum number of messages and the period in seconds.

console.log(meeting.chat.rateLimits); // { maxInvocations: 180, period: 60 }

// Allow 60 messages every 30 seconds
meeting.chat.updateRateLimits(60, 30);

Text messages are limited to 2,000 characters by default. Sending a longer message throws an error. You can read the current limit from meeting.chat.maxTextLimit and change it with meeting.chat.setMaxTextLimit().

console.log(meeting.chat.maxTextLimit); // 2000

meeting.chat.setMaxTextLimit(500);

The send methods are also rate limited. Calls that exceed the limit throw an error.

Method Default limit
sendTextMessage(), sendMessage() 180 messages per 60 seconds
sendImageMessage(), sendFileMessage() 20 messages per 60 seconds

You can read the rate limit of sendTextMessage() from meeting.chat.rateLimits and change it with meeting.chat.updateRateLimits(), which accepts the maximum number of messages and the period in seconds.

console.log(meeting.chat.rateLimits); // { maxInvocations: 180, period: 60 }

// Allow 60 messages every 30 seconds
meeting.chat.updateRateLimits(60, 30);

Text messages are limited to 2,000 characters by default. Sending a longer message throws an error. You can read the current limit from meeting.chat.maxTextLimit and change it with meeting.chat.setMaxTextLimit().

console.log(meeting.chat.maxTextLimit); // 2000

meeting.chat.setMaxTextLimit(500);

The send methods are also rate limited. Calls that exceed the limit throw an error.

Method Default limit
sendTextMessage(), sendMessage() 180 messages per 60 seconds
sendImageMessage(), sendFileMessage() 20 messages per 60 seconds

You can read the rate limit of sendTextMessage() from meeting.chat.rateLimits and change it with meeting.chat.updateRateLimits(), which accepts the maximum number of messages and the period in seconds.

console.log(meeting.chat.rateLimits); // { maxInvocations: 180, period: 60 }

// Allow 60 messages every 30 seconds
meeting.chat.updateRateLimits(60, 30);

Receiving Chat Messages

The meeting.chat object emits a chatUpdate event whenever a message is added, edited, or deleted.

meeting.chat.on("chatUpdate", ({ action, message }) => {
    switch (action) {
        case "add":
            console.log("New message", message);
            break;
        case "edit":
            console.log("Message edited", message);
            break;
        case "delete":
            console.log("Message deleted", message.id);
            break;
    }
});