added copy link button

ui/src/pages/TrainingReport.vue

@@ -10,7 +10,7 @@ import {
     TableHeader,
     TableRow,
 } from '@/components/ui/table'
-import { ArrowUpDown, ChevronDown, ChevronUp, Funnel, Plus, Search, X } from 'lucide-vue-next';
+import { ArrowUpDown, ChevronDown, ChevronUp, Funnel, Link, Plus, Search, X } from 'lucide-vue-next';
 import Button from '@/components/ui/button/Button.vue';
 import TrainingReportForm from '@/components/trainingReport/trainingReportForm.vue';
 import Checkbox from '@/components/ui/checkbox/Checkbox.vue';
@@ -33,6 +33,7 @@ import {
     PaginationPrevious,
 } from '@/components/ui/pagination'
 import Tooltip from '@/components/tooltip/Tooltip.vue';
+import { CopyLink } from '@/lib/copyLink';
 
 enum sidePanelState { view, create, closed };
 
@@ -236,9 +237,14 @@ const expanded = ref<number>(null);
         <div v-if="focusedTrainingReport != null && sidePanel == sidePanelState.view" class="pl-9 my-3 border-l w-3/5">
             <div class="flex justify-between items-center">
                 <p class="scroll-m-20 text-2xl font-semibold tracking-tight">Training Report Details</p>
-                <Button @click="closeTrainingReport" class="cursor-pointer" variant="ghost" size="icon">
-                    <X class="size-6"></X>
-                </Button>
+                <div class="flex items-center gap-2">
+                    <Button class="cursor-pointer" variant="ghost" size="icon" @click="CopyLink()">
+                        <Link class="size-4" />
+                    </Button>
+                    <Button @click="closeTrainingReport" class="cursor-pointer" variant="ghost" size="icon">
+                        <X class="size-6"></X>
+                    </Button>
+                </div>
             </div>
             <div v-if="TRLoaded" class="max-h-[70vh] overflow-auto scrollbar-themed my-5">
                 <div class="flex flex-col mb-5 border rounded-lg bg-muted/70 p-2 py-3 px-4">
@@ -251,7 +257,7 @@ const expanded = ref<number>(null);
                                 :member-id="focusedTrainingReport.created_by" />
                         <p v-else>{{ focusedTrainingReport.created_by_name === null ? "Unknown User" :
                             focusedTrainingReport.created_by_name
-                        }}</p>
+                            }}</p>
                         </p>
                     </div>
                 </div>