From acac6402d785541218cd17af595780a03ddb421c Mon Sep 17 00:00:00 2001
From: Gabriellvl <vanlangenhovefga@gmail.com>
Date: Wed, 14 May 2025 11:02:58 +0200
Subject: [PATCH] feat: copy link

---
 frontend/src/views/classes/TeacherClasses.vue | 93 ++++++++++++-------
 1 file changed, 62 insertions(+), 31 deletions(-)

diff --git a/frontend/src/views/classes/TeacherClasses.vue b/frontend/src/views/classes/TeacherClasses.vue
index 3ca32264..0f5b35c1 100644
--- a/frontend/src/views/classes/TeacherClasses.vue
+++ b/frontend/src/views/classes/TeacherClasses.vue
@@ -132,17 +132,13 @@
     // Show the teacher, copying of the code was a successs
     const copied = ref(false);
 
-    // Copy the generated code to the clipboard
-    async function copyToClipboard(): Promise<void> {
-        await navigator.clipboard.writeText(code.value);
-        copied.value = true;
-    }
+    async function copyToClipboard(code: string, isDialog: boolean = false, isLink: boolean = false): Promise<void> {
+        const content = isLink ? `${window.location.origin}/user/class?code=${code}` : code;
+        await navigator.clipboard.writeText(content);
+        copied.value = isDialog;
 
-    async function copyCode(selectedCode: string): Promise<void> {
-        code.value = selectedCode;
-        await copyToClipboard();
-        showSnackbar(t("copied"), "white");
-        copied.value = false;
+        if (!isDialog)
+            showSnackbar(t("copied"), "white");
     }
 
     // Custom breakpoints
@@ -235,20 +231,25 @@
                                             </v-btn>
                                         </td>
                                         <td>
-                                            <v-btn
-                                                v-if="!isMdAndDown"
-                                                variant="text"
-                                                append-icon="mdi-content-copy"
-                                                @click="copyCode(c.id)"
-                                            >
-                                                {{ c.id }}
-                                            </v-btn>
-                                            <span
-                                                v-else
-                                                style="cursor: pointer"
-                                                @click="openCodeDialog(c.id)"
-                                                ><v-icon icon="mdi-eye"></v-icon
-                                            ></span>
+                                            <v-row v-if="!isMdAndDown" dense align="center" no-gutters>
+                                                <v-btn
+                                                    variant="text"
+                                                    append-icon="mdi-content-copy"
+                                                    @click="copyToClipboard(c.id)"
+                                                >
+                                                    {{ c.id }}
+                                                </v-btn>
+                                                <v-btn
+                                                    icon
+                                                    variant="text"
+                                                    @click="copyToClipboard(c.id, false, true)"
+                                                >
+                                                    <v-icon>mdi-link-variant</v-icon>
+                                                </v-btn>
+                                            </v-row>
+                                            <span v-else style="cursor: pointer" @click="openCodeDialog(c.id)">
+                                                <v-icon icon="mdi-eye"></v-icon>
+                                            </span>
                                         </td>
 
                                         <td>{{ c.students.length }}</td>
@@ -310,14 +311,29 @@
                                         max-width="400px"
                                     >
                                         <v-card>
-                                            <v-card-title class="headline">code</v-card-title>
+                                            <v-card-title class="headline">{{ t("code") }}</v-card-title>
                                             <v-card-text>
                                                 <v-text-field
                                                     v-model="code"
                                                     readonly
-                                                    append-inner-icon="mdi-content-copy"
-                                                    @click:append-inner="copyToClipboard"
-                                                ></v-text-field>
+                                                >
+                                                    <template #append>
+                                                        <v-btn
+                                                            icon
+                                                            variant="text"
+                                                            @click="copyToClipboard(code, true)"
+                                                        >
+                                                            <v-icon>mdi-content-copy</v-icon>
+                                                        </v-btn>
+                                                        <v-btn
+                                                            icon
+                                                            variant="text"
+                                                            @click="copyToClipboard(code, true, true)"
+                                                        >
+                                                            <v-icon>mdi-link-variant</v-icon>
+                                                        </v-btn>
+                                                    </template>
+                                                </v-text-field>
                                                 <v-slide-y-transition>
                                                     <div
                                                         v-if="copied"
@@ -469,9 +485,24 @@
                     <v-text-field
                         v-model="selectedCode"
                         readonly
-                        append-inner-icon="mdi-content-copy"
-                        @click:append-inner="copyToClipboard"
-                    ></v-text-field>
+                    >
+                        <template #append>
+                            <v-btn
+                                icon
+                                variant="text"
+                                @click="copyToClipboard(selectedCode, true)"
+                            >
+                                <v-icon>mdi-content-copy</v-icon>
+                            </v-btn>
+                            <v-btn
+                                icon
+                                variant="text"
+                                @click="copyToClipboard(selectedCode, true, true)"
+                            >
+                                <v-icon>mdi-link-variant</v-icon>
+                            </v-btn>
+                        </template>
+                    </v-text-field>
                     <v-slide-y-transition>
                         <div
                             v-if="copied"