fixed update user dto for proper role handling and changed back button in user settings

management-ui/src/customcompometns/UserSettings.vue

@@ -10,6 +10,7 @@ import { computed, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import type { Users } from '@/lib/interfaces';
 import { api } from '@/lib/api';
+import { X } from 'lucide-vue-next';
 
 const mode = useColorMode()
 const modeLabel = computed(() => {
@@ -88,11 +89,16 @@ function goBack() {
     <div class="w-full h-full flex items-center justify-center px-4">
         <Card class="flex w-[600px]">
             <CardHeader>
-                <CardTitle>
-                    Settings
-                </CardTitle>
+                <div class="flex items-center justify-between">
+                    <CardTitle>
+                        Settings
+                    </CardTitle>
+                    <Button variant="ghost" class="w-auto px-4" @click="goBack">
+                        <X/>
+                    </Button>
+                </div>
+
             </CardHeader>
-            <Button variant="secondary" @click="goBack">Back</Button>
             <CardContent>
                 <form class="grid gap-4 py-4" @submit.prevent="submitChangePassword">
                     <div class="grid grid-cols-4 items-center gap-4">