From c3b99c1e24f719905016fded43c67fc09e6fd116 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Wed, 23 Oct 2024 12:24:35 +0200
Subject: [PATCH 1/3] fix: drop redundant functions

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../BreakoutRooms/BreakoutRoomItem.vue        | 11 ++--------
 .../BreakoutRooms/BreakoutRoomsActions.vue    | 20 ++++++-------------
 2 files changed, 8 insertions(+), 23 deletions(-)

diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
index 5fa269f2b73..b701d2bc515 100644
--- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
@@ -37,7 +37,7 @@
 						</template>
 						{{ t('spreed', 'Dismiss request for assistance') }}
 					</NcActionButton>
-					<NcActionButton @click="openSendMessageDialog">
+					<NcActionButton @click="isDialogOpened = true">
 						<template #icon>
 							<Send :size="16" />
 						</template>
@@ -48,7 +48,7 @@
 				<SendMessageDialog v-if="isDialogOpened"
 					:display-name="roomName"
 					:token="roomToken"
-					@close="closeSendMessageDialog" />
+					@close="isDialogOpened = false" />
 			</template>
 		</div>
 		<ul v-show="showParticipants">
@@ -195,13 +195,6 @@ export default {
 
 	methods: {
 		t,
-		openSendMessageDialog() {
-			this.isDialogOpened = true
-		},
-
-		closeSendMessageDialog() {
-			this.isDialogOpened = false
-		},
 
 		dismissRequestAssistance() {
 			this.breakoutRoomsStore.dismissRequestAssistance(this.roomToken)
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
index 31c28a43e87..84944f26d13 100644
--- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
@@ -38,7 +38,7 @@
 				:aria-label="sendMessageLabel"
 				type="secondary"
 				:wide="true"
-				@click="openSendMessageDialog">
+				@click="isSendMessageDialogOpened = true">
 				<template #icon>
 					<Send :size="18" />
 				</template>
@@ -69,7 +69,7 @@
 			<NcActions v-if="canModerate" class="right">
 				<NcActionButton v-if="canModerate && isInBreakoutRoom"
 					:aria-label="sendMessageLabel"
-					@click="openSendMessageDialog">
+					@click="isSendMessageDialogOpened = true">
 					<template #icon>
 						<Send :size="20" />
 					</template>
@@ -103,10 +103,10 @@
 		</NcModal>
 
 		<!-- Send message dialog -->
-		<SendMessageDialog v-if="sendMessageDialogOpened"
+		<SendMessageDialog v-if="isSendMessageDialogOpened"
 			:token="mainToken"
 			:broadcast="true"
-			@close="closeSendMessageDialog" />
+			@close="isSendMessageDialogOpened = false" />
 	</div>
 </template>
 
@@ -181,14 +181,14 @@ export default {
 
 	setup() {
 		const showParticipantsEditor = ref(false)
-		const sendMessageDialogOpened = ref(false)
+		const isSendMessageDialogOpened = ref(false)
 		const dialogHeaderId = `breakout-rooms-actions-header-${useId()}`
 
 		return {
 			isInCall: useIsInCall(),
 			breakoutRoomsStore: useBreakoutRoomsStore(),
 			showParticipantsEditor,
-			sendMessageDialogOpened,
+			isSendMessageDialogOpened,
 			dialogHeaderId,
 		}
 	},
@@ -257,14 +257,6 @@ export default {
 			this.breakoutRoomsStore.stopBreakoutRooms(this.mainToken)
 		},
 
-		openSendMessageDialog() {
-			this.sendMessageDialogOpened = true
-		},
-
-		closeSendMessageDialog() {
-			this.sendMessageDialogOpened = false
-		},
-
 		openParticipantsEditor() {
 			this.showParticipantsEditor = true
 		},

From 5e2b9b113714f71f73c0437ccc6c7526549c1ed8 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Wed, 23 Oct 2024 12:33:09 +0200
Subject: [PATCH 2/3] fix: delegate message posting from NewMessage to parent
 components

- remove breakoutRooms logic from reused components

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../BreakoutRoomsEditor/SendMessageDialog.vue | 34 ++++---------
 src/components/NewMessage/NewMessage.vue      | 49 +++++++------------
 .../NewMessage/NewMessageUploadEditor.vue     | 37 +++++++++++---
 .../BreakoutRooms/BreakoutRoomItem.vue        | 19 ++++++-
 .../BreakoutRooms/BreakoutRoomsActions.vue    |  9 ++++
 5 files changed, 84 insertions(+), 64 deletions(-)

diff --git a/src/components/BreakoutRoomsEditor/SendMessageDialog.vue b/src/components/BreakoutRoomsEditor/SendMessageDialog.vue
index bca61cbeee9..d71a2d514ff 100644
--- a/src/components/BreakoutRoomsEditor/SendMessageDialog.vue
+++ b/src/components/BreakoutRoomsEditor/SendMessageDialog.vue
@@ -15,15 +15,14 @@
 			class="send-message-dialog"
 			:token="token"
 			:container="modalContainerId"
-			:aria-label="t('spreed', 'Post message')"
+			:aria-label="dialogTitle"
+			dialog
 			:broadcast="broadcast"
-			@sent="handleMessageSent"
-			@failure="handleMessageFailure" />
+			@submit="handleSubmit" />
 	</NcDialog>
 </template>
 
 <script>
-import { showError, showSuccess } from '@nextcloud/dialogs'
 import { t } from '@nextcloud/l10n'
 
 import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
@@ -40,7 +39,7 @@ export default {
 
 	props: {
 		/**
-		 * The Breakout room token.
+		 * The conversation token.
 		 */
 		token: {
 			type: String,
@@ -48,9 +47,9 @@ export default {
 		},
 
 		/**
-		 * The conversation display name
+		 * The dialog title
 		 */
-		displayName: {
+		dialogTitle: {
 			type: String,
 			default: '',
 		},
@@ -66,7 +65,7 @@ export default {
 		},
 	},
 
-	emits: ['close'],
+	emits: ['close', 'submit'],
 
 	data() {
 		return {
@@ -74,14 +73,6 @@ export default {
 		}
 	},
 
-	computed: {
-		dialogTitle() {
-			return this.broadcast
-				? t('spreed', 'Send a message to all breakout rooms')
-				: t('spreed', 'Send a message to "{roomName}"', { roomName: this.displayName })
-		},
-	},
-
 	mounted() {
 		// Postpone render of NewMessage until modal container is mounted
 		this.modalContainerId = '#' + this.$refs.dialog.$el.querySelector('.modal-container')?.id
@@ -92,16 +83,9 @@ export default {
 
 	methods: {
 		t,
-		handleMessageSent() {
-			showSuccess(this.broadcast
-				? t('spreed', 'The message was sent to all breakout rooms')
-				: t('spreed', 'The message was sent to "{roomName}"', { roomName: this.displayName }))
-			this.$emit('close')
-		},
 
-		handleMessageFailure() {
-			showError(t('spreed', 'The message could not be sent'))
-			this.$emit('close')
+		handleSubmit(event) {
+			this.$emit('submit', event)
 		},
 	},
 
diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index caea931afbe..80740d1761d 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -217,7 +217,6 @@ import BrowserStorage from '../../services/BrowserStorage.js'
 import { getTalkConfig, hasTalkFeature } from '../../services/CapabilitiesManager.ts'
 import { EventBus } from '../../services/EventBus.ts'
 import { shareFile } from '../../services/filesSharingServices.js'
-import { useBreakoutRoomsStore } from '../../stores/breakoutRooms.ts'
 import { useChatExtrasStore } from '../../stores/chatExtras.js'
 import { useSettingsStore } from '../../stores/settings.js'
 import { fetchClipboardContent } from '../../utils/clipboard.js'
@@ -268,6 +267,15 @@ export default {
 			default: undefined,
 		},
 
+		/**
+		 * If component is used in a dialog, submit should emit an event to parent
+		 * instead of posting the message
+		 */
+		dialog: {
+			type: Boolean,
+			default: false,
+		},
+
 		/**
 		 * Broadcast messages to all breakout rooms of a given conversation.
 		 */
@@ -293,7 +301,7 @@ export default {
 		},
 	},
 
-	emits: ['sent', 'failure', 'upload'],
+	emits: ['submit', 'dismiss'],
 
 	expose: ['focusInput'],
 
@@ -303,7 +311,6 @@ export default {
 		const { autoComplete, userData } = useChatMentions(token)
 		const { createTemporaryMessage } = useTemporaryMessage()
 		return {
-			breakoutRoomsStore: useBreakoutRoomsStore(),
 			chatExtrasStore: useChatExtrasStore(),
 			settingsStore: useSettingsStore(),
 			supportTypingStatus,
@@ -682,21 +689,7 @@ export default {
 			this.debouncedUpdateChatInput.clear()
 			this.chatExtrasStore.removeChatInput(this.token)
 
-			if (this.upload) {
-				// remove Quote component
-				this.chatExtrasStore.removeParentIdToReply(this.token)
-
-				if (this.$store.getters.getInitialisedUploads(this.currentUploadId).length) {
-					// If dialog contains files to upload, delegate sending
-					this.$emit('upload', { caption: this.text, options })
-					return
-				} else {
-					// Dismiss dialog, process as normal message sending otherwise
-					this.$emit('sent')
-				}
-			}
-
-			if (this.hasText) {
+			if (this.hasText || (this.dialog && this.upload)) {
 				const temporaryMessage = this.createTemporaryMessage({
 					message: this.text.trim(),
 					token: this.token,
@@ -707,8 +700,8 @@ export default {
 				// Also remove the message to be replied for this conversation
 				this.chatExtrasStore.removeParentIdToReply(this.token)
 
-				this.broadcast
-					? await this.broadcastMessage(this.token, temporaryMessage.message)
+				this.dialog
+					? await this.submitMessage(this.token, temporaryMessage, options)
 					: await this.postMessage(this.token, temporaryMessage, options)
 				this.resetTypingIndicator()
 			}
@@ -718,20 +711,14 @@ export default {
 		async postMessage(token, temporaryMessage, options) {
 			try {
 				await this.$store.dispatch('postNewMessage', { token, temporaryMessage, options })
-				this.$emit('sent')
-			} catch {
-				this.$emit('failure')
+			} catch (e) {
+				console.error(e)
 			}
 		},
 
 		// Broadcast message to all breakout rooms
-		async broadcastMessage(token, message) {
-			try {
-				await this.breakoutRoomsStore.broadcastMessageToBreakoutRooms({ token, message })
-				this.$emit('sent')
-			} catch {
-				this.$emit('failure')
-			}
+		async submitMessage(token, temporaryMessage, options) {
+			this.$emit('submit', { token, temporaryMessage, options })
 		},
 
 		async handleSubmitSpam(numberOfMessages) {
@@ -759,7 +746,7 @@ export default {
 				// refocus input as the user might want to type further
 				this.focusInput()
 			} catch {
-				this.$emit('failure')
+				this.$emit('dismiss')
 				showError(t('spreed', 'The message could not be edited'))
 			}
 		},
diff --git a/src/components/NewMessage/NewMessageUploadEditor.vue b/src/components/NewMessage/NewMessageUploadEditor.vue
index 295e92ec873..069a94748b9 100644
--- a/src/components/NewMessage/NewMessageUploadEditor.vue
+++ b/src/components/NewMessage/NewMessageUploadEditor.vue
@@ -57,7 +57,7 @@
 				<NcButton type="tertiary" @click="handleDismiss">
 					{{ t('spreed', 'Dismiss') }}
 				</NcButton>
-				<NcButton ref="submitButton" type="primary" @click="handleUpload({ caption: null, options: null})">
+				<NcButton ref="submitButton" type="primary" @click="handleLegacyUpload">
 					{{ t('spreed', 'Send') }}
 				</NcButton>
 			</div>
@@ -66,12 +66,12 @@
 				role="region"
 				class="upload-editor__textfield"
 				upload
+				dialog
 				:token="token"
 				:container="modalContainerId"
 				:aria-label="t('spreed', 'Post message')"
-				@upload="handleUpload"
-				@sent="handleDismiss"
-				@failure="handleDismiss" />
+				@submit="handleUpload"
+				@dismiss="handleDismiss" />
 		</div>
 	</NcModal>
 </template>
@@ -190,8 +190,33 @@ export default {
 			this.$store.dispatch('discardUpload', this.currentUploadId)
 		},
 
-		handleUpload({ caption, options }) {
-			this.$store.dispatch('uploadFiles', { token: this.token, uploadId: this.currentUploadId, caption, options })
+		handleLegacyUpload() {
+			this.$store.dispatch('uploadFiles', {
+				token: this.token,
+				uploadId: this.currentUploadId,
+				caption: null,
+				options: null,
+			})
+		},
+
+		async handleUpload({ token, temporaryMessage, options }) {
+			if (this.files.length) {
+				// Create a share with optional caption
+				await this.$store.dispatch('uploadFiles', {
+					token,
+					uploadId: this.currentUploadId,
+					caption: temporaryMessage.message,
+					options,
+				})
+			} else {
+				// Proceed as a normal message
+				try {
+					await this.$store.dispatch('discardUpload', this.currentUploadId)
+					await this.$store.dispatch('postNewMessage', { token, temporaryMessage, options })
+				} catch (e) {
+					console.error(e)
+				}
+			}
 		},
 		/**
 		 * Clicks the hidden file input when clicking the correspondent NcActionButton,
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
index b701d2bc515..ec955f6370c 100644
--- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomItem.vue
@@ -46,8 +46,9 @@
 				</NcActions>
 				<!-- Send message dialog -->
 				<SendMessageDialog v-if="isDialogOpened"
-					:display-name="roomName"
+					:dialog-title="dialogTitle"
 					:token="roomToken"
+					@submit="sentMessageToRoom"
 					@close="isDialogOpened = false" />
 			</template>
 		</div>
@@ -65,7 +66,7 @@ import MenuDown from 'vue-material-design-icons/MenuDown.vue'
 import MenuRight from 'vue-material-design-icons/MenuRight.vue'
 import Send from 'vue-material-design-icons/Send.vue'
 
-import { showWarning } from '@nextcloud/dialogs'
+import { showSuccess, showWarning } from '@nextcloud/dialogs'
 import { t } from '@nextcloud/l10n'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
@@ -145,6 +146,10 @@ export default {
 			return this.isParticipantsEditor ? this.name : this.breakoutRoom?.displayName
 		},
 
+		dialogTitle() {
+			return t('spreed', 'Send a message to "{roomName}"', { roomName: this.roomName })
+		},
+
 		roomToken() {
 			return this.breakoutRoom?.token
 		},
@@ -225,6 +230,16 @@ export default {
 		toggleParticipantsVisibility() {
 			this.showParticipants = !this.showParticipants
 		},
+
+		async sentMessageToRoom({ token, temporaryMessage, options }) {
+			try {
+				await this.$store.dispatch('postNewMessage', { token, temporaryMessage, options })
+				showSuccess(t('spreed', 'The message was sent to "{roomName}"', { roomName: this.roomName }))
+				this.isDialogOpened = false
+			} catch (e) {
+				console.error(e)
+			}
+		},
 	},
 }
 </script>
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
index 84944f26d13..b829509d497 100644
--- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
@@ -105,7 +105,9 @@
 		<!-- Send message dialog -->
 		<SendMessageDialog v-if="isSendMessageDialogOpened"
 			:token="mainToken"
+			:dialog-title="t('spreed', 'Send a message to all breakout rooms')"
 			:broadcast="true"
+			@submit="broadcastMessage"
 			@close="isSendMessageDialogOpened = false" />
 	</div>
 </template>
@@ -120,6 +122,7 @@ import Cog from 'vue-material-design-icons/Cog.vue'
 import Play from 'vue-material-design-icons/Play.vue'
 import Send from 'vue-material-design-icons/Send.vue'
 
+import { showSuccess } from '@nextcloud/dialogs'
 import { t } from '@nextcloud/l10n'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
@@ -276,6 +279,12 @@ export default {
 				token: this.mainToken,
 			})
 		},
+
+		async broadcastMessage({ token, temporaryMessage, options }) {
+			await this.breakoutRoomsStore.broadcastMessageToBreakoutRooms({ token, message: temporaryMessage.message })
+			showSuccess(t('spreed', 'The message was sent to all breakout rooms'))
+			this.isSendMessageDialogOpened = false
+		}
 	},
 }
 </script>

From 3dc111745d5814c8ffe035bcedbee49d3dae83de Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Thu, 21 Nov 2024 10:46:30 +0100
Subject: [PATCH 3/3] fix: disable some features in dialog mode

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 src/components/NewMessage/NewMessage.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index 80740d1761d..b127a3ce98d 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -34,11 +34,11 @@
 
 			<!-- Input area -->
 			<div class="new-message-form__input">
-				<NewMessageAbsenceInfo v-if="!upload && userAbsence"
+				<NewMessageAbsenceInfo v-if="!dialog && userAbsence"
 					:user-absence="userAbsence"
 					:display-name="conversation.displayName" />
 
-				<NewMessageChatSummary v-if="showChatSummary" />
+				<NewMessageChatSummary v-if="!dialog && showChatSummary" />
 
 				<div class="new-message-form__emoji-picker">
 					<NcEmojiPicker v-if="!disabled"
@@ -522,6 +522,8 @@ export default {
 		text(newValue) {
 			if (this.currentUploadId && !this.upload) {
 				return
+			} else if (this.dialog && this.broadcast) {
+				return
 			}
 			this.debouncedUpdateChatInput(newValue)
 		},
@@ -953,7 +955,7 @@ export default {
 		},
 
 		handleEditLastMessage(event) {
-			if (!this.canEditMessage || this.text || this.upload || this.broadcast || this.isRecordingAudio) {
+			if (!this.canEditMessage || this.text || this.dialog || this.isRecordingAudio) {
 				return
 			}