From 31588d97281b007200a3e60bdc58b6f0368f95a9 Mon Sep 17 00:00:00 2001
From: DorraJaouad <dorra.jaoued7@gmail.com>
Date: Mon, 18 Nov 2024 19:41:21 +0100
Subject: [PATCH 1/4] fix: highlight silent toggle and keep showing it when it
 is active. maintain silentChat state across upload editor and main new
 message input

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>
---
 src/components/NewMessage/NewMessage.vue | 51 +++++++++++++++---------
 1 file changed, 33 insertions(+), 18 deletions(-)

diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index 4268937afcc..157659fee4a 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -88,6 +88,24 @@
 					@submit="handleSubmit" />
 			</div>
 
+			<!-- Silent chat -->
+			<NcActions v-if="showSilentToggle"
+				force-menu
+				:primary="silentChat">
+				<template #icon>
+					<BellOffIcon v-if="silentChat" :size="16" />
+				</template>
+				<NcActionButton close-after-click
+					:model-value="silentChat"
+					:name="silentSendLabel"
+					@click="toggleSilentChat">
+					{{ silentSendInfo }}
+					<template #icon>
+						<BellOffIcon :size="16" />
+					</template>
+				</NcActionButton>
+			</NcActions>
+
 			<!-- Audio recorder -->
 			<NewMessageAudioRecorder v-if="showAudioRecorder"
 				:disabled="disabled"
@@ -119,21 +137,6 @@
 
 			<!-- Send buttons -->
 			<template v-else>
-				<NcActions v-if="!broadcast" force-menu>
-					<template #icon>
-						<BellOffIcon v-if="silentChat" :size="16" />
-					</template>
-					<NcActionButton close-after-click
-						:model-value="silentChat"
-						:name="silentSendLabel"
-						@click="toggleSilentChat">
-						{{ silentSendInfo }}
-						<template #icon>
-							<BellOffIcon :size="16" />
-						</template>
-					</NcActionButton>
-				</NcActions>
-
 				<NcButton :disabled="disabled"
 					type="tertiary"
 					native-type="submit"
@@ -174,7 +177,7 @@
 
 <script>
 import debounce from 'debounce'
-import { toRefs } from 'vue'
+import { toRefs, ref } from 'vue'
 
 import BellOffIcon from 'vue-material-design-icons/BellOff.vue'
 import CheckIcon from 'vue-material-design-icons/Check.vue'
@@ -295,7 +298,6 @@ export default {
 		const supportTypingStatus = getTalkConfig(token.value, 'chat', 'typing-privacy') !== undefined
 		const { autoComplete, userData } = useChatMentions(token)
 		const { createTemporaryMessage } = useTemporaryMessage()
-
 		return {
 			breakoutRoomsStore: useBreakoutRoomsStore(),
 			chatExtrasStore: useChatExtrasStore(),
@@ -433,6 +435,10 @@ export default {
 				: t('spreed', 'Participants will not be notified about new messages')
 		},
 
+		showSilentToggle() {
+			return !this.broadcast && !this.isRecordingAudio && !this.messageToEdit
+		},
+
 		showAttachmentsMenu() {
 			return (this.canUploadFiles || this.canShareFiles || this.canCreatePoll) && !this.broadcast && !this.upload && !this.messageToEdit
 		},
@@ -492,6 +498,8 @@ export default {
 				// reset or fill main input in chat view from the store
 				this.text = this.chatInput
 			}
+			// update the silent chat state
+			this.silentChat = BrowserStorage.getItem('silentChat_' + this.token)
 		},
 
 		text(newValue) {
@@ -538,8 +546,8 @@ export default {
 					this.text = ''
 				}
 				this.clearTypingInterval()
-
 				this.checkAbsenceStatus()
+				this.clearSilentState()
 			}
 		},
 	},
@@ -1003,6 +1011,13 @@ export default {
 				BrowserStorage.removeItem('silentChat_' + this.token)
 			}
 		},
+
+		clearSilentState() {
+			// FIXME text that is only one line should be cleared in upstream
+			if ((this.text === '' || this.text === '\n') && this.silentChat && !this.upload) {
+				this.toggleSilentChat()
+			}
+		}
 	},
 }
 </script>

From d280602d7b6b7e6497e65d41480fa013eeb7ab28 Mon Sep 17 00:00:00 2001
From: DorraJaouad <dorra.jaoued7@gmail.com>
Date: Mon, 18 Nov 2024 19:43:43 +0100
Subject: [PATCH 2/4] feat: show silent message icon in other people messages

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>
---
 .../MessagesList/MessagesGroup/Message/Message.vue     |  2 ++
 .../MessagesGroup/Message/MessagePart/MessageBody.vue  | 10 +++++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue
index 69e9a71d415..71d247201bd 100644
--- a/src/components/MessagesList/MessagesGroup/Message/Message.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue
@@ -332,6 +332,8 @@ export default {
 				commonReadIconTitle: t('spreed', 'Message read by everyone who shares their reading status'),
 				showSentIcon: this.showSentIcon,
 				sentIconTitle: t('spreed', 'Message sent'),
+				showSilentIcon: this.message.silent,
+				silentIconTitle: t('spreed', 'Sent without notification'),
 			}
 		},
 
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
index e16137554a3..22e161af717 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
@@ -109,6 +109,12 @@
 				:aria-label="readInfo.sentIconTitle">
 				<CheckIcon :size="16" />
 			</div>
+			<div v-else-if="readInfo.showSilentIcon"
+				:title="readInfo.silentIconTitle"
+				class="message-status"
+				:aria-label="readInfo.silentIconTitle">
+				<IconBellOff :size="16" />
+			</div>
 		</div>
 
 		<!-- Reactions slot -->
@@ -119,9 +125,10 @@
 <script>
 import { vIntersectionObserver as IntersectionObserver, vElementSize as ElementSize } from '@vueuse/components'
 import emojiRegex from 'emoji-regex'
-import { toRefs, ref } from 'vue'
+import { toRefs } from 'vue'
 
 import AlertCircleIcon from 'vue-material-design-icons/AlertCircle.vue'
+import IconBellOff from 'vue-material-design-icons/BellOff.vue'
 import CancelIcon from 'vue-material-design-icons/Cancel.vue'
 import CheckIcon from 'vue-material-design-icons/Check.vue'
 import CheckAllIcon from 'vue-material-design-icons/CheckAll.vue'
@@ -159,6 +166,7 @@ export default {
 		Quote,
 		// Icons
 		AlertCircleIcon,
+		IconBellOff,
 		CancelIcon,
 		CheckIcon,
 		CheckAllIcon,

From e2b62e22d9663b3a42ed543e9595a30da18a7768 Mon Sep 17 00:00:00 2001
From: DorraJaouad <dorra.jaoued7@gmail.com>
Date: Mon, 18 Nov 2024 19:44:00 +0100
Subject: [PATCH 3/4] feat: show silent message hint

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>
---
 .../Message/MessageButtonsBar/MessageButtonsBar.vue      | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
index 197f2538af7..e474bc49da0 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
@@ -57,6 +57,13 @@
 						</template>
 						{{ editedDateTime }}
 					</NcActionText>
+					<!-- Silent message information -->
+					<NcActionText v-if="readInfo.showSilentIcon">
+						<template #icon>
+							<IconBellOff :size="16" />
+						</template>
+						{{ readInfo.silentIconTitle }}
+					</NcActionText>
 					<NcActionSeparator />
 
 					<NcActionButton v-if="supportReminders"
@@ -260,6 +267,7 @@ import { toRefs } from 'vue'
 import AccountIcon from 'vue-material-design-icons/Account.vue'
 import AlarmIcon from 'vue-material-design-icons/Alarm.vue'
 import ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
+import IconBellOff from 'vue-material-design-icons/BellOff.vue'
 import CalendarClock from 'vue-material-design-icons/CalendarClock.vue'
 import Check from 'vue-material-design-icons/Check.vue'
 import CheckAll from 'vue-material-design-icons/CheckAll.vue'
@@ -321,6 +329,7 @@ export default {
 		AccountIcon,
 		AlarmIcon,
 		ArrowLeft,
+		IconBellOff,
 		CalendarClock,
 		CloseCircleOutline,
 		Check,

From 5fe1f9ccf13d336e40822e675ecffb1b8c9c46ab Mon Sep 17 00:00:00 2001
From: DorraJaouad <dorra.jaoued7@gmail.com>
Date: Mon, 18 Nov 2024 19:57:36 +0100
Subject: [PATCH 4/4] fix: change the placeholder when silent message is on

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>
---
 src/components/NewMessage/NewMessage.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
index 157659fee4a..1f8ee687fd1 100644
--- a/src/components/NewMessage/NewMessage.vue
+++ b/src/components/NewMessage/NewMessage.vue
@@ -356,6 +356,8 @@ export default {
 				return t('spreed', 'No permission to post messages in this conversation')
 			} else if (!this.currentConversationIsJoined) {
 				return t('spreed', 'Joining conversation …')
+			} else if (this.silentChat) {
+				return t('spreed', 'Write a message without notification')
 			} else {
 				// Use the default placeholder
 				return undefined