feat(inquiries): Add filtering functionality to inquiries list table

- Create new InquiriesListFilters component with search and status filter fields
- Integrate filter modal into inquiries table with form handling
- Add INQUIRY_STATUS enum with pending, reviewed, approved, and rejected statuses
- Implement URL-based query parameter management for filter persistence
- Add form state management using react-hook-form with watch and setValue utilities
- Connect filter search to useGetInquiries hook to fetch filtered results
- Support clearing individual filter fields and closing filter modal

src/components/Tables/inquiries/useInquiriesListPresenter.ts

@@ -4,12 +4,17 @@ import {
   useGetInquiries,
 } from "@/hooks/queries/useInquiryQueries";
 import { TInquiries } from "@/lib/api";
-import { useState } from "react";
+import { deleteEmptyKeys } from "@/utils/shared";
+import { useIsMutating } from "@tanstack/react-query";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
 
 const useInquiriesListPresenter = () => {
   const [isFilterModalOpen, setIsFilterModalOpen] = useState(false);
   const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
   const [currentInquiry, setCurrentInquiry] = useState<TInquiries | null>(null);
+  const [params, setParams] = useState<Record<string, any>>({});
   const columns = [
     "row",
     "company name",
@@ -19,12 +24,44 @@ const useInquiriesListPresenter = () => {
     "created at",
     "actions",
   ];
-  const { data, isPending } = useGetInquiries();
+  const router = useRouter();
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+  const isMutating = useIsMutating();
+
+  const {
+    register: filterRegister,
+    handleSubmit: handleFilterSubmit,
+    reset: filterFormReset,
+    watch,
+    setValue: setFilterValue,
+  } = useForm();
+
+  useEffect(() => {
+    const newParams: Record<string, any> = {};
+    for (const [key, value] of searchParams.entries()) {
+      newParams[key] = value;
+    }
+    setParams(newParams);
+    filterFormReset(newParams);
+  }, [searchParams, filterFormReset]);
+
+  const { data, isPending } = useGetInquiries(params);
   const { mutate } = useDeleteInquiry(() => setIsDeleteModalOpen(false));
+
+  const search = (data: any) => {
+    const newParams = { ...params, ...data };
+    const cleanedParams = deleteEmptyKeys(newParams);
+    const queryString = new URLSearchParams(cleanedParams).toString();
+    router.push(`${pathname}?${queryString}`);
+    setIsFilterModalOpen(false);
+  };
+
   const deleteInquiry = () => {
     if (!currentInquiry?.id) return;
     mutate(currentInquiry.id);
   };
+
   return {
     columns,
     inquiries: data?.data.inquiries,
@@ -36,6 +73,12 @@ const useInquiriesListPresenter = () => {
     currentInquiry,
     setCurrentInquiry,
     deleteInquiry,
+    filterRegister,
+    handleFilterSubmit,
+    search,
+    watch,
+    setFilterValue,
+    isMutating,
   };
 };