logout confirmation popup

src/components/Profile.vue

@@ -53,9 +53,14 @@
           <!-- <div v-if="$matrix.currentUser.is_guest">
             {{ $t("profile.temporary_identity") }}
           </div> -->
-          <v-btn id="btn-logout" depressed block class="outlined-button" @click.stop="logout">{{
-            $t("menu.logout")
-          }}</v-btn>
+          <v-btn id="btn-logout" depressed block class="outlined-button" @click.stop="showLogoutPopup=true">
+            {{ $t("menu.logout") }}
+          </v-btn>
+          <LogoutRoomDialog
+            :showLogoutPopup="showLogoutPopup"
+            @onOutsideLogoutPopupClicked="showLogoutPopup=false"
+            @onCancelLogoutClicked="showLogoutPopup=false"
+          />
         </v-col>
       </v-row>
     </v-container>
@@ -182,6 +187,7 @@ const sizeOf = require("image-size");
 //const dataUriToBuffer = require("data-uri-to-buffer");
 import util from "../plugins/utils";
 import profileInfoMixin from "./profileInfoMixin";
+import LogoutRoomDialog from './LogoutRoomDialog.vue';
 
 export default {
   name: "Profile",
@@ -189,12 +195,14 @@ export default {
   components: {
     ActionRow,
     SelectLanguageDialog,
+    LogoutRoomDialog,
   },
   data() {
     return {
       showEditPasswordDialog: false,
       showEditDisplaynameDialog: false,
       showSelectLanguageDialog: false,
+      showLogoutPopup: false,
       editValue: null,
       password: null,
       newPassword1: null,