From c3899a5595c9311f380b6411df0d5ce8c55514f7 Mon Sep 17 00:00:00 2001
From: Carlo Venusino <cvenusino@sipwise.com>
Date: Thu, 5 Dec 2019 17:22:20 +0100
Subject: [PATCH] TT#71912 Optimise muteState mutations

Change-Id: Ic427ec561d79c2b9521a86e259312aec8402b597
---
 src/components/layouts/Conference.vue                  |  5 +++--
 .../Conference/CscConferenceRemoteParticipant.vue      |  3 ++-
 src/store/conference.js                                | 10 +++-------
 3 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/components/layouts/Conference.vue b/src/components/layouts/Conference.vue
index 63613d03..ad12371a 100644
--- a/src/components/layouts/Conference.vue
+++ b/src/components/layouts/Conference.vue
@@ -153,6 +153,7 @@
 </template>
 
 <script>
+    import _ from 'lodash';
     import {
         mapGetters,
         mapState,
@@ -293,7 +294,7 @@
             },
             toggleMuteAll(){
                 this.$refs.popover.close();
-                if(this.mutedState.length < 1) {
+                if(_.isEmpty(this.mutedState)) {
                     this.$store.dispatch('conference/muteAll');
                 }
                 else{
@@ -301,7 +302,7 @@
                 }
             },
             muteLabel() {
-                return this.mutedState.length < 1
+                return _.isEmpty(this.mutedState)
                         ? this.$t('conferencing.muteAll')
                         : this.$t('conferencing.unmuteAll');
             },
diff --git a/src/components/pages/Conference/CscConferenceRemoteParticipant.vue b/src/components/pages/Conference/CscConferenceRemoteParticipant.vue
index 1d23a7ba..ca4aff64 100644
--- a/src/components/pages/Conference/CscConferenceRemoteParticipant.vue
+++ b/src/components/pages/Conference/CscConferenceRemoteParticipant.vue
@@ -57,6 +57,7 @@
 </template>
 
 <script>
+    import _ from 'lodash';
     import { QIcon, QCard, QCardMedia, QCardTitle, QPopover, QList, QItem, QItemMain } from 'quasar-framework'
     import CscMedia from "../../CscMedia";
     import {
@@ -133,7 +134,7 @@
                 this.assignStream();
             },
             mutedState(){
-                this.isAudioMuted = this.mutedState.includes(this.remoteParticipant.id);
+                this.isAudioMuted = _.has(this.mutedState, this.remoteParticipant.id);
                 this.$refs.cscMedia.toggleAudio(this.isAudioMuted);
             }
         }
diff --git a/src/store/conference.js b/src/store/conference.js
index ab7c0115..9a1ad7ae 100644
--- a/src/store/conference.js
+++ b/src/store/conference.js
@@ -25,7 +25,7 @@ export default {
         leaveState: RequestState.initiated,
         leaveError: null,
         participants: [],
-        mutedState: [],
+        mutedState: {},
         remoteMediaStreams: {},
         selectedParticipant: null,
         manualSelection: false
@@ -231,14 +231,10 @@ export default {
             state.manualSelection = val;
         },
         addMutedState(state, participantId){
-            if(!state.mutedState[participantId]){
-                state.mutedState.push(participantId);
-            }
+            Vue.set(state.mutedState, participantId, participantId);
         },
         removeMutedState(state, participantId){
-            state.mutedState = state.mutedState.filter(($participant) => {
-                return participantId !== $participant;
-            });
+            Vue.delete(state.mutedState, participantId);
         }
     },
     actions: {