(fix) footer height ref

Author: antoine92190

src/lib/Room/RoomFooter/RoomEmojis/RoomEmojis.vue

@@ -3,7 +3,7 @@
 		<div
 			v-if="filteredEmojis.length"
 			class="vac-emojis-container"
-			:style="{ bottom: `${$parent.$refs.roomFooter.clientHeight}px` }"
+			:style="{ bottom: `${footerHeight}px` }"
 		>
 			<div
 				v-for="(emoji, index) in filteredEmojis"
@@ -37,6 +37,12 @@ export default {
 		}
 	},
 
+	computed: {
+		footerHeight() {
+			return document.getElementById('room-footer').clientHeight
+		}
+	},
+
 	watch: {
 		filteredEmojis() {
 			this.activeItem = 0

src/lib/Room/RoomFooter/RoomFiles/RoomFiles.vue

@@ -3,7 +3,7 @@
 		<div
 			v-if="files.length"
 			class="vac-room-files-container"
-			:style="{ bottom: `${$parent.$refs.roomFooter.clientHeight}px` }"
+			:style="{ bottom: `${footerHeight}px` }"
 		>
 			<div class="vac-files-box">
 				<div v-for="(file, i) in files" :key="i">
@@ -42,6 +42,12 @@ export default {
 		files: { type: Array, required: true }
 	},
 
-	emits: ['remove-file', 'reset-message']
+	emits: ['remove-file', 'reset-message'],
+
+	computed: {
+		footerHeight() {
+			return document.getElementById('room-footer').clientHeight
+		}
+	}
 }
 </script>

src/lib/Room/RoomFooter/RoomMessageReply/RoomMessageReply.vue

@@ -3,7 +3,7 @@
 		<div
 			v-if="messageReply"
 			class="vac-reply-container"
-			:style="{ bottom: `${$parent.$refs.roomFooter.clientHeight}px` }"
+			:style="{ bottom: `${footerHeight}px` }"
 		>
 			<div class="vac-reply-box">
 				<div class="vac-reply-info">
@@ -100,6 +100,9 @@ export default {
 	emits: ['reset-message'],
 
 	computed: {
+		footerHeight() {
+			return document.getElementById('room-footer').clientHeight
+		},
 		firstFile() {
 			return this.messageReply.files?.length ? this.messageReply.files[0] : {}
 		},

src/lib/Room/RoomFooter/RoomTemplatesText/RoomTemplatesText.vue

@@ -3,7 +3,7 @@
 		<div
 			v-if="filteredTemplatesText.length"
 			class="vac-template-container vac-app-box-shadow"
-			:style="{ bottom: `${$parent.$refs.roomFooter.clientHeight}px` }"
+			:style="{ bottom: `${footerHeight}px` }"
 		>
 			<div
 				v-for="(template, index) in filteredTemplatesText"
@@ -44,6 +44,12 @@ export default {
 		}
 	},
 
+	computed: {
+		footerHeight() {
+			return document.getElementById('room-footer').clientHeight
+		}
+	},
+
 	watch: {
 		filteredTemplatesText() {
 			this.activeItem = 0

src/lib/Room/RoomFooter/RoomUsersTag/RoomUsersTag.vue

@@ -3,7 +3,7 @@
 		<div
 			v-if="filteredUsersTag.length"
 			class="vac-tags-container"
-			:style="{ bottom: `${$parent.$refs.roomFooter.clientHeight}px` }"
+			:style="{ bottom: `${footerHeight}px` }"
 		>
 			<div
 				v-for="(user, index) in filteredUsersTag"
@@ -46,6 +46,12 @@ export default {
 		}
 	},
 
+	computed: {
+		footerHeight() {
+			return document.getElementById('room-footer').clientHeight
+		}
+	},
+
 	watch: {
 		filteredUsersTag() {
 			this.activeItem = 0