fix(composer): handling of plain and html bodies

src/components/Composer.vue

@@ -480,7 +480,7 @@
 import mitt from 'mitt'
 
 import { findRecipient } from '../service/AutocompleteService.js'
-import { detect, html, plain, toHtml, toPlain } from '../util/text.js'
+import { detect, html, toHtml, toPlain } from '../util/text.js'
 import logger from '../logger.js'
 import TextEditor from './TextEditor.vue'
 import { buildReplyBody } from '../ReplyBuilder.js'
@@ -1076,7 +1076,7 @@
 			this.bodyVal = html(body).value
 		},
 		getMessageData() {
-			return {
+			const data = {
 				// TODO: Rename account to accountId
 				account: this.selectedAlias.id,
 				accountId: this.selectedAlias.id,
@@ -1085,7 +1085,6 @@
 				cc: this.selectCc,
 				bcc: this.selectBcc,
 				subject: this.subjectVal,
-				body: this.encrypt ? plain(this.bodyVal) : html(this.bodyVal),
 				attachments: this.attachments,
 				inReplyToMessageId: this.inReplyToMessageId ?? (this.replyTo ? this.replyTo.messageId : undefined),
 				isHtml: !this.encrypt && !this.editorPlainText,
@@ -1096,6 +1095,14 @@
 				smimeCertificateId: this.smimeCertificateForCurrentAlias?.id,
 				isPgpMime: this.encrypt,
 			}
+
+			if (data.isHtml) {
+				data.bodyHtml = this.bodyVal
+			} else {
+				data.bodyPlain = toPlain(html(this.bodyVal)).value
+			}
+
+			return data
 		},
 		saveDraft() {
 			const draftData = this.getMessageData()
@@ -1427,8 +1434,8 @@
 		 * Empty if label and email are the same or
 		 * if the suggestion is a group.
 		 *
 		 * @param {{email: string, label: string}} option
 		 * @return string
 		 */
 		getSubnameForRecipient(option) {
 			if (option.source && option.source === 'groups') {

src/components/NewMessageModal.vue

@@ -79,7 +79,7 @@
 						:bcc="composerData.bcc"
 						:subject="composerData.subject"
 						:attachments-data="composerData.attachments"
-						:body="composerData.body"
+						:body="composerDataBodyAsTextInstance"
 						:editor-body="convertEditorBody(composerData)"
 						:in-reply-to-message-id="composerData.inReplyToMessageId"
 						:reply-to="composerData.replyTo"
@@ -102,7 +102,7 @@
 						@update:bcc="patchComposerData({ bcc: $event })"
 						@update:subject="patchComposerData({ subject: $event })"
 						@update:attachments-data="patchComposerData({ attachments: $event })"
-						@update:editor-body="patchComposerData({ editorBody: $event })"
+						@update:editor-body="patchEditorBody"
 						@update:send-at="patchComposerData({ sendAt: $event / 1000 })"
 						@update:smime-sign="patchComposerData({ smimeSign: $event })"
 						@update:smime-encrypt="patchComposerData({ smimeSign: $event })"
@@ -131,7 +131,6 @@ import { showError, showSuccess } from '@nextcloud/dialogs'
 import { translate as t } from '@nextcloud/l10n'
 
 import logger from '../logger.js'
-import { toPlain, toHtml, plain } from '../util/text.js'
 import Composer from './Composer.vue'
 import { UNDO_DELAY } from '../store/constants.js'
 import { matchError } from '../errors/match.js'
@@ -147,6 +146,8 @@ import useOutboxStore from '../store/outboxStore.js'
 import { mapStores, mapState, mapActions } from 'pinia'
 import RecipientInfo from './RecipientInfo.vue'
 import useMainStore from '../store/mainStore.js'
+import { messageBodyToTextInstance } from '../util/message.js'
+import { toPlain } from '../util/text.js'
 
 export default {
 	name: 'NewMessageModal',
@@ -196,6 +197,9 @@ export default {
 		...mapStores(useOutboxStore, useMainStore),
 		...mapState(useMainStore, ['showMessageComposer']),
 		...mapActions(useMainStore, ['getPreference']),
+		composerDataBodyAsTextInstance() {
+			return messageBodyToTextInstance(this.composerData)
+		},
 		modalTitle() {
 			if (this.composerMessage.type === 'outbox') {
 				return t('mail', 'Edit message')
@@ -292,8 +296,6 @@ export default {
 		handleShow(element) {
 			this.additionalTrapElements.push(element)
 		},
-		toHtml,
-		plain,
 		/**
 		 * @param data Message data
 		 * @param {object=} opts Options
@@ -367,7 +369,6 @@ export default {
 				...data,
 				id: data.id,
 				accountId: data.accountId,
-				editorBody: data.body.value,
 				to: data.to,
 				cc: data.cc,
 				bcc: data.bcc,
@@ -377,11 +378,13 @@ export default {
 				sendAt: data.sendAt,
 				draftId: this.composerData?.draftId,
 			}
+
 			if (data.isHtml) {
-				dataForServer.bodyHtml = data.body.value
+				delete dataForServer.bodyPlain
 			} else {
-				dataForServer.bodyPlain = toPlain(data.body).value
+				delete dataForServer.bodyHtml
 			}
+
 			return dataForServer
 		},
 		onAttachmentUploading(done, data) {
@@ -415,7 +418,7 @@ export default {
 				}
 
 				if (!force && data.attachments.length === 0) {
-					const lines = toPlain(data.body).value.toLowerCase().split('\n')
+					const lines = toPlain(messageBodyToTextInstance(data)).value.toLowerCase().split('\n')
 					const wordAttachment = t('mail', 'attachment').toLowerCase()
 					const wordAttached = t('mail', 'attached').toLowerCase()
 					for (const line of lines) {
@@ -548,13 +551,18 @@ export default {
 			}
 		},
 		convertEditorBody(composerData) {
-			if (composerData.editorBody) {
-				return composerData.editorBody
+			if (composerData.isHtml) {
+				return composerData.bodyHtml
 			}
-			if (!composerData.body) {
-				return ''
+
+			return composerData.bodyPlain
+		},
+		patchEditorBody(editorBody) {
+			if (this.composerData.isHtml) {
+				this.patchComposerData({ bodyHtml: editorBody })
+			} else {
+				this.patchComposerData({ bodyPlain: editorBody })
 			}
-			return toHtml(composerData.body).value
 		},
 		updateCookedComposerData() {
 			if (!this.$refs.composer) {

src/components/OutboxMessageListItem.vue

@@ -55,7 +55,6 @@ import moment from '@nextcloud/moment'
 import logger from '../logger.js'
 import { showError, showSuccess } from '@nextcloud/dialogs'
 import { matchError } from '../errors/match.js'
-import { html, plain } from '../util/text.js'
 import Send from 'vue-material-design-icons/Send.vue'
 import Copy from 'vue-material-design-icons/ContentCopy.vue'
 import {
@@ -65,6 +64,7 @@ import {
 	UNDO_DELAY,
 } from '../store/constants.js'
 import useOutboxStore from '../store/outboxStore.js'
+import useMainStore from '../store/mainStore.js'
 import { mapStores } from 'pinia'
 
 export default {
@@ -87,7 +87,7 @@ export default {
 		},
 	},
 	computed: {
-		...mapStores(useOutboxStore),
+		...mapStores(useOutboxStore, useMainStore),
 		selected() {
 			return this.$route.params.messageId === this.message.id
 		},
@@ -170,21 +170,9 @@ export default {
 			if (this.message.status === STATUS_IMAP_SENT_MAILBOX_FAIL) {
 				return
 			}
-			if (this.message.editorBody === null) {
-				return
-			}
-			const bodyData = {}
-			if (this.message.isHtml) {
-				bodyData.bodyHtml = html(this.message.body)
-			} else {
-				bodyData.bodyPlain = plain(this.message.body)
-			}
 			await this.mainStore.startComposerSession({
 				type: 'outbox',
-				data: {
-					...this.message,
-					...bodyData,
-				},
+				data: { ...this.message },
 			})
 		},
 	},

src/store/mainStore/actions.js

@@ -89,7 +89,6 @@ import {
 	priorityImportantQuery,
 	priorityOtherQuery,
 } from '../../util/priorityInbox.js'
-import { html, plain, toPlain } from '../../util/text.js'
 import Axios from '@nextcloud/axios'
 import { generateUrl } from '@nextcloud/router'
 import { handleHttpAuthErrors } from '../../http/sessionExpiryHandler.js'
@@ -449,14 +448,16 @@ export default function mainStoreActions() {
 							FORBID_TAGS: ['style'],
 						})
 
-						data.body = html(resp.data)
+						data.isHtml = true
+						data.bodyHtml = resp.data
 						if (reply.suggestedReply) {
-							data.body.value = `<p>${reply.suggestedReply}<\\p>` + data.body.value
+							data.bodyHtml = `<p>${reply.suggestedReply}<\\p>` + data.bodyHtml
 						}
 					} else {
-						data.body = plain(original.body)
+						data.isHtml = false
+						data.bodyPlain = original.body
 						if (reply.suggestedReply) {
-							data.body.value = `${reply.suggestedReply}\n` + data.body.value
+							data.bodyPlain = `${reply.suggestedReply}\n` + data.bodyPlain
 						}
 					}
 
@@ -472,8 +473,9 @@ export default function mainStoreActions() {
 								to,
 								cc: [],
 								subject: buildReplySubject(reply.data.subject),
-								body: data.body,
-								originalBody: data.body,
+								isHtml: data.isHtml,
+								bodyHtml: data.bodyHtml,
+								bodyPlain: data.bodyPlain,
 								replyTo: reply.data,
 								smartReply: reply.smartReply,
 							},
@@ -492,8 +494,9 @@ export default function mainStoreActions() {
 								to: recipients.to,
 								cc: recipients.cc,
 								subject: buildReplySubject(reply.data.subject),
-								body: data.body,
-								originalBody: data.body,
+								isHtml: data.isHtml,
+								bodyHtml: data.bodyHtml,
+								bodyPlain: data.bodyPlain,
 								replyTo: reply.data,
 							},
 						})
@@ -506,8 +509,9 @@ export default function mainStoreActions() {
 								to: [],
 								cc: [],
 								subject: buildForwardSubject(reply.data.subject),
-								body: data.body,
-								originalBody: data.body,
+								isHtml: data.isHtml,
+								bodyHtml: data.bodyHtml,
+								bodyPlain: data.bodyPlain,
 								forwardFrom: reply.data,
 								attachments: original.attachments.map(attachment => ({
 									...attachment,
@@ -540,9 +544,11 @@ export default function mainStoreActions() {
 							FORBID_TAGS: ['style'],
 						})
 
-						data.body = html(resp.data)
+						data.isHtml = true
+						data.bodyHtml = resp.data
 					} else {
-						data.body = plain(message.body)
+						data.isHtml = false
+						data.bodyPlain = message.body
 					}
 
 					// TODO: implement attachments
@@ -555,14 +561,8 @@ export default function mainStoreActions() {
 				let originalSendAt
 				if (type === 'outbox' && data.id && data.sendAt) {
 					originalSendAt = data.sendAt
-					const message = { ...data }
-					if (data.isHtml) {
-						message.bodyHtml = data.body.value
-					} else {
-						message.bodyPlain = toPlain(data.body).value
-					}
 					const outboxStore = useOutboxStore()
-					await outboxStore.stopMessage({ message })
+					await outboxStore.stopMessage({ message: { ...data } })
 				}
 
 				this.startComposerSessionMutation({
@@ -585,18 +585,12 @@ export default function mainStoreActions() {
 			id,
 		} = {}) {
 			return handleHttpAuthErrors(async () => {
-
 				// Restore original sendAt timestamp when requested
 				const message = this.composerMessage
+				const messageData = { ...this.composerMessage.data }
 				if (restoreOriginalSendAt && message.type === 'outbox' && message.options?.originalSendAt) {
-					const body = message.data.body
-					if (message.data.isHtml) {
-						message.bodyHtml = body.value
-					} else {
-						message.bodyPlain = toPlain(body).value
-					}
-					message.sendAt = message.options.originalSendAt
-					updateDraft(message)
+					messageData.sendAt = message.options.originalSendAt
+					updateDraft(messageData)
 				}
 				if (moveToImap) {
 					await moveDraft(id)

src/store/outboxStore.js

@@ -10,7 +10,6 @@ import * as OutboxService from '../service/OutboxService.js'
 import logger from '../logger.js'
 import { showError, showSuccess, showUndo } from '@nextcloud/dialogs'
 import { translate as t } from '@nextcloud/l10n'
-import { html, plain } from '../util/text.js'
 import { UNDO_DELAY } from './constants.js'
 import useMainStore from './mainStore.js'
 
@@ -184,19 +183,9 @@ export default defineStore('outbox', {
 						logger.info('Attempting to stop sending message ' + message.id)
 						const stopped = await this.stopMessage({ message })
 						logger.info('Message ' + message.id + ' stopped', { message: stopped })
-						// The composer expects rich body data and not just a string
-						const bodyData = {}
-						if (message.isHtml) {
-							bodyData.bodyHtml = html(message.body)
-						} else {
-							bodyData.bodyPlain = plain(message.body)
-						}
 						await this.mainStore.startComposerSession({
 							type: 'outbox',
-							data: {
-								...message,
-								...bodyData,
-							},
+							data: { ...message },
 						}, { root: true })
 					}, {
 						timeout: UNDO_DELAY,

src/util/message.js

@@ -0,0 +1,20 @@
+/**
+ * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { html, plain } from './text.js'
+
+/**
+ * Convert a given message data object to a text instance (see ./text.js)
+ *
+ * @param {{ isHtml: boolean, bodyHtml?: string|null, bodyPlain?: string|null }} message The message object
+ * @return {import('./text.js').Text} The text instance
+ */
+export function messageBodyToTextInstance(message) {
+	if (message.isHtml) {
+		return html(message.bodyHtml ?? '')
+	}
+
+	return plain(message.bodyPlain ?? '')
+}