From 719409580a2f771d42c109a647ee13be32d68afa Mon Sep 17 00:00:00 2001
From: Richard van Leeuwen <rbavleeuwen@gmail.com>
Date: Mon, 14 Jul 2025 22:12:35 +0200
Subject: [PATCH] Added copy icons to first-login message Also inputs the
 email/password when clicked.

---
 frontend/lib/icons/icons.ts |  3 ++-
 frontend/pages/login.vue    | 23 +++++++++++++++++++++++
 2 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/frontend/lib/icons/icons.ts b/frontend/lib/icons/icons.ts
index 0e11d71cb..0ab1d2f99 100644
--- a/frontend/lib/icons/icons.ts
+++ b/frontend/lib/icons/icons.ts
@@ -86,6 +86,7 @@ import {
   mdiLogout,
   mdiContentCopy,
   mdiClipboardCheck,
+  mdiClipboard,
   mdiCloudUpload,
   mdiDatabase,
   mdiGithub,
@@ -191,6 +192,7 @@ export const icons = {
   checkboxMarkedCircle: mdiCheckboxMarkedCircle,
   chefHat: mdiChefHat,
   clipboardCheck: mdiClipboardCheck,
+  clipboard: mdiClipboard,
   clockOutline: mdiClockTimeFourOutline,
   codeBraces: mdiCodeJson,
   codeJson: mdiCodeJson,
@@ -322,5 +324,4 @@ export const icons = {
   preserveLines: mdiText,
   preserveBlocks: mdiTextBoxOutline,
   flatten: mdiMinus,
-
 };
diff --git a/frontend/pages/login.vue b/frontend/pages/login.vue
index 1e70ea2ac..f683d7fb8 100644
--- a/frontend/pages/login.vue
+++ b/frontend/pages/login.vue
@@ -19,9 +19,15 @@
         </p>
         <p class="mb-1">
           <strong>{{ $t('user.username') }}:</strong> changeme@example.com
+          <v-icon start size="smaller" @click="copy('email')">
+            {{ $globals.icons.clipboard }}
+          </v-icon>
         </p>
         <p class="mb-3">
           <strong>{{ $t('user.password') }}:</strong> MyPassword
+          <v-icon start size="smaller" @click="copy('password')">
+            {{ $globals.icons.clipboard }}
+          </v-icon>
         </p>
         <p>
           {{ $t('user.dont-want-to-see-this-anymore-be-sure-to-change-your-email') }}
@@ -325,6 +331,22 @@ export default defineNuxtComponent({
       }
     }
 
+    async function copy(thingToCopy: "email" | "password") {
+      try {
+        if (thingToCopy === "email") {
+          await navigator.clipboard.writeText("changeme@example.com");
+          form.email = "changeme@example.com";
+        }
+        else {
+          await navigator.clipboard.writeText("MyPassword");
+          form.password = "MyPassword";
+        }
+      }
+      catch (err) {
+        console.log(err);
+      }
+    };
+
     async function authenticate() {
       if (form.email.length === 0 || form.password.length === 0) {
         alert.error(i18n.t("user.please-enter-your-email-and-password"));
@@ -376,6 +398,7 @@ export default defineNuxtComponent({
       oidcProviderName,
       oidcLoggingIn,
       passwordIcon,
+      copy,
       inputType,
       togglePasswordShow,
       isFirstLogin,