Message Information
CometChatMessageInformation is a standalone component that displays comprehensive information about the message receipts. This will enable users to easily access details such as the message content, recipient and delivery receipt information for a more informed communication experience.
Properties
Title
Heading text for the component
| Name | Type | Description |
|---|---|---|
| title | String | Heading text for the component |
Message
Customise message object and message template of the component
| Name | Type | Description |
|---|---|---|
| message | CometChat.Message | CometChat message object |
| template | CometChatMessageTemplate | Override the default message bubble view |
Loading state
This refers to the state of the component when it is actively retrieving or fetching data.
| Name | Type | Description |
|---|---|---|
| loadingIconURL | string | Asset URL for the loading indicator icon |
| loadingStateView | view | Reference to the template within the user-defined component to customise the loading indicator |
Empty state
This refers to the state of the component when it has no content or data to display
| Name | Type | Description |
|---|---|---|
| emptyStateText | string | The textual content displayed in the empty state of the component. |
| emptyStateView | view | Reference to the template within the user-defined component to customise the empty state of the component. |
Error state
This refers to the state of the component when an error occurs during the retrieval of the data.
| Name | Type | Description |
|---|---|---|
| errorStateText | string | The textual content displayed in the error state of the component. |
| errorStateView | view | Reference to the template within the user-defined component to customise the error state of the component. |
Assets URL
Custom asset URL used for graphical representation
| Name | Type | Description |
|---|---|---|
| readIcon | string | Asset URL for the read state indicating that a sent message is read by the receiver. |
| deliveredIcon | string | Asset URL for the delivered state indicating that a sent message is delivered successfully. |
| closeIconURL | string | Asset URL for the close icon |
Date pattern
Customise the date pattern of message receipts.
| Name | Type | Description |
|---|---|---|
| receiptDatePattern | (timestamp:number)=>string | Override the in-built pattern with your custom representation of the timestamp |
Custom view
UI component created and customised by the developer to meet your design or functional requirements.
| Name | Type | Description |
|---|---|---|
| subtitleView | (messageObject: CometChat.BaseMessage, messageReceipt?: CometChat.MessageReceipt) => ViewType | Reference to the template within the user-defined component to customise the secondary text shown in the default user profile. |
| bubbleView | (message: CometChat.BaseMessage)=> ViewType | Reference to the template within the user-defined component to customise the message bubble view |
| listItemView | (messageObject: CometChat.BaseMessage, messageReceipt?: CometChat.MessageReceipt) => ViewType | Reference to the template within the user-defined component to customise the each list item |
Function callback
Functions that can be invoked by the user in response to a specific event or condition.
| Name | Type | Description |
|---|---|---|
| onClose | ()=>void | Override the method that is invoked when user clicks on the close icon |
| onError | ((error:CometChat.CometChatException)=>void) | null | Override the method that is invoked when an error is encountered within the component |
Style
Styling properties and values of all the involved components
| Name | Type | Description |
|---|---|---|
| listItemStyle | listItemStyle | Styling properties and values of the Listitem component |
| messageInformationStyle | MessageInformationStyle | Styling properties and values of the Message Information component |