Fix container of modal and popup components when Talk is embedded

The container of modal and popup components was always set to
"#content-vue" to ensure that they will be properly shown in normal and
fullscreen mode in the main Talk UI. However, when Talk is embedded in
the Files app, the share page or the video verification there is no such
element, so the container for the components could not be set and thus
they were not shown.

To solve this now the selector for the main container element is got
from the store instead of being hardcoded, and the different UI modes
set the appropriate value when initialized (or leave it undefined to use
the default one, typically the body element, when a specific element is
not needed).

Note that this change applies too to some components that, right now,
are only shown in the main Talk UI, but it was done for consistency and
to make them "future-proof".

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>

1 files changed, 5 insertions, 1 deletions

diff --git a/src/components/MessagesList/MessagesGroup/AuthorAvatar.vue b/src/components/MessagesList/MessagesGroup/AuthorAvatar.vue
index 1dde6510c..e1d6425c0 100644
--- a/src/components/MessagesList/MessagesGroup/AuthorAvatar.vue
+++ b/src/components/MessagesList/MessagesGroup/AuthorAvatar.vue
@@ -26,7 +26,7 @@
 		:user="authorId"
 		:show-user-status="false"
 		:disable-menu="disableMenu"
-		menu-container="#content-vue"
+		:menu-container="menuContainer"
 		menu-position="left"
 		:display-name="displayName" />
 	<div v-else-if="isDeletedUser"
@@ -88,6 +88,10 @@ export default {
 			return customName.charAt(0)
 		},
 
+		menuContainer() {
+			return this.$store.getters.getMainContainerSelector()
+		},
+
 		disableMenu() {
 			// disable the menu if accessing the conversation as guest
 			// or the message sender is a bridged user