IO-3365 Push Filters to Query

Signed-off-by: Allan Carr <allan@imexsystems.ca>

client/src/graphql/bills.queries.js

@@ -20,8 +20,8 @@ export const DELETE_BILL = gql`
 `;
 
 export const QUERY_ALL_BILLS_PAGINATED = gql`
-  query QUERY_ALL_BILLS_PAGINATED($offset: Int, $limit: Int, $order: [bills_order_by!]!) {
-    bills(offset: $offset, limit: $limit, order_by: $order) {
+  query QUERY_ALL_BILLS_PAGINATED($offset: Int, $limit: Int, $order: [bills_order_by!]!, $where: bills_bool_exp) {
+    bills(offset: $offset, limit: $limit, order_by: $order, where: $where) {
       id
       vendorid
       vendor {

client/src/pages/bills/bills.page.component.jsx

@@ -31,7 +31,7 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
   const history = useNavigate();
   const [state, setState] = useLocalStorage("bills_list_sort", {
     sortedInfo: {},
-    filteredInfo: { text: "" }
+    filteredInfo: { vendorname: [] }
   });
   const Templates = TemplateList("bill");
   const { t } = useTranslation();
@@ -48,8 +48,7 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
         vendor: { name: order === "descend" ? "desc" : "asc" }
       }),
       filters: (vendorsData?.vendors || []).map((v) => ({ text: v.name, value: v.id })),
-      filteredValue: state.filteredInfo.vendorname || null,
-      onFilter: (value, record) => record.vendorid === value,
+      filteredValue: search.vendorIds ? search.vendorIds.split(",") : null,
       sortOrder: state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
       render: (text, record) => <span>{record.vendor.name}</span>
     },
@@ -165,20 +164,36 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
   ];
 
   const handleTableChange = (pagination, filters, sorter) => {
-    // Persist filters (including vendorname) and sorting
-    setState({ ...state, filteredInfo: { ...state.filteredInfo, ...filters }, sortedInfo: sorter });
+    setState({
+      sortedInfo: sorter,
+      filteredInfo: { ...state.filteredInfo, vendorname: filters.vendorname || [] }
+    });
+
     search.page = pagination.current;
+    if (filters.vendorname && filters.vendorname.length) {
+      search.vendorIds = filters.vendorname.join(",");
+    } else {
+      delete search.vendorIds;
+    }
     if (sorter && sorter.column && sorter.column.sortObject) {
       search.searchObj = JSON.stringify(sorter.column.sortObject(sorter.order));
+      delete search.sortcolumn;
+      delete search.sortorder;
     } else {
       delete search.searchObj;
       search.sortcolumn = sorter.order ? sorter.columnKey : null;
       search.sortorder = sorter.order;
     }
-    search.sort = JSON.stringify({ [sorter.columnKey]: sorter.order });
     history({ search: queryString.stringify(search) });
   };
 
+  useEffect(() => {
+    if (!search.vendorIds && state.filteredInfo.vendorname && state.filteredInfo.vendorname.length) {
+      search.vendorIds = state.filteredInfo.vendorname.join(",");
+      history({ search: queryString.stringify(search) });
+    }
+  }, []);
+
   useEffect(() => {
     if (search.search && search.search.trim() !== "") {
       searchBills();

client/src/pages/bills/bills.page.container.jsx

@@ -49,7 +49,8 @@ export function BillsPageContainer({ setBreadcrumbs, setSelectedHeader }) {
           : {
               [sortcolumn || "date"]: sortorder ? (sortorder === "descend" ? "desc" : "asc") : "desc"
             }
-      ]
+      ],
+      where: searchParams.vendorIds ? { vendorid: { _in: searchParams.vendorIds.split(",") } } : undefined
     }
   });