Added setup to components in UpdateUserProfile

src/components/UpdateUserComponents/UpdateUserLayout.vue

+<script setup lang="ts">
+
+</script>
+
+<template>
+  <div class="container text-center">
+    <div class="row">
+      <div class="col">User profile</div>
+      <div class="col"> update user form</div>
+    </div>
+    <!-- Maybe a profile-pictures here that collapses or not -->
+    <div class="row">
+      <div class="col">User profile pictures</div>
+    </div>
+    <!-- Div that contains the configuration -->
+    <div class="row">
+      <div class="col">Configuration</div>
+    </div>
+  </div>
+
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file

src/components/UserProfile/UserProfileLayout.vue

@@ -15,16 +15,19 @@ let route = useRouter()
 function toRoadmap(){
   route.push('/roadmap')
 }
+
+function toUpdateUserSettings(){
+  route.push('/update-user')
+}
 </script>
 
 <template>
-  <Menu></Menu>
     <div class="container text-center">
     <div class="row">
       <div class="col">
         <img src="/src/assets/userprofile.png" class="img-fluid">
         <p class="h2">Username</p>
-        <p><a class="link-dark" href="#">Edit profile</a></p>
+        <p><a class="link-dark" @click="toUpdateUserSettings" href="#">Edit profile</a></p>
       </div>
     </div>
       <div class="row">
@@ -120,7 +123,6 @@ function toRoadmap(){
       </div>
     </div>
   </div>
-  <Footer></Footer>
 </template>
 
 <style scoped>

src/router/index.ts

@@ -4,6 +4,7 @@ import LoginView from '../views/Authentication/LoginView.vue';
 import { useUserInfoStore } from '@/stores/UserStore';
 import UserProfileView from "@/views/User/UserProfileView.vue";
 import SignUp from '@/components/SignUp/SignUp.vue'
+import UpdateUserView from "@/views/UpdateUser/UpdateUserView.vue";
 
 
 const routes = [
@@ -33,6 +34,16 @@ const routes = [
         name: 'test',
         component: () => import('@/views/TestView.vue'),
       },
+      {
+        path: '/profile',
+        name: 'profile',
+        component: UserProfileView
+      },
+      {
+        path: 'update-user',
+        name: 'update-user',
+        component: UpdateUserView
+      },
       {
         path: 'roadmap',
         name: 'roadmap',
@@ -71,11 +82,6 @@ const routes = [
     name: 'login',
     component: LoginView,
   },
-  {
-    path: '/profile',
-    name: 'profile',
-    component: UserProfileView
-  },
   {
     path: '/sign-up',
     name: 'sign up',

src/views/UpdateUser/UpdateUserView.vue

+<script setup lang="ts">
+
+import UpdateUserLayout from "@/components/UpdateUserComponents/UpdateUserLayout.vue";
+</script>
+
+<template>
+<UpdateUserLayout></UpdateUserLayout>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file