diff --git a/src/components/UpdateUserComponents/UpdateUserLayout.vue b/src/components/UpdateUserComponents/UpdateUserLayout.vue
index 680163fced7137b85b522d166883255bdaf71225..0f9dd3fd163e45d56aebd0a6beb58ebf406847d5 100644
--- a/src/components/UpdateUserComponents/UpdateUserLayout.vue
+++ b/src/components/UpdateUserComponents/UpdateUserLayout.vue
@@ -108,9 +108,10 @@ onMounted(()=>{
     <div class="row">
       <div class="col-md-2 text-center">
         <img src="/src/assets/userprofile.png" class="img-fluid" alt="userprofile">
-        <p class="h2">Username</p>
+        <p class="h2">{{useUserInfoStore().getFirstName}}</p>
       </div>
       <div class="col-md-10">
+        <!-- May need to deactive @submit.prevent -->
         <form ref="formRef" @submit.prevent="handleSubmit" id="newForm">
           <div class="row">
             <div class="form-group col-md-6" >
diff --git a/src/components/UserProfile/UserProfileLayout.vue b/src/components/UserProfile/UserProfileLayout.vue
index 6d212adbab50a7a91949b465d6f6ac755f3914d4..ac27b9b22f02fbc1e66824f6108ff54bcb47c399 100644
--- a/src/components/UserProfile/UserProfileLayout.vue
+++ b/src/components/UserProfile/UserProfileLayout.vue
@@ -3,6 +3,7 @@
 import Menu from "@/components/BaseComponents/Menu.vue";
 import Footer from "@/components/BaseComponents/Footer.vue";
 import {useRouter} from "vue-router";
+import {useUserInfoStore} from "../../stores/UserStore";
 
 let numberOfHistory = 6;
 
@@ -26,7 +27,7 @@ function toUpdateUserSettings(){
     <div class="row">
       <div class="col">
         <img src="/src/assets/userprofile.png" class="img-fluid">
-        <p class="h2">Username</p>
+        <p class="h2">{{useUserInfoStore().getFirstName}}</p>
         <p><a class="link-dark" @click="toUpdateUserSettings" href="#">Edit profile</a></p>
       </div>
     </div>