diff --git a/frontend/src/components/admin/user/components/UserCard.tsx b/frontend/src/components/admin/user/components/UserCard.tsx
index 0effadd..449eec0 100644
--- a/frontend/src/components/admin/user/components/UserCard.tsx
+++ b/frontend/src/components/admin/user/components/UserCard.tsx
@@ -1,14 +1,27 @@
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import {
+    Select,
+    SelectContent,
+    SelectGroup,
+    SelectItem,
+    SelectLabel,
+    SelectTrigger,
+    SelectValue,
+} from "@/components/ui/select";
+import { DebugButton } from "@/utils/formStuff/debugButton";
 import { userFormOptions } from "@/utils/formStuff/options/userformOptions";
 import { generatePassword } from "@/utils/passwordGen";
+import { getUsers } from "@/utils/querys/admin/users";
 import { useForm } from "@tanstack/react-form";
+import { useQuery } from "@tanstack/react-query";
 import axios from "axios";
 import { toast } from "sonner";
 
 export default function UserCard(data: any) {
     const token = localStorage.getItem("auth_token");
+    const { refetch } = useQuery(getUsers());
     const form = useForm({
         ...userFormOptions(data.user),
         onSubmit: async ({ value }) => {
@@ -29,6 +42,7 @@ export default function UserCard(data: any) {
 
                 if (res.data.success) {
                     toast.success(res.data.message);
+                    refetch();
                     form.reset();
                 } else {
                     res.data.message;
@@ -104,6 +118,45 @@ export default function UserCard(data: any) {
                         );
                     }}
                 />
+                <form.Field
+                    name="role"
+                    //listeners={{onChange: ({value})=>{}}}
+                    children={(field) => {
+                        return (
+                            <div className="m-2 min-w-48 max-w-96 p-2">
+                                <Label htmlFor={field.name}>Select role</Label>
+                                <Select
+                                    value={field.state.value}
+                                    onValueChange={field.handleChange}
+                                >
+                                    <SelectTrigger className="w-[180px]">
+                                        <SelectValue
+                                            id={field.name}
+                                            placeholder="Select Role"
+                                        />
+                                    </SelectTrigger>
+                                    <SelectContent>
+                                        <SelectGroup>
+                                            <SelectLabel>Roles</SelectLabel>
+                                            <SelectItem value="viewer">
+                                                Viewer
+                                            </SelectItem>
+                                            <SelectItem value="operator">
+                                                Operator
+                                            </SelectItem>
+                                            <SelectItem value="manager">
+                                                Manager
+                                            </SelectItem>
+                                            <SelectItem value="admin">
+                                                Admin
+                                            </SelectItem>
+                                        </SelectGroup>
+                                    </SelectContent>
+                                </Select>
+                            </div>
+                        );
+                    }}
+                />
                 <form.Field
                     name="password"
                     validators={{
@@ -142,12 +195,13 @@ export default function UserCard(data: any) {
                     }}
                     children={(field) => {
                         return (
-                            <div className="m-2 min-w-48 max-w-96 p-2">
+                            <div className="m-2 p-2">
                                 <Label htmlFor="password">
                                     Change Password
                                 </Label>
                                 <div className="mt-2 flex flex-row">
                                     <Input
+                                        className="min-w-48 max-w-96"
                                         name={field.name}
                                         value={field.state.value}
                                         onBlur={field.handleBlur}
@@ -166,6 +220,7 @@ export default function UserCard(data: any) {
                                     >
                                         Random password
                                     </Button>
+                                    <DebugButton data={form.state.values} />
                                 </div>
                                 {field.state.meta.errors.length ? (
                                     <em>{field.state.meta.errors.join(",")}</em>
diff --git a/frontend/src/utils/formStuff/options/userformOptions.tsx b/frontend/src/utils/formStuff/options/userformOptions.tsx
index 6e32a7a..fb2fcdd 100644
--- a/frontend/src/utils/formStuff/options/userformOptions.tsx
+++ b/frontend/src/utils/formStuff/options/userformOptions.tsx
@@ -6,6 +6,7 @@ export const userFormOptions = (user: any) => {
             username: user.username,
             password: "",
             email: user.email,
+            role: user.role,
             //hobbies: [],
         },
         // } as Person,
diff --git a/server/services/auth/controllers/userAdmin/updateUserAdm.ts b/server/services/auth/controllers/userAdmin/updateUserAdm.ts
index 1d291da..708275a 100644
--- a/server/services/auth/controllers/userAdmin/updateUserAdm.ts
+++ b/server/services/auth/controllers/userAdmin/updateUserAdm.ts
@@ -13,6 +13,7 @@ export const updateUserADM = async (userData: User) => {
      * password, username, email.
      */
 
+    console.log(userData);
     createLog(
         "info",
         "apiAuthedRoute",
@@ -46,6 +47,7 @@ export const updateUserADM = async (userData: User) => {
         username: userData.username ? userData.username : upd_user?.username,
         password: password,
         email: userData.email ? userData.email : upd_user.email,
+        role: userData.role ? userData.role : upd_user.role,
     };
 
     // term ? ilike(posts.title, term) : undefined