feat(companies): implement companies page with data table

This commit introduces a new "Companies" page to the dashboard, providing a comprehensive view of company data in a sortable and paginated table.

Key changes include:
- A new page at `/companies` to display the data table.
- A new API route `/api/companies` that serves mock company data.
- A `CompaniesTable` component built with `react-table` featuring sorting, pagination, and search functionality.
- Reusable `TablePagination` and `TableActions` components to support the table.
- The `moment` library has been added as a dependency to format dates within the table.
- A new `CrossIcon` has been added for UI controls.
- The `InputGroup` component is enhanced with an `autoComplete` prop.
- A link to the new "Companies" page has been added to the sidebar navigation.

src/components/Tables/customers/useCustomerListPresenter.ts

@@ -15,7 +15,8 @@ import { z } from "zod";
 
 const useCustomerListPresenter = () => {
   const deleteModal = useRef<HTMLDialogElement | null>(null);
-  const assignToCompanyModal = useRef<HTMLDialogElement | null>(null);
+  const [isAssignCompanyModalOpen, setIsAssignCompanyModalOpen] =
+    useState(false);
   const { inView } = useInView({ threshold: 0.5 });
   const [selectedCompanies, setSelectedCompanies] =
     useState<TAssignCustomerToCompanyCredentials | null>(null);
@@ -53,7 +54,7 @@ const useCustomerListPresenter = () => {
   const { mutate: assignSelectedCompanies } = useAssignCompany(
     currentCustomer?.id ?? "",
     () => {
-      assignToCompanyModal.current?.close();
+      setIsAssignCompanyModalOpen(false);
     },
   );
   useEffect(() => {
@@ -101,7 +102,8 @@ const useCustomerListPresenter = () => {
     selectedCompanies,
     setSelectedCompanies,
     onConfirmDelete,
-    assignToCompanyModal,
+    setIsAssignCompanyModalOpen,
+    isAssignCompanyModalOpen,
     assignSelectedCompanies,
     pathName,
     router,