Merge branch '318-fix-emojis-visibility-realtime' into 'dev'

Emojis update realtime

For #318

See merge request keanuapp/keanuapp-weblite!97

src/components/Chat.vue

@@ -72,7 +72,6 @@
               :room="room"
               :event="event"
               :nextEvent="events[index + 1]"
-              :reactions="timelineSet.getRelationsForEvent(event.getId(), 'm.annotation', 'm.reaction')"
               :timelineSet="timelineSet"
               v-on:send-quick-reaction="sendQuickReaction"
               v-on:context-menu="showContextMenuForEvent($event)"

src/components/RoomExport.vue

@@ -33,7 +33,6 @@
                 :room="room"
                 :event="event"
                 :nextEvent="events[index + 1]"
-                :reactions="timelineSet.getRelationsForEvent(event.getId(), 'm.annotation', 'm.reaction')"
                 :timelineSet="timelineSet"
                 ref="exportedEvent"
               />

src/components/messages/MessageIncoming.vue

@@ -20,7 +20,7 @@
         ><v-icon>more_vert</v-icon></v-btn
       >
     </div>
-    <QuickReactions :event="event" :reactions="reactions" />
+    <QuickReactions :event="event" :timelineSet="timelineSet" />
   </div>
 </template>
 

src/components/messages/MessageOutgoing.vue

@@ -8,7 +8,7 @@
       <div class="status">{{ event.status }}</div>
     </div>
 
-    <QuickReactions :event="event" :reactions="reactions" />
+    <QuickReactions :event="event" :timelineSet="timelineSet" />
     <div class="op-button" ref="opbutton">
       <v-btn id="btn-show-menu" icon @click.stop="showContextMenu($refs.opbutton)"
         ><v-icon>more_vert</v-icon></v-btn

src/components/messages/QuickReactions.vue

@@ -15,24 +15,33 @@ export default {
         return {}
       }
     },
-    reactions: {
+        timelineSet: {
       type: Object,
       default: function () {
         return null
       }
-    }
+    },
   },
   data() {
     return {
-      reactionMap: {}
+      reactionMap: {},
+      reactions: null
     }
   },
+  mounted() {
+    this.reactions = this.timelineSet.getRelationsForEvent(this.event.getId(), 'm.annotation', 'm.reaction');
+    this.event.on("Event.relationsCreated", this.onRelationsCreated);
+  },
   beforeDestroy() {
+    this.event.off("Event.relationsCreated", this.onRelationsCreated);
     if (this.reactions) {
       this.reactions.off('Relations.add', this.onAddRelation);
     }
   },
   methods: {
+    onRelationsCreated() {
+      this.reactions = this.timelineSet.getRelationsForEvent(this.event.getId(), 'm.annotation', 'm.reaction');
+    },
     onClickEmoji(emoji) {
       this.$bubble('send-quick-reaction', {reaction:emoji, event:this.event});
     },

src/components/messages/messageMixin.js

@@ -27,12 +27,6 @@ export default {
         return null
       }
     },
-    reactions: {
-      type: Object,
-      default: function () {
-        return null
-      }
-    },
     timelineSet: {
       type: Object,
       default: function () {