From 94714688faff1d75cbd5005fbead31813ba127ae Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Mon, 4 Mar 2024 14:47:34 +0100
Subject: [PATCH 1/3] feat(MediaSettings): remember silent call per
 conversation

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../MediaSettings/MediaSettings.vue           | 55 ++++++++++---------
 src/components/TopBar/CallButton.vue          |  3 +
 2 files changed, 33 insertions(+), 25 deletions(-)

diff --git a/src/components/MediaSettings/MediaSettings.vue b/src/components/MediaSettings/MediaSettings.vue
index 69bbb79b366..a3c7a21ccab 100644
--- a/src/components/MediaSettings/MediaSettings.vue
+++ b/src/components/MediaSettings/MediaSettings.vue
@@ -160,32 +160,27 @@
 			<!-- buttons bar at the bottom -->
 			<div class="media-settings__call-buttons">
 				<!-- Silent call -->
-				<NcActions v-if="showSilentCallOption"
-					:container="container"
-					:force-menu="true">
-					<template v-if="!silentCall">
-						<NcActionButton :close-after-click="true"
-							icon="icon-upload"
-							:name="t('spreed', 'Call without notification')"
-							@click="silentCall= true">
-							{{ t('spreed', 'The conversation participants will not be notified about this call') }}
-							<template #icon>
-								<BellOff :size="16" />
-							</template>
-						</NcActionButton>
-					</template>
-					<template v-else>
-						<NcActionButton :close-after-click="true"
-							icon="icon-upload"
-							:name="t('spreed', 'Normal call')"
-							@click="silentCall= false">
-							{{ t('spreed', 'The conversation participants will be notified about this call') }}
-							<template #icon>
-								<Bell :size="16" />
-							</template>
-						</NcActionButton>
-					</template>
+				<NcActions v-if="showSilentCallOption" :container="container" force-menu>
+					<NcActionButton v-if="!silentCall"
+						:name="t('spreed', 'Call without notification')"
+						close-after-click
+						@click="setSilentCall(true)">
+						{{ t('spreed', 'The conversation participants will not be notified about this call') }}
+						<template #icon>
+							<BellOff :size="16" />
+						</template>
+					</NcActionButton>
+					<NcActionButton v-else
+						:name="t('spreed', 'Normal call')"
+						close-after-click
+						@click="setSilentCall(false)">
+						<template #icon>
+							<Bell :size="16" />
+						</template>
+						{{ t('spreed', 'The conversation participants will be notified about this call') }}
+					</NcActionButton>
 				</NcActions>
+
 				<!-- Join call -->
 				<CallButton v-if="!isInCall"
 					class="call-button"
@@ -448,6 +443,7 @@ export default {
 			if (newValue) {
 				this.audioOn = !BrowserStorage.getItem('audioDisabled_' + this.token)
 				this.videoOn = !BrowserStorage.getItem('videoDisabled_' + this.token)
+				this.silentCall = !!BrowserStorage.getItem('silentCall_' + this.token)
 
 				// Set virtual background depending on BrowserStorage's settings
 				if (BrowserStorage.getItem('virtualBackgroundEnabled_' + this.token) === 'true') {
@@ -535,6 +531,15 @@ export default {
 			this.videoDeviceStateChanged = !this.videoDeviceStateChanged
 		},
 
+		setSilentCall(value) {
+			this.silentCall = value
+			if (value) {
+				BrowserStorage.setItem('silentCall_' + this.token, 'true')
+			} else {
+				BrowserStorage.removeItem('silentCall_' + this.token)
+			}
+		},
+
 		closeModalAndApplySettings() {
 			if (this.updatedBackground) {
 				this.handleUpdateBackground(this.updatedBackground)
diff --git a/src/components/TopBar/CallButton.vue b/src/components/TopBar/CallButton.vue
index b9a1f156780..d2441b89ecc 100644
--- a/src/components/TopBar/CallButton.vue
+++ b/src/components/TopBar/CallButton.vue
@@ -35,6 +35,7 @@
 			@click="handleClick">
 			<template #icon>
 				<PhoneIcon v-if="isPhoneRoom" :size="20" />
+				<VideoOutlineIcon v-else-if="silentCall" :size="20" />
 				<VideoIcon v-else :size="20" />
 			</template>
 			{{ startCallLabel }}
@@ -99,6 +100,7 @@ import PhoneHangup from 'vue-material-design-icons/PhoneHangup.vue'
 import VideoIcon from 'vue-material-design-icons/Video.vue'
 import VideoBoxOff from 'vue-material-design-icons/VideoBoxOff.vue'
 import VideoOff from 'vue-material-design-icons/VideoOff.vue'
+import VideoOutlineIcon from 'vue-material-design-icons/VideoOutline.vue'
 
 import { showError } from '@nextcloud/dialogs'
 import { emit } from '@nextcloud/event-bus'
@@ -135,6 +137,7 @@ export default {
 		VideoBoxOff,
 		VideoIcon,
 		VideoOff,
+		VideoOutlineIcon,
 	},
 
 	props: {

From 8084f29a5c089d51c9dcb5caf19b212e11bb7744 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Mon, 4 Mar 2024 15:28:51 +0100
Subject: [PATCH 2/3] feat(NewMessage): remember silent chat per conversation

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

diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index eb1c18b5b29..93e8ebc749e 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -108,7 +108,7 @@
 					@tribute-active-false.native="isTributePickerActive = false"
 					@input="handleTyping"
 					@paste="handlePastedFiles"
-					@submit="handleSubmit({ silent: false })" />
+					@submit="handleSubmit" />
 			</div>
 
 			<!-- Audio recorder -->
@@ -142,29 +142,27 @@
 
 			<!-- Send buttons -->
 			<template v-else>
-				<NcActions v-if="!broadcast"
-					:container="container"
-					force-menu>
-					<!-- Silent send -->
+				<NcActions v-if="!broadcast" :container="container" force-menu>
 					<NcActionButton close-after-click
-						icon="icon-upload"
-						:name="t('spreed', 'Send without notification')"
-						@click="handleSubmit({ silent: true })">
+						:name="silentSendLabel"
+						@click="toggleSilentChat">
 						{{ silentSendInfo }}
 						<template #icon>
-							<BellOff :size="16" />
+							<BellIcon v-if="silentChat" :size="16" />
+							<BellOffIcon v-else :size="16" />
 						</template>
 					</NcActionButton>
 				</NcActions>
-				<!-- Send -->
+
 				<NcButton :disabled="disabled"
 					type="tertiary"
 					native-type="submit"
-					:title="t('spreed', 'Send message')"
-					:aria-label="t('spreed', 'Send message')"
-					@click="handleSubmit({ silent: false })">
+					:title="sendMessageLabel"
+					:aria-label="sendMessageLabel"
+					@click="handleSubmit">
 					<template #icon>
-						<Send :size="16" />
+						<SendVariantOutlineIcon v-if="silentChat" :size="18" />
+						<SendIcon v-else :size="16" />
 					</template>
 				</NcButton>
 			</template>
@@ -194,11 +192,13 @@
 <script>
 import debounce from 'debounce'
 
-import BellOff from 'vue-material-design-icons/BellOff.vue'
+import BellIcon from 'vue-material-design-icons/Bell.vue'
+import BellOffIcon from 'vue-material-design-icons/BellOff.vue'
 import CheckIcon from 'vue-material-design-icons/Check.vue'
 import CloseIcon from 'vue-material-design-icons/Close.vue'
 import EmoticonOutline from 'vue-material-design-icons/EmoticonOutline.vue'
-import Send from 'vue-material-design-icons/Send.vue'
+import SendIcon from 'vue-material-design-icons/Send.vue'
+import SendVariantOutlineIcon from 'vue-material-design-icons/SendVariantOutline.vue'
 
 import { getCapabilities } from '@nextcloud/capabilities'
 import { showError } from '@nextcloud/dialogs'
@@ -222,6 +222,7 @@ import Quote from '../Quote.vue'
 
 import { ATTENDEE, CONVERSATION, PARTICIPANT, PRIVACY } from '../../constants.js'
 import { getConversationAvatarOcsUrl, getUserProxyAvatarOcsUrl } from '../../services/avatarService'
+import BrowserStorage from '../../services/BrowserStorage.js'
 import { EventBus } from '../../services/EventBus.js'
 import { shareFile } from '../../services/filesSharingServices.js'
 import { searchPossibleMentions } from '../../services/mentionsService.js'
@@ -256,11 +257,13 @@ export default {
 		NewMessageTypingIndicator,
 		Quote,
 		// Icons
-		BellOff,
+		BellIcon,
+		BellOffIcon,
 		CheckIcon,
 		CloseIcon,
 		EmoticonOutline,
-		Send,
+		SendIcon,
+		SendVariantOutlineIcon,
 	},
 
 	props: {
@@ -324,7 +327,7 @@ export default {
 	data() {
 		return {
 			text: '',
-			conversationIsFirstInList: false,
+			silentChat: false,
 			// True when the audio recorder component is recording
 			isRecordingAudio: false,
 			showPollEditor: false,
@@ -380,6 +383,14 @@ export default {
 			}
 		},
 
+		sendMessageLabel() {
+			if (this.silentChat) {
+				return t('spreed', 'Send message silently')
+			} else {
+				return t('spreed', 'Send message')
+			}
+		},
+
 		parentMessage() {
 			const parentId = this.chatExtrasStore.getParentIdToReply(this.token)
 			return parentId && this.$store.getters.message(this.token, parentId)
@@ -426,11 +437,21 @@ export default {
 				|| this.conversation.type === CONVERSATION.TYPE.ONE_TO_ONE_FORMER
 		},
 
+		silentSendLabel() {
+			return this.silentChat
+				? t('spreed', 'Send with notification')
+				: t('spreed', 'Send without notification')
+		},
+
 		silentSendInfo() {
 			if (this.isOneToOne) {
-				return t('spreed', 'The participant will not be notified about this message')
+				return this.silentChat
+					? t('spreed', 'The participant will be notified about new messages')
+					: t('spreed', 'The participant will not be notified about new messages')
 			} else {
-				return t('spreed', 'The participants will not be notified about this message')
+				return this.silentChat
+					? t('spreed', 'Participants will be notified about new messages')
+					: t('spreed', 'Participants will not be notified about new messages')
 			}
 		},
 
@@ -514,6 +535,7 @@ export default {
 					this.text = this.messageToEdit
 						? this.chatEditInput
 						: this.chatInput
+					this.silentChat = !!BrowserStorage.getItem('silentChat_' + this.token)
 				} else {
 					this.text = ''
 				}
@@ -604,13 +626,7 @@ export default {
 			})
 		},
 
-		/**
-		 * Sends the new message
-		 *
-		 * @param {object} options the submit options
-		 * @param {boolean} options.silent whether the message should trigger notifications
-		 */
-		async handleSubmit(options) {
+		async handleSubmit() {
 			// Submit event has enter key listener
 			// Handle edit here too
 			if (this.messageToEdit) {
@@ -629,6 +645,8 @@ export default {
 				}
 			}
 
+			const options = { silent: this.silentChat }
+
 			if (this.hasText) {
 				this.text = parseSpecialSymbols(this.text)
 			}
@@ -698,7 +716,7 @@ export default {
 
 				const loremIpsum = 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n\nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.'
 				this.text = loremIpsum.slice(0, 25 + randomNumber)
-				await this.handleSubmit({ silent: false })
+				await this.handleSubmit()
 			}
 		},
 
@@ -994,6 +1012,15 @@ export default {
 		handleAbortEdit() {
 			this.chatExtrasStore.removeMessageIdToEdit(this.token)
 		},
+
+		toggleSilentChat() {
+			this.silentChat = !this.silentChat
+			if (this.silentChat) {
+				BrowserStorage.setItem('silentChat_' + this.token, 'true')
+			} else {
+				BrowserStorage.removeItem('silentChat_' + this.token)
+			}
+		},
 	},
 }
 </script>

From 4deb3905c1a6683ff4cb9b542996e6c8c9027611 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Fri, 8 Mar 2024 11:19:26 +0100
Subject: [PATCH 3/3] chore(typescript): set avatarService extension explicitly

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 src/components/AvatarWrapper/AvatarWrapper.vue                  | 2 +-
 .../MessagesList/MessagesGroup/Message/MessagePart/Mention.vue  | 2 +-
 src/components/NewMessage/NewMessage.vue                        | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/AvatarWrapper/AvatarWrapper.vue b/src/components/AvatarWrapper/AvatarWrapper.vue
index 8e27a996f10..af592583672 100644
--- a/src/components/AvatarWrapper/AvatarWrapper.vue
+++ b/src/components/AvatarWrapper/AvatarWrapper.vue
@@ -54,7 +54,7 @@
 import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
 
 import { ATTENDEE, AVATAR } from '../../constants.js'
-import { getUserProxyAvatarOcsUrl } from '../../services/avatarService'
+import { getUserProxyAvatarOcsUrl } from '../../services/avatarService.ts'
 import { isDarkTheme } from '../../utils/isDarkTheme'
 
 export default {
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/Mention.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/Mention.vue
index b85790ce3aa..9fce6253e26 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/Mention.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/Mention.vue
@@ -35,7 +35,7 @@ import { loadState } from '@nextcloud/initial-state'
 
 import NcUserBubble from '@nextcloud/vue/dist/Components/NcUserBubble.js'
 
-import { getConversationAvatarOcsUrl, getUserProxyAvatarOcsUrl } from '../../../../../services/avatarService'
+import { getConversationAvatarOcsUrl, getUserProxyAvatarOcsUrl } from '../../../../../services/avatarService.ts'
 import { isDarkTheme } from '../../../../../utils/isDarkTheme.js'
 
 export default {
diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index 93e8ebc749e..d8727e3cbe4 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -221,7 +221,7 @@ import NewMessageTypingIndicator from './NewMessageTypingIndicator.vue'
 import Quote from '../Quote.vue'
 
 import { ATTENDEE, CONVERSATION, PARTICIPANT, PRIVACY } from '../../constants.js'
-import { getConversationAvatarOcsUrl, getUserProxyAvatarOcsUrl } from '../../services/avatarService'
+import { getConversationAvatarOcsUrl, getUserProxyAvatarOcsUrl } from '../../services/avatarService.ts'
 import BrowserStorage from '../../services/BrowserStorage.js'
 import { EventBus } from '../../services/EventBus.js'
 import { shareFile } from '../../services/filesSharingServices.js'