From f50de7ac1bed2bd5613b5546e49d828bd581c636 Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Sun, 12 Oct 2025 10:13:48 +0300
Subject: [PATCH] Logout confirmation: copy username & password

---
 src/assets/icons/ic_copy.vue                  |  3 +-
 src/assets/translations/en.json               |  6 ++-
 src/components/LogoutRoomDialog.vue           | 47 +++++++++++++++++++
 src/components/Profile.vue                    |  2 +-
 .../content-credentials/C2PAInfo.vue          |  2 +-
 5 files changed, 55 insertions(+), 5 deletions(-)

diff --git a/src/assets/icons/ic_copy.vue b/src/assets/icons/ic_copy.vue
index 4894d6b..52a108e 100644
--- a/src/assets/icons/ic_copy.vue
+++ b/src/assets/icons/ic_copy.vue
@@ -1,8 +1,7 @@
 <template>
-  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <svg width="16" height="16" viewBox="0 0 16 16" stroke="currentColor"  fill="none" xmlns="http://www.w3.org/2000/svg">
     <path
       d="M5 2H9.73333C11.2268 2 11.9735 2 12.544 2.29065C13.0457 2.54631 13.4537 2.95426 13.7094 3.45603C14 4.02646 14 4.77319 14 6.26667V11M4.13333 14H9.53333C10.2801 14 10.6534 14 10.9387 13.8547C11.1895 13.7268 11.3935 13.5229 11.5213 13.272C11.6667 12.9868 11.6667 12.6134 11.6667 11.8667V6.46667C11.6667 5.71993 11.6667 5.34656 11.5213 5.06135C11.3935 4.81046 11.1895 4.60649 10.9387 4.47866C10.6534 4.33333 10.2801 4.33333 9.53333 4.33333H4.13333C3.3866 4.33333 3.01323 4.33333 2.72801 4.47866C2.47713 4.60649 2.27316 4.81046 2.14532 5.06135C2 5.34656 2 5.71993 2 6.46667V11.8667C2 12.6134 2 12.9868 2.14532 13.272C2.27316 13.5229 2.47713 13.7268 2.72801 13.8547C3.01323 14 3.3866 14 4.13333 14Z"
-      stroke="white"
       stroke-width="1.5"
       stroke-linecap="round"
       stroke-linejoin="round"
diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json
index 3c02aec..f076d63 100644
--- a/src/assets/translations/en.json
+++ b/src/assets/translations/en.json
@@ -319,7 +319,11 @@
     "leave": "Leave"
   },
   "logout": {
-    "confirm_text": "Are you sure you want to logout ?"
+    "confirm_text": "Are you sure you want to logout ?",
+    "copy_credentials": "Copy Username & Password",
+    "copied_credentials": "Copied Username & Password",
+    "copied_credentials_value": "Username: {userId} \nPassword: {password}",
+    "copy_credentials_desc": "Your username and password are required to regain access to your chats from a new device or browser. We recommend storing these credentials in a secure location."
   },
   "purge_room": {
     "title": "Delete room?",
diff --git a/src/components/LogoutRoomDialog.vue b/src/components/LogoutRoomDialog.vue
index f9e50cb..8a9b6ff 100644
--- a/src/components/LogoutRoomDialog.vue
+++ b/src/components/LogoutRoomDialog.vue
@@ -4,6 +4,22 @@
     @click:outside="$emit('onOutsideLogoutPopupClicked')">
     <div class="dialog-content text-center">
       <h2 class="dialog-title">{{ $t("logout.confirm_text") }}</h2>
+      <div class="dialog-text">{{ $t("logout.copy_credentials_desc") }}</div>
+      <v-row>
+        <v-col sm="12" md="6" offset-md="3" class="d-flex justify-center">
+          <v-btn
+            ref="copyCredentialsBtn"
+            :color="credentialsCopied ? '#DEE6FF' : 'grey-lighten-4'"
+            class="text-none mb-2	mt-2 pa-5 d-flex justify-space-between"
+            append-icon="$vuetify.icons.ic_copy"
+            @click.stop="onCopyCredentials">
+            {{ $t(`logout.${credentialsCopied?'copied':'copy'}_credentials`)}}
+            <template v-slot:append>
+              <v-icon color="black"></v-icon>
+            </template>
+          </v-btn>
+        </v-col>
+      </v-row>
       <v-container fluid>
         <v-row cols="12">
           <v-col cols="6">
@@ -21,6 +37,7 @@
 </template>
 <script>
 import profileInfoMixin from "./profileInfoMixin";
+import { mapState } from 'vuex'
 
 export default {
   name: "LogoutRoomDialog",
@@ -31,5 +48,35 @@ export default {
       default: false,
     },
   },
+  data() {
+    return {
+      credentialsCopied: false
+    }
+  },
+  computed: {
+    ...mapState([
+      'auth'
+    ]),
+    credentials() {
+      return this.$t(`logout.copied_credentials_value`, { userId: this.auth.user.user_id, password: this.auth.user.password})
+    }
+  },
+  methods: {
+    onCopyCredentials() {
+      if(this.credentialsCopied) return
+      const self = this;
+      this.$copyText(this.credentials, this.$refs.copyCredentialsBtn.$el).then(
+        function (ignored) {
+          self.credentialsCopied = true;
+          setInterval(() => {
+            self.credentialsCopied = false;
+          }, 3000);
+        },
+        function (e) {
+          console.log(e);
+        }
+      )
+    }
+  }
 };
 </script>
diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index 77c0f48..09a6ac5 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -213,7 +213,7 @@
     <SelectLanguageDialog
       v-model="showSelectLanguageDialog"
     />
-    
+
     <!-- Dialog for request Notification -->
     <v-dialog
       v-model="notificationDialog"
diff --git a/src/components/content-credentials/C2PAInfo.vue b/src/components/content-credentials/C2PAInfo.vue
index ff8f51b..fed809c 100644
--- a/src/components/content-credentials/C2PAInfo.vue
+++ b/src/components/content-credentials/C2PAInfo.vue
@@ -16,7 +16,7 @@
     <i18n-t keypath="cc.cc_info" tag="span">
       <template v-slot:link>
         <a href="https://contentcredentials.org/verify" target="_blank">{{ $t("cc.cc_info_link") }}</a>
-        <v-icon>$vuetify.icons.ic_copy</v-icon>
+        <v-icon color="white">$vuetify.icons.ic_copy</v-icon>
       </template>
     </i18n-t>
   </div>