From e086ace6134616d5e4e531449396688c2056d8c3 Mon Sep 17 00:00:00 2001
From: Kavin Venkatachalam <kavin.saratha@gmail.com>
Date: Mon, 10 Mar 2025 15:22:04 +0530
Subject: [PATCH] fix: Fixed multiple filter issue and minimum width issue

---
 .../Header/_components/Filter/filterUtils.js           |  8 ++++++++
 .../src/AppBuilder/Widgets/NewTable/_hooks/useTable.js | 10 ++++++++--
 .../Widgets/NewTable/_utils/generateColumnsData.js     |  8 ++------
 3 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/Filter/filterUtils.js b/frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/Filter/filterUtils.js
index d1bf3a096f..cd85a63795 100644
--- a/frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/Filter/filterUtils.js
+++ b/frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/Filter/filterUtils.js
@@ -100,3 +100,11 @@ const shouldFireEvent = (diff, filter) => {
       return false;
   }
 };
+
+export const applyFilters = (row, columnId, columnFilters) =>
+  columnFilters.every((filter) => {
+    const { value, condition } = filter.value;
+    const filterFn = filterFunctions[condition];
+    const result = filterFn(row, columnId, { value });
+    return result;
+  });
diff --git a/frontend/src/AppBuilder/Widgets/NewTable/_hooks/useTable.js b/frontend/src/AppBuilder/Widgets/NewTable/_hooks/useTable.js
index 294c74d2c6..b622b0a87f 100644
--- a/frontend/src/AppBuilder/Widgets/NewTable/_hooks/useTable.js
+++ b/frontend/src/AppBuilder/Widgets/NewTable/_hooks/useTable.js
@@ -6,7 +6,7 @@ import {
   getPaginationRowModel,
   getFilteredRowModel,
 } from '@tanstack/react-table';
-import { filterFunctions } from '../_components/Header/_components/Filter/filterUtils';
+import { applyFilters } from '../_components/Header/_components/Filter/filterUtils';
 
 export function useTable({
   data,
@@ -55,7 +55,13 @@ export function useTable({
     onColumnOrderChange: setColumnOrder,
     onGlobalFilterChange: setGlobalFilter,
     onColumnFiltersChange: setColumnFilters,
-    filterFns: filterFunctions,
+    filterFns: {
+      applyFilters: (row, columnId) => {
+        const filters = columnFilters.filter((f) => f.id === columnId);
+        if (filters.length === 0) return true;
+        return applyFilters(row, columnId, filters);
+      },
+    },
     globalFilterFn: (row, columnId, filterValue) => {
       const value = String(row.getValue(columnId) || '').toLowerCase();
       return value.includes(String(filterValue).toLowerCase());
diff --git a/frontend/src/AppBuilder/Widgets/NewTable/_utils/generateColumnsData.js b/frontend/src/AppBuilder/Widgets/NewTable/_utils/generateColumnsData.js
index ea55ec1e91..868ab5a0c1 100644
--- a/frontend/src/AppBuilder/Widgets/NewTable/_utils/generateColumnsData.js
+++ b/frontend/src/AppBuilder/Widgets/NewTable/_utils/generateColumnsData.js
@@ -3,7 +3,6 @@ import _ from 'lodash';
 import moment from 'moment';
 import { v4 as uuidv4 } from 'uuid';
 import useStore from '@/AppBuilder/_stores/store';
-import { filterFunctions } from '../_components/Header/_components/Filter/filterUtils';
 import {
   StringColumn,
   NumberColumn,
@@ -89,12 +88,9 @@ export default function generateColumnsData({
         enableResizing: true,
         enableHiding: true,
         enableColumnFilter: true,
-        filterFn: (row, columnId, filterValue) => {
-          const { condition, value } = filterValue;
-          return filterFunctions[condition](row, columnId, { value });
-        },
+        filterFn: 'applyFilters',
         size: columnSize || defaultColumn.width,
-        minSize: 30,
+        minSize: 60,
         show: column?.columnVisibility ?? true,
         meta: {
           columnType,