From 75e13a77ef51bc45c760eb972286cd5b3594ab9f Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Tue, 1 Oct 2024 09:42:43 +0200
Subject: [PATCH] fix: rename *Tooltip to *Title

- get rid of object fields reassigning in TopBarMediaControls

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 src/components/CallView/Grid/Grid.vue         |  5 +-
 .../CallView/shared/VideoBottomBar.vue        | 12 +--
 .../MessagesGroup/Message/Message.vue         |  4 +-
 .../MessageButtonsBar.spec.js                 |  4 +-
 .../MessageButtonsBar/MessageButtonsBar.vue   |  8 +-
 .../Message/MessagePart/MessageBody.vue       | 22 ++---
 .../NewMessage/NewMessageAudioRecorder.vue    | 18 ++--
 src/components/TopBar/TopBarMediaControls.vue | 83 +++++++++++--------
 8 files changed, 87 insertions(+), 69 deletions(-)

diff --git a/src/components/CallView/Grid/Grid.vue b/src/components/CallView/Grid/Grid.vue
index 9c9c39f17a9..628e669709c 100644
--- a/src/components/CallView/Grid/Grid.vue
+++ b/src/components/CallView/Grid/Grid.vue
@@ -8,7 +8,8 @@
 		<NcButton v-if="isStripe && !isRecording"
 			class="stripe--collapse"
 			type="tertiary-no-background"
-			:aria-label="stripeButtonTooltip"
+			:title="stripeButtonTitle"
+			:aria-label="stripeButtonTitle"
 			@click="handleClickStripeCollapse">
 			<template #icon>
 				<ChevronDown v-if="stripeOpen"
@@ -278,7 +279,7 @@ export default {
 	},
 
 	computed: {
-		stripeButtonTooltip() {
+		stripeButtonTitle() {
 			if (this.stripeOpen) {
 				return t('spreed', 'Collapse stripe')
 			} else {
diff --git a/src/components/CallView/shared/VideoBottomBar.vue b/src/components/CallView/shared/VideoBottomBar.vue
index ff438aceacb..64c59722dcc 100644
--- a/src/components/CallView/shared/VideoBottomBar.vue
+++ b/src/components/CallView/shared/VideoBottomBar.vue
@@ -33,8 +33,8 @@
 				group>
 				<NcButton v-if="showAudioIndicator"
 					key="audioIndicator"
-					:title="audioButtonTooltip"
-					:aria-label="audioButtonTooltip"
+					:title="audioButtonTitle"
+					:aria-label="audioButtonTitle"
 					class="audioIndicator"
 					type="tertiary-no-background"
 					:disabled="isAudioButtonDisabled"
@@ -47,8 +47,8 @@
 
 				<NcButton v-if="showVideoIndicator"
 					key="videoIndicator"
-					:title="videoButtonTooltip"
-					:aria-label="videoButtonTooltip"
+					:title="videoButtonTitle"
+					:aria-label="videoButtonTitle"
 					class="videoIndicator"
 					type="tertiary-no-background"
 					@click.stop="toggleVideo">
@@ -205,7 +205,7 @@ export default {
 		isAudioButtonDisabled() {
 			return !this.model.attributes.audioAvailable || !this.canFullModerate
 		},
-		audioButtonTooltip() {
+		audioButtonTitle() {
 			return this.model.attributes.audioAvailable
 				? t('spreed', 'Mute')
 				: t('spreed', 'Muted')
@@ -221,7 +221,7 @@ export default {
 		isRemoteVideoBlocked() {
 			return this.sharedData.remoteVideoBlocker && !this.sharedData.remoteVideoBlocker.isVideoEnabled()
 		},
-		videoButtonTooltip() {
+		videoButtonTitle() {
 			return this.isRemoteVideoEnabled
 				? t('spreed', 'Disable video')
 				: t('spreed', 'Enable video')
diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue
index 13a2c2a3e2b..4f3bb71d20c 100644
--- a/src/components/MessagesList/MessagesGroup/Message/Message.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue
@@ -330,9 +330,9 @@ export default {
 		readInfo() {
 			return {
 				showCommonReadIcon: this.showCommonReadIcon,
-				commonReadIconTooltip: t('spreed', 'Message read by everyone who shares their reading status'),
+				commonReadIconTitle: t('spreed', 'Message read by everyone who shares their reading status'),
 				showSentIcon: this.showSentIcon,
-				sentIconTooltip: t('spreed', 'Message sent'),
+				sentIconTitle: t('spreed', 'Message sent'),
 			}
 		},
 
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.spec.js b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.spec.js
index 5119c12c838..94fabac0331 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.spec.js
+++ b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.spec.js
@@ -81,8 +81,8 @@ describe('MessageButtonsBar.vue', () => {
 			readInfo: {
 				showCommonReadIcon: true,
 				showSentIcon: true,
-				commonReadIconTooltip: '',
-				sentIconTooltip: '',
+				commonReadIconTitle: '',
+				sentIconTitle: '',
 			},
 			isTranslationAvailable: false,
 		}
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
index 1e11bb24ae1..ea5e7f050dc 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
@@ -35,13 +35,13 @@
 					<NcActionText>
 						<template #icon>
 							<span v-if="readInfo.showCommonReadIcon"
-								:title="readInfo.commonReadIconTooltip"
-								:aria-label="readInfo.commonReadIconTooltip">
+								:title="readInfo.commonReadIconTitle"
+								:aria-label="readInfo.commonReadIconTitle">
 								<CheckAll :size="16" />
 							</span>
 							<span v-else-if="readInfo.showSentIcon"
-								:title="readInfo.sentIconTooltip"
-								:aria-label="readInfo.sentIconTooltip">
+								:title="readInfo.sentIconTitle"
+								:aria-label="readInfo.sentIconTitle">
 								<Check :size="16" />
 							</span>
 							<ClockOutline v-else :size="16" />
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
index 3d627dde54d..574c6471c72 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/MessageBody.vue
@@ -73,10 +73,10 @@
 
 			<!-- Message delivery status indicators -->
 			<div v-if="message.sendingFailure"
-				:title="sendingErrorIconTooltip"
+				:title="sendingErrorIconTitle"
 				class="message-status sending-failed"
 				:class="{'retry-option': sendingErrorCanRetry}"
-				:aria-label="sendingErrorIconTooltip"
+				:aria-label="sendingErrorIconTitle"
 				tabindex="0"
 				@mouseover="showReloadButton = true"
 				@focus="showReloadButton = true"
@@ -84,7 +84,7 @@
 				@blur="showReloadButton = false">
 				<NcButton v-if="sendingErrorCanRetry && showReloadButton"
 					size="small"
-					:aria-label="sendingErrorIconTooltip"
+					:aria-label="sendingErrorIconTitle"
 					@click="handleRetry">
 					<template #icon>
 						<ReloadIcon :size="16" />
@@ -93,19 +93,19 @@
 				<AlertCircleIcon v-else :size="16" />
 			</div>
 			<div v-else-if="showLoadingIcon"
-				:title="loadingIconTooltip"
+				:title="loadingIconTitle"
 				class="icon-loading-small message-status"
-				:aria-label="loadingIconTooltip" />
+				:aria-label="loadingIconTitle" />
 			<div v-else-if="readInfo.showCommonReadIcon"
-				:title="readInfo.commonReadIconTooltip"
+				:title="readInfo.commonReadIconTitle"
 				class="message-status"
-				:aria-label="readInfo.commonReadIconTooltip">
+				:aria-label="readInfo.commonReadIconTitle">
 				<CheckAllIcon :size="16" />
 			</div>
 			<div v-else-if="readInfo.showSentIcon"
-				:title="readInfo.sentIconTooltip"
+				:title="readInfo.sentIconTitle"
 				class="message-status"
-				:aria-label="readInfo.sentIconTooltip">
+				:aria-label="readInfo.sentIconTitle">
 				<CheckIcon :size="16" />
 			</div>
 		</div>
@@ -289,7 +289,7 @@ export default {
 			return this.isTemporary || this.isDeleting || this.isEditing
 		},
 
-		loadingIconTooltip() {
+		loadingIconTitle() {
 			return t('spreed', 'Sending message')
 		},
 
@@ -297,7 +297,7 @@ export default {
 			return ['timeout', 'other', 'failed-upload'].includes(this.message.sendingFailure)
 		},
 
-		sendingErrorIconTooltip() {
+		sendingErrorIconTitle() {
 			if (this.sendingErrorCanRetry) {
 				return t('spreed', 'Failed to send the message. Click to try again')
 			}
diff --git a/src/components/NewMessage/NewMessageAudioRecorder.vue b/src/components/NewMessage/NewMessageAudioRecorder.vue
index 35435f0159e..13a87cf1a04 100644
--- a/src/components/NewMessage/NewMessageAudioRecorder.vue
+++ b/src/components/NewMessage/NewMessageAudioRecorder.vue
@@ -6,8 +6,8 @@
 <template>
 	<div class="audio-recorder">
 		<NcButton v-if="!isRecording"
-			:title="startRecordingTooltip"
-			:aria-label="startRecordingTooltip"
+			:title="startRecordingTitle"
+			:aria-label="startRecordingTitle"
 			type="tertiary"
 			:disabled="!canStartRecording"
 			@click="start">
@@ -17,8 +17,8 @@
 		</NcButton>
 		<div v-else class="wrapper">
 			<NcButton type="error"
-				:title="abortRecordingTooltip"
-				:aria-label="abortRecordingTooltip"
+				:title="abortRecordingTitle"
+				:aria-label="abortRecordingTitle"
 				@click="abortRecording">
 				<template #icon>
 					<Close :size="16" />
@@ -30,8 +30,8 @@
 					{{ parsedRecordTime }}</span>
 			</div>
 			<NcButton type="success"
-				:title="stopRecordingTooltip"
-				:aria-label="stopRecordingTooltip"
+				:title="stopRecordingTitle"
+				:aria-label="stopRecordingTitle"
 				:class="{'audio-recorder__trigger--recording': isRecording}"
 				@click="stop">
 				<template #icon>
@@ -113,15 +113,15 @@ export default {
 			return `${minutes}:${seconds}`
 		},
 
-		startRecordingTooltip() {
+		startRecordingTitle() {
 			return t('spreed', 'Record voice message')
 		},
 
-		stopRecordingTooltip() {
+		stopRecordingTitle() {
 			return t('spreed', 'End recording and send')
 		},
 
-		abortRecordingTooltip() {
+		abortRecordingTitle() {
 			return t('spreed', 'Dismiss recording')
 		},
 
diff --git a/src/components/TopBar/TopBarMediaControls.vue b/src/components/TopBar/TopBarMediaControls.vue
index fdf1e2490a9..f7d812a9e82 100644
--- a/src/components/TopBar/TopBarMediaControls.vue
+++ b/src/components/TopBar/TopBarMediaControls.vue
@@ -320,50 +320,67 @@ export default {
 
 			const virtualBackgroundEnabled = this.isVirtualBackgroundAvailable && this.model.attributes.virtualBackgroundEnabled
 
-			const tooltip = {}
 			if (!this.model.attributes.audioEnabled && this.model.attributes.videoEnabled && virtualBackgroundEnabled && this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen. To improve the situation try to disable the background blur or your video while doing a screen share.')
-				tooltip.actionLabel = t('spreed', 'Disable background blur')
-				tooltip.action = 'disableVirtualBackground'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen. To improve the situation try to disable the background blur or your video while doing a screen share.'),
+					actionLabel: t('spreed', 'Disable background blur'),
+					action: 'disableVirtualBackground',
+				}
 			} else if (!this.model.attributes.audioEnabled && this.model.attributes.videoEnabled && this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen. To improve the situation try to disable your video while doing a screenshare.')
-				tooltip.actionLabel = t('spreed', 'Disable video')
-				tooltip.action = 'disableVideo'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen. To improve the situation try to disable your video while doing a screenshare.'),
+					actionLabel: t('spreed', 'Disable video'),
+					action: 'disableVideo',
+				}
 			} else if (!this.model.attributes.audioEnabled && this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen.')
-				tooltip.actionLabel = ''
-				tooltip.action = ''
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see your screen.'),
+					actionLabel: '',
+					action: '',
+				}
 			} else if (!this.model.attributes.audioEnabled && this.model.attributes.videoEnabled) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see you.')
-				tooltip.actionLabel = ''
-				tooltip.action = ''
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to see you.'),
+					actionLabel: '',
+					action: '',
+				}
 			} else if (this.model.attributes.videoEnabled && virtualBackgroundEnabled && this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable the background blur or your video while doing a screenshare.')
-				tooltip.actionLabel = t('spreed', 'Disable background blur')
-				tooltip.action = 'disableVirtualBackground'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable the background blur or your video while doing a screenshare.'),
+					actionLabel: t('spreed', 'Disable background blur'),
+					action: 'disableVirtualBackground',
+				}
 			} else if (this.model.attributes.videoEnabled && this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable your video while doing a screenshare.')
-				tooltip.actionLabel = t('spreed', 'Disable video')
-				tooltip.action = 'disableVideo'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable your video while doing a screenshare.'),
+					actionLabel: t('spreed', 'Disable video'),
+					action: 'disableVideo',
+				}
 			} else if (this.model.attributes.localScreen) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand you and see your screen. To improve the situation try to disable your screenshare.')
-				tooltip.actionLabel = t('spreed', 'Disable screenshare')
-				tooltip.action = 'disableScreenShare'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand you and see your screen. To improve the situation try to disable your screenshare.'),
+					actionLabel: t('spreed', 'Disable screenshare'),
+					action: 'disableScreenShare',
+				}
 			} else if (this.model.attributes.videoEnabled && virtualBackgroundEnabled) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable the background blur or your video.')
-				tooltip.actionLabel = t('spreed', 'Disable background blur')
-				tooltip.action = 'disableVirtualBackground'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable the background blur or your video.'),
+					actionLabel: t('spreed', 'Disable background blur'),
+					action: 'disableVirtualBackground',
+				}
 			} else if (this.model.attributes.videoEnabled) {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable your video.')
-				tooltip.actionLabel = t('spreed', 'Disable video')
-				tooltip.action = 'disableVideo'
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand and see you. To improve the situation try to disable your video.'),
+					actionLabel: t('spreed', 'Disable video'),
+					action: 'disableVideo',
+				}
 			} else {
-				tooltip.content = t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand you.')
-				tooltip.actionLabel = ''
-				tooltip.action = ''
+				return {
+					content: t('spreed', 'Your internet connection or computer are busy and other participants might be unable to understand you.'),
+					actionLabel: '',
+					action: '',
+				}
 			}
-
-			return tooltip
 		},
 	},