feat(tables): integrate EmptyListWrapper component for improved empty state handling

- Add EmptyListWrapper to various tables (Admins, Companies, Customers, Feedback, Notification History, Tenders) to provide a consistent empty state message when no data is available.
- Update phone number and status display logic in the Profile page to handle null values gracefully.
- Introduce worktree setup configuration in worktrees.json for easier project setup.

src/components/Tables/customers/index.tsx

@@ -5,6 +5,7 @@ import { Building } from "@/components/Layouts/sidebar/icons";
 import ConfirmationModal from "@/components/ui/ConfirmationModal";
 import ListHeader from "@/components/ui/ListHeader";
 import Modal from "@/components/ui/modal";
+import Pagination from "@/components/ui/pagination";
 import Status from "@/components/ui/Status";
 import {
   Table,
@@ -30,6 +31,7 @@ const CustomersTable = () => {
     router,
     columns,
     allCustomers,
+    metadata,
     isModalOpen,
     assignSelectedCompanies,
     selectedCompanies,
@@ -48,6 +50,7 @@ const CustomersTable = () => {
     watch,
     setFilterValue,
     isMutating,
+    setParams,
   } = useCustomerListPresenter();
   return (
     <div className="flex flex-col rounded-[10px] bg-white px-7.5 pb-4 pt-7.5 shadow-1 dark:bg-gray-dark dark:shadow-card">
@@ -170,6 +173,17 @@ const CustomersTable = () => {
           </EmptyListWrapper>
         </TableBody>
       </Table>
+      <Pagination
+        currentPage={metadata?.page ? metadata?.page - 1 : 0}
+        totalPages={metadata?.pages ?? 1}
+        onPageChange={(e) => {
+          setParams((currentParams) => ({
+            ...currentParams,
+            offset: e.selected * (metadata?.limit ?? 10),
+            limit: metadata?.limit ?? 10,
+          }));
+        }}
+      />
       <Modal
         isOpen={isFilterModalOpen}
         onClose={() => setIsFilterModalOpen(false)}

src/components/Tables/customers/useCustomerListPresenter.ts

@@ -2,14 +2,15 @@
 
 import {
   useAssignCompany,
-  useCustomersInfiniteQuery,
+  useCustomersQuery,
   useDeleteCustomerQuery,
 } from "@/hooks/queries";
 import { TAssignCustomerToCompanyCredentials, TCustomer } from "@/lib/api";
+import { apiDefaultParams } from "@/constants/Api_Params";
 import { deleteEmptyKeys } from "@/utils/shared";
 import { useIsMutating } from "@tanstack/react-query";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { useEffect, useState } from "react";
+import { usePathname, useRouter } from "next/navigation";
+import { useState } from "react";
 import { useForm } from "react-hook-form";
 
 const useCustomerListPresenter = () => {
@@ -25,8 +26,9 @@ const useCustomerListPresenter = () => {
 
   const [isModalOpen, setIsModalOpen] = useState(false);
   const pathName = usePathname();
-  const searchParams = useSearchParams();
-  const [params, setParams] = useState<Record<string, any>>({});
+  const [params, setParams] = useState<Record<string, any>>({
+    ...apiDefaultParams,
+  });
   const router = useRouter();
   const isMutating = useIsMutating();
 
@@ -38,18 +40,7 @@ const useCustomerListPresenter = () => {
     setValue: setFilterValue,
   } = useForm();
 
-  useEffect(() => {
-    const newParams: Record<string, any> = {
-      sort: "created_at",
-    };
-    for (const [key, value] of searchParams.entries()) {
-      newParams[key] = value;
-    }
-    setParams(newParams);
-    filterFormReset(newParams);
-  }, [searchParams, filterFormReset]);
-
-  const { data, isPending } = useCustomersInfiniteQuery(params);
+  const { data, isPending } = useCustomersQuery(params);
   const { mutate: deleteCustomer } = useDeleteCustomerQuery(() =>
     setIsModalOpen(false),
   );
@@ -61,8 +52,9 @@ const useCustomerListPresenter = () => {
   );
 
   const search = (data: any) => {
-    const newParams = { ...params, ...data };
+    const newParams = { ...params, ...data, offset: 0 };
     const cleanedParams = deleteEmptyKeys(newParams);
+    setParams(cleanedParams);
     const queryString = new URLSearchParams(cleanedParams).toString();
     router.push(`${pathName}?${queryString}`);
     setIsFilterModalOpen(false);
@@ -85,9 +77,10 @@ const useCustomerListPresenter = () => {
     }
   };
 
-  const customers = data?.pages.flatMap((page) => page.data.customers) ?? [];
+  const customers = data?.data?.customers ?? [];
   return {
     allCustomers: customers,
+    metadata: data?.meta,
     currentCustomer,
     columns,
     isPending,
@@ -110,6 +103,7 @@ const useCustomerListPresenter = () => {
     watch,
     setFilterValue,
     isMutating,
+    setParams,
   };
 };