Hide participants without publishing permissions in call view

docs/call.md

@@ -28,6 +28,7 @@
         `displayName` | string | v3 | | The display name of the attendee
         `lastPing` | int | v1 | | Timestamp of the last ping of the user (should be used for sorting)
         `sessionId` | string | v1 | | 512 character long string
+        `publishingPermissions` | int | v4 | Publishing permissions for the participant (see [constants list](constants.md#participant-publishing-permissions))
 
 ## Join a call
 

lib/Controller/CallController.php

@@ -93,6 +93,7 @@ public function getPeersForCall(): DataResponse {
 				'token' => $this->room->getToken(),
 				'lastPing' => $participant->getSession()->getLastPing(),
 				'sessionId' => $participant->getSession()->getSessionId(),
+				'publishingPermissions' => $participant->getAttendee()->getPublishingPermissions(),
 			];
 		}
 

src/components/CallView/CallView.vue

@@ -159,8 +159,9 @@
 
 <script>
 import Grid from './Grid/Grid'
-import { SIMULCAST } from '../../constants'
+import { PARTICIPANT, SIMULCAST } from '../../constants'
 import { localMediaModel, localCallParticipantModel, callParticipantCollection } from '../../utils/webrtc/index'
+import { ConnectionState } from '../../utils/webrtc/models/CallParticipantModel'
 import { fetchPeers } from '../../services/callsService'
 import { showMessage } from '@nextcloud/dialogs'
 import LocalMediaControls from './shared/LocalMediaControls'
@@ -216,7 +217,63 @@ export default {
 	},
 	computed: {
 		callParticipantModels() {
-			return callParticipantCollection.callParticipantModels.filter(callParticipantModel => !callParticipantModel.attributes.internal)
+			let callParticipantModels = callParticipantCollection.callParticipantModels.filter(callParticipantModel => !callParticipantModel.attributes.internal)
+
+			if (this.conversation.objectType === 'share:password'
+				|| this.conversation.objectType === 'file') {
+				return callParticipantModels
+			}
+
+			const allParticipantsCount = callParticipantModels.length
+
+			// Filter out subscriber only participants
+			callParticipantModels = callParticipantCollection.callParticipantModels.filter(callParticipantModel => {
+				const nextcloudSessionId = callParticipantModel.attributes.nextcloudSessionId
+
+				const participantIndex = this.$store.getters.getParticipantIndex(this.token, { sessionId: nextcloudSessionId })
+				if (participantIndex === -1) {
+					const peerData = this.$store.getters.getPeer(this.token, nextcloudSessionId)
+					if (!peerData) {
+						return false
+					}
+
+					return peerData.publishingPermissions !== PARTICIPANT.PUBLISHING_PERMISSIONS.NONE
+				}
+
+				const participant = this.$store.getters.getParticipant(this.token, participantIndex)
+
+				return participant.publishingPermissions !== PARTICIPANT.PUBLISHING_PERMISSIONS.NONE
+			})
+
+			const subscribersOnlyCount = allParticipantsCount - callParticipantModels.length
+
+			if (subscribersOnlyCount > 0) {
+				const subscribersOnlyPlaceholder = {
+					attributes: {
+						peerId: '-1',
+						connectionState: ConnectionState.CONNECTED,
+
+						speaking: false,
+						screen: null,
+						raisedHand: false,
+
+						subscribersOnlyPlaceholder: true,
+						subscribersOnlyCount,
+					},
+				}
+
+				callParticipantModels.push(subscribersOnlyPlaceholder)
+			}
+
+			return callParticipantModels
+		},
+
+		conversation() {
+			return this.$store.getters.conversations[this.token] || {
+				sessionId: '0',
+				participantType: this.$store.getters.getUserId() !== null ? PARTICIPANT.TYPE.USER : PARTICIPANT.TYPE.GUEST,
+				objectType: null,
+			}
 		},
 
 		reversedCallParticipantModels() {
@@ -399,13 +456,16 @@ export default {
 	},
 	mounted() {
 		EventBus.$on('refresh-peer-list', this.debounceFetchPeers)
+		EventBus.$on('Signaling::participantListChanged', this.debounceFetchPeers)
+		this.debounceFetchPeers()
 
 		callParticipantCollection.on('remove', this._lowerHandWhenParticipantLeaves)
 
 		subscribe('talk:video:toggled', this.handleToggleVideo)
 	},
 	beforeDestroy() {
 		EventBus.$off('refresh-peer-list', this.debounceFetchPeers)
+		EventBus.$off('Signaling::participantListChanged', this.debounceFetchPeers)
 
 		callParticipantCollection.off('remove', this._lowerHandWhenParticipantLeaves)
 

src/components/CallView/shared/Video.vue

@@ -63,6 +63,12 @@
 						:show-user-status="false"
 						:class="avatarClass" />
 				</template>
+				<template v-else-if="model.attributes.subscribersOnlyPlaceholder">
+					<div
+						:class="guestAvatarClass"
+						style="background-size: 100%;"
+						class="avatar icon-contacts" />
+				</template>
 				<template v-else>
 					<VideoBackground
 						:display-name="participantName" />
@@ -252,6 +258,10 @@ export default {
 		},
 
 		participantUserId() {
+			if (this.model.attributes.subscribersOnlyPlaceholder) {
+				return null
+			}
+
 			if (this.model.attributes.userId) {
 				return this.model.attributes.userId
 			}
@@ -275,6 +285,12 @@ export default {
 		},
 
 		participantName() {
+			if (this.model.attributes.subscribersOnlyPlaceholder) {
+				return t('spreed', 'Participants not allowed to publish: {number}', {
+					number: this.model.attributes.subscribersOnlyCount,
+				})
+			}
+
 			if (this.model.attributes.name) {
 				return this.model.attributes.name
 			}