diff --git a/src/components/UserSetting.tsx b/src/components/UserSetting.tsx
index 187fcd8..0154d36 100644
--- a/src/components/UserSetting.tsx
+++ b/src/components/UserSetting.tsx
@@ -1,5 +1,6 @@
 import apiFetch from "@/lib/apiFetch";
 import {
+  ActionIcon,
   Button,
   Divider,
   Flex,
@@ -11,10 +12,10 @@ import {
   Table,
   Text,
   Title,
-  Tooltip
+  Tooltip,
 } from "@mantine/core";
 import { useDisclosure, useShallowEffect } from "@mantine/hooks";
-import { IconPlus } from "@tabler/icons-react";
+import { IconEdit, IconPlus, IconTrash } from "@tabler/icons-react";
 import type { JsonValue } from "generated/prisma/runtime/library";
 import { useState } from "react";
 import useSWR from "swr";
@@ -465,49 +466,44 @@ export default function UserSetting({ permissions }: { permissions: JsonValue[]
             </Table.Thead>
             <Table.Tbody>
               {list && Array.isArray(list) && list.length > 0 ? (
-                <Table.Tr>
-                  <Table.Td colSpan={5} align="center">
-                    Ada banyak {JSON.stringify(list)}
-                  </Table.Td>
-                </Table.Tr>
-                // list?.map((v: any) => (
-                //   <Table.Tr key={v.id}>
-                //     <Table.Td>{v.name}</Table.Td>
-                //     <Table.Td>{v.phone}</Table.Td>
-                //     <Table.Td>{v.email}</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"}>
-                //           <ActionIcon
-                //             variant="light"
-                //             size="sm"
-                //             style={{ boxShadow: "0 0 8px rgba(0,255,200,0.2)" }}
-                //             onClick={() => chooseEdit({ data: v })}
-                //             disabled={!permissions.includes('setting.user.edit') || v.roleId == "developer"}
-                //           >
-                //             <IconEdit size={20} />
-                //           </ActionIcon>
-                //         </Tooltip>
-                //         <Tooltip label={permissions.includes('setting.user.delete') ? "Delete User" : "Delete User - Anda tidak memiliki akses"}>
-                //           <ActionIcon
-                //             variant="light"
-                //             size="sm"
-                //             color="red"
-                //             style={{ boxShadow: "0 0 8px rgba(0,255,200,0.2)" }}
-                //             onClick={() => {
-                //               setDataDelete(v.id);
-                //               openDelete();
-                //             }}
-                //             disabled={!permissions.includes('setting.user.delete') || v.roleId == "developer"}
-                //           >
-                //             <IconTrash size={20} />
-                //           </ActionIcon>
-                //         </Tooltip>
-                //       </Group>
-                //     </Table.Td>
-                //   </Table.Tr>
-                // ))
+                list?.map((v: any) => (
+                  <Table.Tr key={v.id}>
+                    <Table.Td>{v.name}</Table.Td>
+                    <Table.Td>{v.phone}</Table.Td>
+                    <Table.Td>{v.email}</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"}>
+                          <ActionIcon
+                            variant="light"
+                            size="sm"
+                            style={{ boxShadow: "0 0 8px rgba(0,255,200,0.2)" }}
+                            onClick={() => chooseEdit({ data: v })}
+                            disabled={!permissions.includes('setting.user.edit') || v.roleId == "developer"}
+                          >
+                            <IconEdit size={20} />
+                          </ActionIcon>
+                        </Tooltip>
+                        <Tooltip label={permissions.includes('setting.user.delete') ? "Delete User" : "Delete User - Anda tidak memiliki akses"}>
+                          <ActionIcon
+                            variant="light"
+                            size="sm"
+                            color="red"
+                            style={{ boxShadow: "0 0 8px rgba(0,255,200,0.2)" }}
+                            onClick={() => {
+                              setDataDelete(v.id);
+                              openDelete();
+                            }}
+                            disabled={!permissions.includes('setting.user.delete') || v.roleId == "developer"}
+                          >
+                            <IconTrash size={20} />
+                          </ActionIcon>
+                        </Tooltip>
+                      </Group>
+                    </Table.Td>
+                  </Table.Tr>
+                ))
               ) : (
                 <Table.Tr>
                   <Table.Td colSpan={5} align="center">
diff --git a/src/server/routes/user_route.ts b/src/server/routes/user_route.ts
index 6ceddd3..9701eb9 100644
--- a/src/server/routes/user_route.ts
+++ b/src/server/routes/user_route.ts
@@ -164,6 +164,10 @@ const UserRoute = new Elysia({
         const dataFix = data.map((item: any) => ({
             ..._.omit(item, ["Role"]),
             nameRole: item.Role?.name,
+            name: String(item.name),
+            phone: String(item.phone),
+            email: String(item.email),
+            roleId: String(item.roleId),
         }))
 
         return dataFix