Merge pull request #19105 from nextcloud/backport/19098/stable35

[stable35] fix: hide participants tab in changelog, restore icons title

Author: Antreesy

src/components/AdminSettings/StunServer.vue

@@ -21,11 +21,12 @@
 				labelOutside />
 		</div>
 
-		<IconAlertCircleOutline
+		<span
 			v-show="!isValidServer"
 			class="stun-server__alert"
-			:title="t('spreed', 'The server address is invalid')"
-			fillColor="var(--color-border-error)" />
+			:title="t('spreed', 'The server address is invalid')">
+			<IconAlertCircleOutline fillColor="var(--color-border-error)" />
+		</span>
 
 		<NcButton
 			v-show="!loading"
@@ -135,6 +136,9 @@ export default {
 	}
 
 	&__alert {
+		display: flex;
+		align-items: center;
+		justify-content: center;
 		width: var(--default-clickable-area);
 		height: var(--default-clickable-area);
 	}

src/components/MediaSettings/MediaDevicesSelector.vue

@@ -105,7 +105,6 @@ function updateDeviceId(deviceId: NcSelectOption['id']) {
 		<component
 			:is="deviceIcon"
 			class="media-devices-selector__icon"
-			title=""
 			:size="20" />
 
 		<NcSelect

src/components/RightSidebar/Participants/Participant.spec.js

@@ -182,9 +182,9 @@ describe('ParticipantItem.vue', () => {
 			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.EMAILS, PARTICIPANT.TYPE.GUEST, 'Alice(guest)'],
 			['', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST, 'Guest(guest)'],
 			// The role is rendered as an icon, its accessible name is part of the text content
-			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.OWNER, 'AliceOwner'],
-			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.MODERATOR, 'AliceModerator'],
-			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST_MODERATOR, 'AliceModerator(guest)'],
+			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.OWNER, 'Alice'],
+			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.MODERATOR, 'Alice'],
+			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST_MODERATOR, 'Alice(guest)'],
 			['Bot', ATTENDEE.BRIDGE_BOT_ID, ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.USER, 'Bot(bot)'],
 		]
 
@@ -194,9 +194,9 @@ describe('ParticipantItem.vue', () => {
 			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.EMAILS, PARTICIPANT.TYPE.GUEST, 'Alice(guest)(in the lobby)'],
 			['', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST, 'Guest(guest)(in the lobby)'],
 			// Owners and moderators can skip the lobby, so they get no lobby badge
-			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.OWNER, 'AliceOwner'],
-			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.MODERATOR, 'AliceModerator'],
-			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST_MODERATOR, 'AliceModerator(guest)'],
+			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.OWNER, 'Alice'],
+			['Alice', 'alice', ATTENDEE.ACTOR_TYPE.USERS, PARTICIPANT.TYPE.MODERATOR, 'Alice'],
+			['Alice', 'guest-id', ATTENDEE.ACTOR_TYPE.GUESTS, PARTICIPANT.TYPE.GUEST_MODERATOR, 'Alice(guest)'],
 		]
 
 		it.each([

src/components/RightSidebar/Participants/ParticipantItem.vue

@@ -32,16 +32,13 @@
 			<!-- First line: participant's name and type -->
 			<span class="participant__user">
 				<span class="participant__user-name" :title="userNameTitle">{{ computedName }}</span>
-				<IconCrownOutline
-					v-if="showOwnerIcon"
+				<span
+					v-if="showOwnerIcon || showModeratorIcon"
 					class="participant__user-icon"
-					:size="16"
-					:title="ownerIconLabel" />
-				<IconShieldOutline
-					v-else-if="showModeratorIcon"
-					class="participant__user-icon"
-					:size="16"
-					:title="moderatorIconLabel" />
+					:title="showOwnerIcon ? ownerIconLabel : moderatorIconLabel">
+					<IconCrownOutline v-if="showOwnerIcon" :size="16" />
+					<IconShieldOutline v-else :size="16" />
+				</span>
 				<span v-if="isBridgeBotUser" class="participant__user-badge">({{ t('spreed', 'bot') }})</span>
 				<span v-if="isGuestActor || isEmailActor" class="participant__user-badge">({{ t('spreed', 'guest') }})</span>
 				<span v-if="!isSelf && isLobbyEnabled && !canSkipLobby" class="participant__user-badge">({{ t('spreed', 'in the lobby') }})</span>
@@ -92,12 +89,12 @@
 			</template>
 
 			<!-- Call state icon -->
-			<component
-				:is="callIcon.icon"
+			<span
 				v-else-if="callIcon"
 				class="participant__call-state"
-				:title="callIcon.title"
-				:size="callIcon.size" />
+				:title="callIcon.title">
+				<component :is="callIcon.icon" :size="callIcon.size" />
+			</span>
 
 			<!-- Grant or revoke lobby permissions (inline button) -->
 			<template v-if="showToggleLobbyAction">

src/components/RightSidebar/Participants/ParticipantsTab.vue

@@ -241,6 +241,10 @@ export default {
 		},
 
 		canAddPhones() {
+			if (!this.canAdd) {
+				return false
+			}
+
 			const canModerateSipDialOut = hasTalkFeature(this.token, 'sip-support-dialout')
 				&& getTalkConfig(this.token, 'call', 'enabled')
 				&& getTalkConfig(this.token, 'call', 'sip-enabled')
@@ -250,6 +254,10 @@ export default {
 		},
 
 		hintAddPhones() {
+			if (!this.canAdd) {
+				return false
+			}
+
 			const canModerateSipDialOut = hasTalkFeature(this.token, 'sip-support-dialout')
 				&& getTalkConfig(this.token, 'call', 'sip-enabled')
 				&& getTalkConfig(this.token, 'call', 'sip-dialout-enabled')

src/components/RightSidebar/RightSidebar.vue

@@ -370,6 +370,7 @@ export default {
 			return (this.getUserId || this.isGuestModerator)
 				&& (!this.isOneToOne || this.isInCall)
 				&& !this.isNoteToSelf
+				&& !this.isChangelog
 				&& (!isChannelConversation(this.conversation) || this.$store.getters.isModerator)
 		},
 
@@ -385,6 +386,10 @@ export default {
 			return this.conversation.type === CONVERSATION.TYPE.NOTE_TO_SELF
 		},
 
+		isChangelog() {
+			return this.conversation.type === CONVERSATION.TYPE.CHANGELOG
+		},
+
 		breakoutRoomsText() {
 			return t('spreed', 'Breakout rooms')
 		},