attached login and disconnect to Header.vue

src/views/main/Header.vue

@@ -62,18 +62,17 @@
           </template>
 
           <v-list class="mt-2">
-            <v-list-item @click="navigateToProfile">
-
+            <v-list-item>            
               <v-list-item-title>
                 <router-link to="/profile">
-                  Mon profil
+                Mon profil
                 </router-link>
               </v-list-item-title>
             </v-list-item>
             <v-list-item>
               <v-list-item-title>
                 <router-link to="/wallet">
-                  Mon wallet
+                Mon wallet
                 </router-link>
               </v-list-item-title>
             </v-list-item>
@@ -93,16 +92,18 @@
 </template>
 
 <script setup>
-import {ref, onMounted, onBeforeUnmount} from "vue";
-import {eventBus} from '@/eventBus.js';
-import {useRouter} from 'vue-router';
-
+import MyUserModel from "@/models/myUserModel.js";
+import { useClient } from "@/plugins/api.js";
+import { ref, onMounted, onBeforeUnmount } from "vue";
+import { eventBus } from '@/eventBus.js';
+import { useRouter } from 'vue-router';
 
 const router = useRouter();
-const currentUserName = "Pascal Marchesseault";
+const currentUserName = ref("INVITÉ");
 const searchQuery = ref("");
 const showSearch = ref(false);
-
+let currentUser = null;
+const client = useClient();
 
 const toggleSidebar = () => {
   eventBus.value.toggleSidebar();
@@ -117,7 +118,7 @@ const onSearch = () => {
     if (words.length === 1) {
       router.push(`/@${words[0]}`);
     } else {
-      router.push({name: "browse", query: {q: query}});
+      router.push({ name: "browse", query: { q: query } });
     }
   }
 };
@@ -132,13 +133,6 @@ const handleClickOutside = (event) => {
   }
 };
 
-onMounted(() => {
-  document.addEventListener('click', handleClickOutside);
-});
-
-onBeforeUnmount(() => {
-  document.removeEventListener('click', handleClickOutside);
-});
 const navigateToWallet = () => {
   router.push('/wallet');
 };
@@ -147,13 +141,29 @@ const navigateToMessages = () => {
   router.push('/messages');
 };
 
-function logout() {
+const logout = () => {
   localStorage.removeItem('jwt');
   window.location.reload();
 };
 
+onMounted(async () => {
+  try {
+    const myUser = await client.get("/api/GetMyUser");
+    const currentUserModel = MyUserModel.createFromApiResult(myUser.data);
+    currentUser = currentUserModel;
+    currentUserName.value = currentUserModel.firstName + " " + currentUserModel.lastName;
+  } catch (error) {
+    console.log("User not logged");
+  }
+  document.addEventListener('click', handleClickOutside);
+});
+
+onBeforeUnmount(() => {
+  document.removeEventListener('click', handleClickOutside);
+});
 </script>
 
+
 <style scoped>
 .search-container {
   position: relative;