fix(composer): forward messages as attachments

Signed-off-by: Richard Steinmetz <[email protected]>

src/components/Composer.vue

@@ -414,7 +414,6 @@
 <script>
 import debounce from 'lodash/fp/debounce'
 import uniqBy from 'lodash/fp/uniqBy'
-import isArray from 'lodash/fp/isArray'
 import trimStart from 'lodash/fp/trimCharsStart'
 import Autosize from 'vue-autosize'
 import debouncePromise from 'debounce-promise'
@@ -910,29 +909,23 @@ export default {
 				})
 			})
 		}
+
 		// Add messages forwarded as attachments
-		let forwards = []
-		if (this.forwardedMessages && !isArray(this.forwardedMessages)) {
-			forwards = [this.forwardedMessages]
-		} else if (this.forwardedMessages && isArray(this.forwardedMessages)) {
-			forwards = this.forwardedMessages
-		}
-		forwards.forEach(id => {
+		for (const id of this.forwardedMessages) {
 			const env = this.$store.getters.getEnvelope(id)
 			if (!env) {
 				// TODO: also happens when the composer page is reloaded
 				showError(t('mail', 'Message {id} could not be found', {
 					id,
 				}))
-				return
+				continue
 			}
 
-			this.attachments.push({
-				displayName: env.subject + '.eml',
+			this.bus.$emit('on-add-message-as-attachment', {
 				id,
-				type: 'message',
+				fileName: env.subject + '.eml',
 			})
-		})
+		}
 
 		// Set custom date and time picker value if initialized with custom send at value
 		if (this.sendAt && this.isSendAtCustom) {

src/components/ComposerAttachment.vue

@@ -7,6 +7,9 @@
 			<span v-if="attachment.type === 'cloud'" class="cloud-attachment-icon">
 				<Cloud :size="16" />
 			</span>
+			<span v-else-if="attachment.type === 'message'">
+				<EmailArrowRightOutlineIcon />
+			</span>
 		</div>
 		<div class="attachment-inner">
 			<span class="new-message-attachment-name">
@@ -15,7 +18,9 @@
 			<span v-if="!attachment.finished" class="attachments-upload-progress">
 				<span class="attachments-upload-progress--bar" :style="&quot;width:&quot; + attachment.percent + &quot;%&quot;" />
 			</span>
-			<span v-else class="new-message-attachment-size">{{ attachment.sizeString }}</span>
+			<span v-else-if="attachment.sizeString" class="new-message-attachment-size">
+				{{ attachment.sizeString }}
+			</span>
 		</div>
 		<button @click="onDelete(attachment)">
 			<Close :size="24" />
@@ -27,12 +32,14 @@
 import { generateUrl } from '@nextcloud/router'
 import Close from 'vue-material-design-icons/Close'
 import Cloud from 'vue-material-design-icons/Cloud'
+import EmailArrowRightOutlineIcon from 'vue-material-design-icons/EmailArrowRightOutline.vue'
 
 export default {
 	name: 'ComposerAttachment',
 	components: {
 		Close,
 		Cloud,
+		EmailArrowRightOutlineIcon,
 	},
 	props: {
 		bus: {

src/components/ComposerAttachments.vue

@@ -3,6 +3,7 @@
   - @copyright 2020 Gary Kim <[email protected]>
   -
   - @author 2018 Christoph Wurst <[email protected]>
+  - @author Richard Steinmetz <[email protected]>
   -
   - @license AGPL-3.0-or-later
   -
@@ -166,6 +167,7 @@ export default {
 		this.bus.$on('on-add-local-attachment', this.onAddLocalAttachment)
 		this.bus.$on('on-add-cloud-attachment', this.onAddCloudAttachment)
 		this.bus.$on('on-add-cloud-attachment-link', this.onAddCloudAttachmentLink)
+		this.bus.$on('on-add-message-as-attachment', this.onAddMessageAsAttachment)
 		this.value.map(attachment => {
 			this.attachments.push({
 				id: attachment.id,
@@ -341,6 +343,25 @@ export default {
 				logger.error('could not choose a file as attachment link', { error })
 			}
 		},
+		/**
+		 * Add a forwarded message as an attachment
+		 *
+		 * @param {object} data Payload
+		 * @param {number} data.id Database id of the message to forward as an attachment
+		 * @param {string} data.fileName File name of the attachment
+		 */
+		onAddMessageAsAttachment({ id, fileName }) {
+			const attachment = {
+				type: 'message',
+				id,
+				fileName,
+			}
+			this.attachments.push({
+				...attachment,
+				finished: true,
+			})
+			this.emitNewAttachments([attachment])
+		},
 		showAttachmentFileSizeWarning(num) {
 			showWarning(n(
 				'mail',

src/components/EnvelopeList.vue

@@ -583,8 +583,8 @@ export default {
 			this.showTagModal = false
 		},
 		async forwardSelectedAsAttachment() {
-			await this.$store.dispatch('showMessageComposer', {
-				forwardedMessages: this.selection,
+			await this.$store.dispatch('startComposerSession', {
+				forwardedMessages: [...this.selection],
 			})
 			this.unselectAll()
 		},

src/components/MenuEnvelope.vue

@@ -561,9 +561,8 @@ export default {
 			this.$emit('update:selected')
 		},
 		async forwardSelectedAsAttachment() {
-			this.forwardedMessages = [this.envelope.databaseId]
-			await this.$store.dispatch('showMessageComposer', {
-				forwardedMessages: this.forwardedMessages,
+			await this.$store.dispatch('startComposerSession', {
+				forwardedMessages: [this.envelope.databaseId],
 			})
 		},
 		async onShowSourceModal() {