add all suppress modal

frontend/src/components/Users/Row/index.tsx

@@ -2,7 +2,6 @@ import { ActionIcon, Badge, Box, Table, Tooltip } from "@mantine/core";
 import { t } from "@/config/i18n";
 import { IconEdit, IconX } from "@tabler/icons-react";
 import { type User } from "@/services/resources/users";
-import { useDeleteUser } from "@/services/api";
 import { useNavigate, useSearchParams } from "react-router";
 
 export type UserRowProps = {
@@ -11,36 +10,31 @@ export type UserRowProps = {
 
 export default function UserRow({ user }: UserRowProps) {
     const [searchParams] = useSearchParams();
-    const deleteMutation = useDeleteUser();
     const navigate = useNavigate();
 
     return (
         <Table.Tr key={user.id}>
             <Table.Td>{user.name}</Table.Td>
             <Table.Td>{user.email}</Table.Td>
-            <Table.Td style={{maxWidth: 200}}>
+            <Table.Td style={{ maxWidth: 200 }}>
                 <Box
                     style={{
-                        display: 'flex',
-                        gap: 4
+                        display: "flex",
+                        gap: 4,
                     }}
                 >
-                {user.roles.slice(0, 3).map((value) => (
-                    <Badge key={value.id} size="xs">
-                        {t(value.name, { capfirst: true })}
-                    </Badge>
-                ))}
-                {
-                    user.roles.length > 3 && (
-                        <Tooltip
-                            label={user.roles.slice(3).map(role=>`${role.name} `)}
-                        >
+                    {user.roles.slice(0, 3).map((value) => (
+                        <Badge key={value.id} size="xs">
+                            {t(value.name, { capfirst: true })}
+                        </Badge>
+                    ))}
+                    {user.roles.length > 3 && (
+                        <Tooltip label={user.roles.slice(3).map((role) => `${role.name} `)}>
                             <Badge size="xs" variant="light">
                                 +{user.roles.length - 3}
                             </Badge>
                         </Tooltip>
-                    )
-                }
+                    )}
                 </Box>
             </Table.Td>
             <Table.Td>
@@ -63,8 +57,11 @@ export default function UserRow({ user }: UserRowProps) {
                         color="red"
                         size="sm"
                         mr="5"
-                        onClick={() => {
-                            deleteMutation.mutate(user.id);
+                        onClick={(e) => {
+                            e.stopPropagation();
+                            navigate(
+                                `/dashboard/users/${user.id}/delete${searchParams ? `?${searchParams.toString()}` : ""}`,
+                            );
                         }}
                     >
                         <IconX />