Search implemented

src/Pages/MasterModule/JobStatus/JobStatus.tsx

@@ -8,6 +8,7 @@ import { useGetJobStatusQuery, useJobStatusToggleMutation } from "../../../Redux
 import { useEffect, useState } from "react";
 import SearchComponent from "../../../components/SearchComponent";
 import { toaster } from "../../../components/ui/toaster";
+import { useDebounce } from "../../../components/Hooks/useDebounce";
 
 
 
@@ -37,9 +38,11 @@ const tableHeadRow = [
 
 const JobStatus = () => {
   const [currentPage, setCurrentPage] = useState(1);
-  const { data, refetch } = useGetJobStatusQuery(currentPage)
-  const [localData, setLocalData] = useState<any[]>([]);
   const [searchTerm, setSearchTerm] = useState("");
+  const debouncedSearchTerm = useDebounce(searchTerm, 500);
+  const queryArgs = debouncedSearchTerm ? { page: currentPage, search: debouncedSearchTerm } : { page: currentPage };
+  const { data, refetch, isError, isFetching } = useGetJobStatusQuery(queryArgs)
+  const [localData, setLocalData] = useState<any[]>([]);
   const [jobStatusToggle] = useJobStatusToggleMutation()
   console.log(data?.data.data)
 
@@ -53,6 +56,11 @@ const JobStatus = () => {
     setCurrentPage(page);
   };
 
+  const handleSearchChange = (value: string) => {
+    setSearchTerm(value);
+    setCurrentPage(1);
+  };
+
   const handleToggle = async (agencyId: string, currentStatus: number) => {
     const newStatus = currentStatus ? 0 : 1;
     setLocalData((prevData) =>
@@ -125,11 +133,7 @@ const JobStatus = () => {
           <HStack >
             <SearchComponent
               value={searchTerm}
-              onChange={(value) => {
-                setSearchTerm(value);
-                // setCurrentPage(1);
-                refetch()
-              }}
+              onChange={handleSearchChange}
             />
             {/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
             <JobStatusAddModel refetch={refetch} />
@@ -146,6 +150,8 @@ const JobStatus = () => {
             total: data?.data.total || 0
           }}
           onPageChange={handlePageChange}
+          isLoading={isFetching}
+          isError={isError}
         />
       </Box>
     </MainFrame>

src/Redux/Service/job.status.ts

@@ -51,8 +51,18 @@ export const jobStatus = createApi({
             }),
         }),
         // 🔹 GET: Fetch all posts
-        getJobStatus: builder.query<ApiResponse, number>({
-            query: (page = 1) => `/job-status-list?page=${page}`,
+        // getJobStatus: builder.query<ApiResponse, number>({
+        //     query: (page = 1) => `/job-status-list?page=${page}`,
+        // }),
+
+        getJobStatus: builder.query<ApiResponse, { page?: number; search?: string }>({
+            query: ({ page, search }) => {
+                const params = new URLSearchParams();
+                if (page) params.append("page", page.toString());
+                if (search) params.append("search", search);
+
+                return `/job-status-list?${params.toString()}`;
+            },
         }),
 
         updateJobStatus: builder.mutation({