diff --git a/app/javascript/dashboard/components-next/message/Message.vue b/app/javascript/dashboard/components-next/message/Message.vue index 1993df60e..528d78030 100644 --- a/app/javascript/dashboard/components-next/message/Message.vue +++ b/app/javascript/dashboard/components-next/message/Message.vue @@ -30,6 +30,11 @@ import MessageStatus from './MessageStatus.vue'; * @property {string} type - Type of sender */ +/** + * @typedef {Object} ContentAttributes + * @property {string} externalError - an error message to be shown if the message failed to send + */ + /** * @typedef {Object} Props * @property {number} id - The unique identifier for the message @@ -38,6 +43,7 @@ import MessageStatus from './MessageStatus.vue'; * @property {boolean} [private=false] - Whether the message is private * @property {number} createdAt - Timestamp when the message was created * @property {Sender|null} [sender=null] - The sender information + * @property {ContentAttributes} [contentAttributes={}] - Additional attributes of the message content * @property {number|null} [senderId=null] - The ID of the sender * @property {string|null} [senderType=null] - The type of the sender * @property {string|null} [error=null] - Error message if the message failed to send @@ -81,9 +87,9 @@ const props = defineProps({ type: String, required: true, }, - error: { - type: String, - default: '', + contentAttributes: { + type: Object, + default: () => {}, }, currentUserId: { type: Number, @@ -101,7 +107,7 @@ const props = defineProps({ */ const variant = computed(() => { if (props.private) return MESSAGE_VARIANTS.PRIVATE; - if (props.error) return MESSAGE_VARIANTS.ERROR; + if (props.status === MESSAGE_STATUS.FAILED) return MESSAGE_VARIANTS.ERROR; const variants = { [MESSAGE_TYPES.INCOMING]: MESSAGE_VARIANTS.USER, @@ -207,10 +213,10 @@ const shouldShowAvatar = computed(() => { class="[grid-area:bubble]" />
{ if (index === messages.length - 1) return false; @@ -718,6 +722,8 @@ const shouldGroupWithNext = index => { const current = messages[index]; const next = messages[index + 1]; + if (next.status === 'failed') return false; + const nextSenderId = next.senderId ?? next.sender?.id; const currentSenderId = current.senderId ?? current.sender?.id; if (currentSenderId !== nextSenderId) return false;