diff options
-rw-r--r-- | src/components/CallView/CallView.vue | 9 | ||||
-rw-r--r-- | src/components/CallView/shared/ReactionToaster.vue | 15 | ||||
-rw-r--r-- | src/components/TopBar/ReactionMenu.vue | 6 | ||||
-rw-r--r-- | src/components/TopBar/TopBar.vue | 6 |
4 files changed, 29 insertions, 7 deletions
diff --git a/src/components/CallView/CallView.vue b/src/components/CallView/CallView.vue index bab63925a..01afdf043 100644 --- a/src/components/CallView/CallView.vue +++ b/src/components/CallView/CallView.vue @@ -121,7 +121,9 @@ @select-video="handleSelectVideo" @click-local-video="handleClickLocalVideo" /> - <ReactionToaster :token="token" + <ReactionToaster v-if="supportedReactions?.length" + :token="token" + :supported-reactions="supportedReactions" :call-participant-models="callParticipantModels" /> <!-- Local video if sidebar --> @@ -145,6 +147,7 @@ <script> import debounce from 'debounce' +import { getCapabilities } from '@nextcloud/capabilities' import { showMessage } from '@nextcloud/dialogs' import { subscribe, unsubscribe } from '@nextcloud/event-bus' import { loadState } from '@nextcloud/initial-state' @@ -343,6 +346,10 @@ export default { return null }, + + supportedReactions() { + return getCapabilities()?.spreed?.config?.call?.['supported-reactions'] + }, }, watch: { localScreen(localScreen) { diff --git a/src/components/CallView/shared/ReactionToaster.vue b/src/components/CallView/shared/ReactionToaster.vue index 4afa528d5..8d0a8ccd7 100644 --- a/src/components/CallView/shared/ReactionToaster.vue +++ b/src/components/CallView/shared/ReactionToaster.vue @@ -54,6 +54,16 @@ export default { type: String, required: true, }, + + /** + * Supported reactions + */ + supportedReactions: { + type: Array, + validator: (prop) => prop.every(e => typeof e === 'string'), + required: true, + }, + callParticipantModels: { type: Array, required: true, @@ -110,6 +120,11 @@ export default { }, handleReaction(model, reaction) { + // prevent receiving anything rather than defined reactions in capabilities + if (!this.supportedReactions.includes(reaction)) { + return + } + this.reactionsQueue.push({ reaction, name: this.getParticipantName(model), diff --git a/src/components/TopBar/ReactionMenu.vue b/src/components/TopBar/ReactionMenu.vue index e87a617ae..940af7d15 100644 --- a/src/components/TopBar/ReactionMenu.vue +++ b/src/components/TopBar/ReactionMenu.vue @@ -31,7 +31,7 @@ <NcActionButtonGroup class="reaction__group" :style="{'--reactions-in-single-row': reactionsInSingleRow}"> - <NcActionButton v-for="(reaction, index) in reactions" + <NcActionButton v-for="(reaction, index) in supportedReactions" :key="index" :aria-label="t('spreed', 'React with {reaction}', { reaction })" class="reaction__button" @@ -88,7 +88,7 @@ export default { /** * Supported reactions */ - reactions: { + supportedReactions: { type: Array, validator: (prop) => prop.every(e => typeof e === 'string'), required: true, @@ -109,7 +109,7 @@ export default { }, reactionsInSingleRow() { - return Math.ceil(this.reactions.length / 2) + return Math.ceil(this.supportedReactions.length / 2) }, }, diff --git a/src/components/TopBar/TopBar.vue b/src/components/TopBar/TopBar.vue index 2e44256e9..7656a5cfc 100644 --- a/src/components/TopBar/TopBar.vue +++ b/src/components/TopBar/TopBar.vue @@ -78,7 +78,7 @@ <ReactionMenu v-if="hasReactionSupport" class="top-bar__button dark-hover" :token="token" - :reactions="reactions" + :supported-reactions="supportedReactions" :local-call-participant-model="localCallParticipantModel" /> <!-- Local media controls --> @@ -305,12 +305,12 @@ export default { return IS_DESKTOP }, - reactions() { + supportedReactions() { return getCapabilities()?.spreed?.config?.call?.['supported-reactions'] }, hasReactionSupport() { - return this.isInCall && this.reactions?.length > 0 + return this.isInCall && this.supportedReactions?.length > 0 }, }, |