diff --git a/client/src/components/bills-list-table/bills-list-table.component.jsx b/client/src/components/bills-list-table/bills-list-table.component.jsx
index 4b46fad21..8b1d8e09c 100644
--- a/client/src/components/bills-list-table/bills-list-table.component.jsx
+++ b/client/src/components/bills-list-table/bills-list-table.component.jsx
@@ -109,6 +109,13 @@ export function BillsListTableComponent({
       key: "vendorname",
       sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
       sortOrder: state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
+      filters: bills
+        ? [...new Set(bills.map((bill) => bill.vendor.name))].map((name) => ({
+            text: name,
+            value: name
+          }))
+        : [],
+      onFilter: (value, record) => record.vendor.name === value,
       render: (text, record) => <span>{record.vendor.name}</span>
     },
     {
diff --git a/client/src/pages/bills/bills.page.component.jsx b/client/src/pages/bills/bills.page.component.jsx
index 292cdd9dc..db9145984 100644
--- a/client/src/pages/bills/bills.page.component.jsx
+++ b/client/src/pages/bills/bills.page.component.jsx
@@ -1,5 +1,6 @@
 import { EditFilled, SyncOutlined } from "@ant-design/icons";
 import { Button, Card, Checkbox, Input, Space, Table, Typography } from "antd";
+import { useQuery } from "@apollo/client";
 import axios from "axios";
 import queryString from "query-string";
 import { useEffect, useState } from "react";
@@ -16,6 +17,7 @@ import { TemplateList } from "../../utils/TemplateConstants";
 import { pageLimit } from "../../utils/config";
 import { alphaSort, dateSort } from "../../utils/sorters";
 import useLocalStorage from "../../utils/useLocalStorage";
+import { QUERY_ALL_VENDORS } from "../../graphql/vendors.queries";
 
 const mapDispatchToProps = (dispatch) => ({
   setBillEnterContext: (context) => dispatch(setModalContext({ context: context, modal: "billEnter" }))
@@ -33,25 +35,22 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
   });
   const Templates = TemplateList("bill");
   const { t } = useTranslation();
+
+  const { data: vendorsData } = useQuery(QUERY_ALL_VENDORS);
+
   const columns = [
     {
       title: t("bills.fields.vendorname"),
       dataIndex: "vendorname",
       key: "vendorname",
-      // sortObject: (direction) => {
-      //   return {
-      //     vendor: {
-      //       name: direction
-      //         ? direction === "descend"
-      //           ? "desc"
-      //           : "asc"
-      //         : "desc",
-      //     },
-      //   };
-      // },
-      // sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
-      // sortOrder:
-      //   state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
+      sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
+      sortObject: (order) => ({
+        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,
+      sortOrder: state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
       render: (text, record) => <span>{record.vendor.name}</span>
     },
     {
@@ -65,20 +64,11 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
       title: t("jobs.fields.ro_number"),
       dataIndex: "ro_number",
       key: "ro_number",
-      // sortObject: (direction) => {
-      //   return {
-      //     job: {
-      //       ro_number: direction
-      //         ? direction === "descend"
-      //           ? "desc"
-      //           : "asc"
-      //         : "desc",
-      //     },
-      //   };
-      // },
-      // sorter: (a, b) => alphaSort(a.job.ro_number, b.job.ro_number),
-      // sortOrder:
-      //   state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order,
+      sorter: (a, b) => alphaSort(a.job.ro_number, b.job.ro_number),
+      sortObject: (order) => ({
+        job: { ro_number: order === "descend" ? "desc" : "asc" }
+      }),
+      sortOrder: state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order,
       render: (text, record) => record.job && <Link to={`/manage/jobs/${record.job.id}`}>{record.job.ro_number}</Link>
     },
     {
@@ -175,7 +165,8 @@ export function BillsListPage({ loading, data, refetch, total, setBillEnterConte
   ];
 
   const handleTableChange = (pagination, filters, sorter) => {
-    setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
+    // Persist filters (including vendorname) and sorting
+    setState({ ...state, filteredInfo: { ...state.filteredInfo, ...filters }, sortedInfo: sorter });
     search.page = pagination.current;
     if (sorter && sorter.column && sorter.column.sortObject) {
       search.searchObj = JSON.stringify(sorter.column.sortObject(sorter.order));