MessagesModal class

MessagesModal displays a modal interface for managing direct and group messages within an event. It provides separate tabs for viewing and sending direct or group messages, configurable based on the event type.

Parameters:

• MessagesModalOptions options: Configuration for the modal, including:
  • isMessagesModalVisible: Whether the modal is visible.
  • onMessagesClose: Callback to close the modal.
  • onSendMessagePress: Function to handle sending a message.
  • messages: List of Message objects to display.
  • position: Modal position on the screen (e.g., 'topRight').
  • backgroundColor: Modal background color.
  • activeTabBackgroundColor: Background color for the active tab.
  • eventType, member, islevel: Event and user role information for filtering messages.
  • coHost, coHostResponsibility: Co-host settings and responsibilities.
  • directMessageDetails: Participant details for direct messages.
  • updateStartDirectMessage and updateDirectMessageDetails: Functions to manage direct messaging state.
  • socket: Socket instance for real-time updates.
  • showAlert: Optional callback for displaying alerts.

Key Functions:

• _populateMessages: Populates lists for directMessages and groupMessages based on event type, user roles, and responsibilities.
• _buildTabContent: Displays content in the active tab, showing either direct or group messages depending on the selected tab.
• _handleSendButton: Validates and sends messages, clearing the input and updating the reply state as needed.

Example Usage:

MessagesModal(
  options: MessagesModalOptions(
    isMessagesModalVisible: true,
    onMessagesClose: () => print("Modal closed"),
    messages: messageList,
    eventType: EventType.chat,
    member: 'user123',
    islevel: '1',
    coHostResponsibility: [CoHostResponsibility(name: 'chat', value: true)],
    coHost: 'host123',
    startDirectMessage: false,
    directMessageDetails: null,
    updateStartDirectMessage: (value) => print("Direct message started: $value"),
    updateDirectMessageDetails: (participant) => print("Direct message to: ${participant?.name}"),
    roomName: 'MainRoom',
    socket: socketInstance,
    chatSetting: 'enabled',
    showAlert: (options) => print("Alert: ${options.message}"),
  ),
);

Modal Content:

• Header with Tabs: Contains tabs for switching between direct and group messaging, shown only in webinar or conference mode.
• Tab Content: Displays a list of messages and input field, with different messages shown based on active tab.

Dependencies:

• socket_io_client for real-time message handling.
• MessagePanel component to display and manage messages within each tab.

This modal is particularly useful in events or group settings, where real-time messaging and role-based message visibility are important.