Move layout hint event to a watcher

Instead of being explicitly emitted in "makeGrid" the layout hint is now
automatically emitted based on the value of the computed properties that
it depends on.

Signed-off-by: Daniel Calviño Sánchez <[email protected]>

src/components/CallView/Grid/Grid.vue

@@ -448,6 +448,21 @@ export default {
 		stripeOpen() {
 			return this.$store.getters.isStripeOpen
 		},
+
+		// Special boolean property to watch and emit the "toggleLayoutHint"
+		// event to display hint in the topbar component if there is an overflow
+		// of videos (only if in full-grid mode, not stripe)
+		toggleLayoutHint() {
+			if (!this.hasVideoOverflow) {
+				return false
+			}
+
+			if (this.isStripe) {
+				return false
+			}
+
+			return true
+		},
 	},
 
 	watch: {
@@ -489,6 +504,13 @@ export default {
 				this.currentPage = this.numberOfPages - 1
 			}
 		},
+
+		toggleLayoutHint: {
+			immediate: true,
+			handler() {
+				EventBus.$emit('toggleLayoutHint', this.toggleLayoutHint)
+			},
+		},
 	},
 
 	// bind event handlers to the `handleResize` method
@@ -560,13 +582,6 @@ export default {
 			} else {
 				this.shrinkGrid(this.videosCount)
 			}
-			// Send event to display hint in the topbar component if there's an
-			// overflow of videos (only if in full-grid mode, not stripe)
-			if (!this.hasVideoOverflow || this.isStripe) {
-				EventBus.$emit('toggleLayoutHint', false)
-			} else {
-				EventBus.$emit('toggleLayoutHint', true)
-			}
 		},
 
 		// Fine tune the number of rows and columns of the grid