del request

src/pages/requests/RequestList.tsx

@@ -1,15 +1,30 @@
 import Filters from '@/components/Filters'
 import Table from '@/components/Table'
+import TrashWithConfrim from '@/components/TrashWithConfrim'
+import { extractErrorMessage } from '@/config/func'
 import { type FC } from 'react'
-import { useGetRequests } from './hooks/useRequestData'
+import { useDeleteRequest, useGetRequests } from './hooks/useRequestData'
 import moment from 'moment-jalaali'
 import { Link } from 'react-router-dom'
 import { Paths } from '@/config/Paths'
 import { Eye } from 'iconsax-react'
+import { toast } from 'react-toastify'
 
 const RequestList: FC = () => {
 
     const { data } = useGetRequests()
+    const { mutate: deleteRequest, isPending: isDeleting } = useDeleteRequest()
+
+    const handleDelete = (id: string) => {
+        deleteRequest(id, {
+            onSuccess: () => {
+                toast.success('درخواست با موفقیت حذف شد')
+            },
+            onError: (error) => {
+                toast.error(extractErrorMessage(error))
+            },
+        })
+    }
 
     return (
         <div className='mt-5'>
@@ -107,7 +122,11 @@ const RequestList: FC = () => {
                                             <Eye size={20} color='#8C90A3' />
                                         </Link>
 
-                                        {/* <Setting2 size={20} color='#00B89F' /> */}
+                                        <TrashWithConfrim
+                                            onDelete={() => handleDelete(item.id)}
+                                            isloading={isDeleting}
+                                            colorIcon='red'
+                                        />
                                     </div>
                                 )
                             }

src/pages/requests/hooks/useRequestData.ts

@@ -1,5 +1,5 @@
 import * as api from "../service/RequestService";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 export const useGetRequests = () => {
   return useQuery({
@@ -15,3 +15,14 @@ export const useGetRequestDetail = (id: string) => {
     enabled: !!id,
   });
 };
+
+export const useDeleteRequest = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: api.deleteRequest,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["requests"] });
+    },
+  });
+};

src/pages/requests/service/RequestService.ts

@@ -14,3 +14,8 @@ export const getRequestDetail = async (id: string) => {
     await axios.get<RequestDetailResponseType>(`/admin/request/${id}`);
   return data;
 };
+
+export const deleteRequest = async (id: string) => {
+  const { data } = await axios.delete(`/admin/request/${id}`);
+  return data;
+};