MediaSFU React Native (Expo)
    Preparing search index...

    Interface MessagesModalOptions

    Interface defining the props for the MessagesModal component.

    MessagesModal provides a tabbed interface for viewing and sending group messages and direct messages with real-time updates.

    MessagesModalOptions

    Display Control:

    interface MessagesModalOptions {
        isMessagesModalVisible: boolean;
        onMessagesClose: () => void;
        onSendMessagePress?: (options: SendMessageOptions) => Promise<void>;
        messages: Message[];
        position?: "topLeft" | "topRight" | "bottomLeft" | "bottomRight";
        backgroundColor?: string;
        activeTabBackgroundColor?: string;
        eventType: EventType;
        member: string;
        islevel: string;
        coHostResponsibility: CoHostResponsibility[];
        coHost: string;
        startDirectMessage: boolean;
        directMessageDetails: Participant;
        updateStartDirectMessage: (start: boolean) => void;
        updateDirectMessageDetails: (participant: Participant) => void;
        showAlert?: ShowAlert;
        roomName: string;
        socket: Socket;
        chatSetting: string;
        style?: object;
        renderContent?: (
            options: {
                defaultContent: Element;
                dimensions: { width: number; height: number };
            },
        ) => Element;
        renderContainer?: (
            options: {
                defaultContainer: Element;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
    }
    Index

    Properties

    isMessagesModalVisible: boolean

    Whether the modal is currently visible

    onMessagesClose: () => void

    Callback when modal is closed

    onSendMessagePress?: (options: SendMessageOptions) => Promise<void>

    Function to handle sending messages (default: sendMessage)

    Direct Messaging:

    messages: Message[]

    Array of message objects to display (group and direct messages)

    position?: "topLeft" | "topRight" | "bottomLeft" | "bottomRight"

    Screen position where the modal should appear

    Styling:

    backgroundColor?: string

    Background color of the modal

    activeTabBackgroundColor?: string

    Background color of the active tab

    eventType: EventType

    Type of event ('conference', 'webinar', 'broadcast', 'chat')

    member: string

    Current user's username/member ID

    islevel: string

    Current user's level/role ('0'=participant, '1'=moderator, '2'=host)

    coHostResponsibility: CoHostResponsibility[]

    Co-host permissions

    coHost: string

    Co-host user ID

    Session Info:

    startDirectMessage: boolean

    Flag to initiate direct message mode

    directMessageDetails: Participant

    Target participant for direct message

    updateStartDirectMessage: (start: boolean) => void

    Update direct message mode flag

    updateDirectMessageDetails: (participant: Participant) => void

    Set DM recipient

    User Context:

    showAlert?: ShowAlert

    Function to display alerts/notifications

    Advanced Render Overrides:

    roomName: string

    Name/ID of the current room

    socket: Socket

    Socket.io client for real-time communication

    chatSetting: string

    Chat visibility settings ('allow', 'disallow', etc.)

    Message Handling:

    style?: object

    Additional custom styles for the modal container

    Messages Data:

    renderContent?: (
        options: {
            defaultContent: Element;
            dimensions: { width: number; height: number };
        },
    ) => Element

    Function to wrap or replace the default modal content

    renderContainer?: (
        options: {
            defaultContainer: Element;
            dimensions: { width: number; height: number };
        },
    ) => ReactNode

    Function to wrap or replace the entire modal container