From 8b02bce98e5634f297c31df4495619a2f8beb9f8 Mon Sep 17 00:00:00 2001
From: Bill Leoutsakos <billleoutsakos@Mac.localdomain>
Date: Sun, 20 Sep 2026 18:47:00 -0700
Subject: [PATCH] improvement(ui): use chips for table filter actions

---
 .../components/table-filter/table-filter.tsx      | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-filter/table-filter.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-filter/table-filter.tsx
index 22496741add..d069f93c6fa 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-filter/table-filter.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-filter/table-filter.tsx
@@ -1,7 +1,7 @@
 'use client'
 
 import { memo, useCallback, useMemo, useRef, useState } from 'react'
-import { Button, ChipInput, ChipSelect, cn } from '@sim/emcn'
+import { Button, Chip, ChipInput, ChipSelect, cn } from '@sim/emcn'
 import { Plus, X } from '@sim/emcn/icons'
 import { generateShortId } from '@sim/utils/id'
 import type { ColumnDefinition, FilterRule, TablePredicate } from '@/lib/table'
@@ -243,20 +243,19 @@ export function TableFilter({
         ))}
 
         <div className={cn('mt-1 flex items-center', !autoApply && 'justify-between')}>
-          <Button variant='ghost' size='sm' onClick={handleAdd} className='px-2 text-xs'>
-            <Plus className='mr-1 size-[10px]' />
+          <Chip type='button' onClick={handleAdd} leftIcon={Plus}>
             Add filter
-          </Button>
+          </Chip>
           {!autoApply && (
             <div className='flex items-center gap-1.5'>
               {filter !== null && (
-                <Button variant='ghost' size='sm' onClick={handleClear} className='px-2 text-xs'>
+                <Chip type='button' onClick={handleClear}>
                   Clear filters
-                </Button>
+                </Chip>
               )}
-              <Button variant='default' size='sm' onClick={handleApply} className='text-xs'>
+              <Chip type='button' variant='border-shadow' onClick={handleApply}>
                 Apply filter
-              </Button>
+              </Chip>
             </div>
           )}
         </div>