diff --git a/src/components/UserSetting.tsx b/src/components/UserSetting.tsx
index 6c23dd3..0154d36 100644
--- a/src/components/UserSetting.tsx
+++ b/src/components/UserSetting.tsx
@@ -471,7 +471,7 @@ export default function UserSetting({ permissions }: { permissions: JsonValue[]
                     <Table.Td>{v.name}</Table.Td>
                     <Table.Td>{v.phone}</Table.Td>
                     <Table.Td>{v.email}</Table.Td>
-                    <Table.Td>{v.roleId}</Table.Td>
+                    <Table.Td>{v.nameRole}</Table.Td>
                     <Table.Td>
                       <Group>
                         <Tooltip label={permissions.includes('setting.user.edit') ? "Edit User" : "Edit User - Anda tidak memiliki akses"}>
diff --git a/src/server/routes/user_route.ts b/src/server/routes/user_route.ts
index ec189bd..6ceddd3 100644
--- a/src/server/routes/user_route.ts
+++ b/src/server/routes/user_route.ts
@@ -1,5 +1,6 @@
 import Elysia, { t } from "elysia";
 import type { User } from "generated/prisma";
+import _ from "lodash";
 import { prisma } from "../lib/prisma";
 
 const UserRoute = new Elysia({
@@ -145,10 +146,27 @@ const UserRoute = new Elysia({
                 NOT: {
                     id: user.id
                 }
+            },
+            select: {
+                id: true,
+                name: true,
+                phone: true,
+                email: true,
+                roleId: true,
+                Role: {
+                    select: {
+                        name: true
+                    }
+                }
             }
         })
 
-        return data
+        const dataFix = data.map((item: any) => ({
+            ..._.omit(item, ["Role"]),
+            nameRole: item.Role?.name,
+        }))
+
+        return dataFix
     }, {
         detail: {
             summary: "list",