feat: ingredient product

src/views/apps/user/list/UserListTable.tsx

@@ -47,6 +47,10 @@ import TablePaginationComponent from '../../../../components/TablePaginationComp
 import { useUsers } from '../../../../services/queries/users'
 import { User } from '../../../../types/services/user'
 import AddUserDrawer from './AddUserDrawer'
+import { useDispatch } from 'react-redux'
+import { setUser } from '../../../../redux-store/slices/user'
+import { useUsersMutation } from '../../../../services/mutations/users'
+import ConfirmDeleteDialog from '../../../../components/dialogs/confirm-delete'
 
 declare module '@tanstack/table-core' {
   interface FilterFns {
@@ -123,13 +127,15 @@ const userRoleObj: UserRoleType = {
 const columnHelper = createColumnHelper<UsersTypeWithAction>()
 
 const UserListTable = () => {
+  const dispatch = useDispatch()
+
   // States
   const [addUserOpen, setAddUserOpen] = useState(false)
   const [rowSelection, setRowSelection] = useState({})
   const [currentPage, setCurrentPage] = useState(1)
   const [pageSize, setPageSize] = useState(10)
   const [openConfirm, setOpenConfirm] = useState(false)
-  const [customerId, setCustomerId] = useState('')
+  const [userId, setUserId] = useState('')
   const [search, setSearch] = useState('')
 
   // Hooks
@@ -141,7 +147,7 @@ const UserListTable = () => {
     search
   })
 
-  // const { deleteCustomer } = useCustomersMutation()
+  const { deleteUser } = useUsersMutation()
 
   const users = data?.users ?? []
   const totalCount = data?.pagination.total_count ?? 0
@@ -157,11 +163,11 @@ const UserListTable = () => {
     setCurrentPage(1) // Reset to first page
   }, [])
 
-  // const handleDelete = () => {
-  //   deleteCustomer.mutate(customerId, {
-  //     onSuccess: () => setOpenConfirm(false)
-  //   })
-  // }
+  const handleDelete = () => {
+    deleteUser.mutate(userId, {
+      onSuccess: () => setOpenConfirm(false)
+    })
+  }
 
   const columns = useMemo<ColumnDef<UsersTypeWithAction, any>[]>(
     () => [
@@ -236,22 +242,27 @@ const UserListTable = () => {
         header: 'Action',
         cell: ({ row }) => (
           <div className='flex items-center'>
-            <IconButton onClick={() => {}}>
+            <IconButton
+              onClick={() => {
+                setUserId(row.original.id)
+                setOpenConfirm(true)
+              }}
+            >
               <i className='tabler-trash text-textSecondary' />
             </IconButton>
             <OptionMenu
               iconButtonProps={{ size: 'medium' }}
               iconClassName='text-textSecondary'
               options={[
-                {
-                  text: 'Download',
-                  icon: 'tabler-download',
-                  menuItemProps: { className: 'flex items-center gap-2 text-textSecondary' }
-                },
                 {
                   text: 'Edit',
                   icon: 'tabler-edit',
-                  menuItemProps: { className: 'flex items-center gap-2 text-textSecondary' }
+                  menuItemProps: {
+                    onClick: () => {
+                      dispatch(setUser(row.original))
+                      setAddUserOpen(true)
+                    }
+                  }
                 }
               ]}
             />
@@ -298,7 +309,7 @@ const UserListTable = () => {
   return (
     <>
       <Card>
-        <CardHeader title='Filters' className='pbe-4' />
+        {/* <CardHeader title='Filters' className='pbe-4' /> */}
         {/* <TableFilters setData={setFilteredData} tableData={data} /> */}
         <div className='flex justify-between flex-col items-start md:flex-row md:items-center p-6 border-bs gap-4'>
           <DebouncedInput
@@ -432,9 +443,15 @@ const UserListTable = () => {
         />
       </Card>
 
-      <AddUserDrawer
-        open={addUserOpen}
-        handleClose={() => setAddUserOpen(!addUserOpen)}
+      <AddUserDrawer open={addUserOpen} handleClose={() => setAddUserOpen(!addUserOpen)} />
+
+      <ConfirmDeleteDialog
+        open={openConfirm}
+        onClose={() => setOpenConfirm(false)}
+        onConfirm={handleDelete}
+        isLoading={deleteUser.isPending}
+        title='Delete User'
+        message='Are you sure you want to delete this User? This action cannot be undone.'
       />
     </>
   )