fix(dashboard): Fix boolean faceted filters

packages/dashboard/src/lib/components/data-table/data-table-faceted-filter.tsx

@@ -69,6 +69,7 @@ export function DataTableFacetedFilter<TData, TValue>({
             setResolvedOptions(options);
         }
     }, [optionsFn]);
+    const isBoolean = (column?.columnDef?.meta as any)?.fieldInfo.type === 'Boolean';
 
     return (
         <Popover>
@@ -108,7 +109,7 @@ export function DataTableFacetedFilter<TData, TValue>({
             </PopoverTrigger>
             <PopoverContent className="w-[200px] p-0" align="start">
                 <Command>
-                    <CommandInput placeholder={title} />
+                    {resolvedOptions.length > 2 ? <CommandInput placeholder={title} /> : null}
                     <CommandList>
                         <CommandEmpty>No results found.</CommandEmpty>
                         <CommandGroup>
@@ -118,26 +119,47 @@ export function DataTableFacetedFilter<TData, TValue>({
                                     <CommandItem
                                         key={option.value}
                                         onSelect={() => {
-                                            if (isSelected) {
-                                                selectedValues.delete(option.value);
+                                            if (isBoolean) {
+                                                // Radio button behavior: single selection only
+                                                if (isSelected) {
+                                                    // Deselect if clicking the same option
+                                                    column?.setFilterValue(undefined);
+                                                } else {
+                                                    // Select only this option
+                                                    column?.setFilterValue({ eq: option.value });
+                                                }
                                             } else {
-                                                selectedValues.add(option.value);
+                                                // Checkbox behavior: multi-selection
+                                                if (isSelected) {
+                                                    selectedValues.delete(option.value);
+                                                } else {
+                                                    selectedValues.add(option.value);
+                                                }
+                                                const filterValues = Array.from(selectedValues);
+                                                column?.setFilterValue(
+                                                    filterValues.length ? filterValues : undefined,
+                                                );
                                             }
-                                            const filterValues = Array.from(selectedValues);
-                                            column?.setFilterValue(
-                                                filterValues.length ? filterValues : undefined,
-                                            );
                                         }}
                                     >
                                         <div
                                             className={cn(
-                                                'mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary',
+                                                'mr-2 flex h-4 w-4 items-center justify-center border border-primary',
+                                                isBoolean ? 'rounded-full' : 'rounded-sm',
                                                 isSelected
                                                     ? 'bg-primary text-primary-foreground'
-                                                    : 'opacity-50 [&_svg]:invisible',
+                                                    : isBoolean
+                                                      ? '' // Empty circle for unselected radio buttons
+                                                      : 'opacity-50 [&_svg]:invisible', // Grey checkbox for unselected checkboxes
                                             )}
                                         >
-                                            <Check />
+                                            {isBoolean ? (
+                                                isSelected && (
+                                                    <div className="h-2 w-2 rounded-full bg-primary-foreground" />
+                                                )
+                                            ) : (
+                                                <Check />
+                                            )}
                                         </div>
                                         {option.icon && (
                                             <option.icon className="mr-2 h-4 w-4 text-muted-foreground" />

packages/dashboard/src/lib/components/shared/paginated-list-data-table.tsx

@@ -394,17 +394,6 @@ export function PaginatedListDataTable<
         return { ...acc, [field]: direction };
     }, {});
 
-    const filter = columnFilters?.length
-        ? {
-              _and: columnFilters.map(f => {
-                  if (Array.isArray(f.value)) {
-                      return { [f.id]: { in: f.value } };
-                  }
-                  return { [f.id]: f.value };
-              }),
-          }
-        : undefined;
-
     function refetchPaginatedList() {
         queryClient.invalidateQueries({ queryKey });
     }
@@ -438,6 +427,17 @@ export function PaginatedListDataTable<
         }));
     const minimalListQuery = includeOnlySelectedListFields(extendedListQuery, visibleColumns);
 
+    const filter = columnFilters?.length
+        ? {
+              _and: columnFilters.map(f => {
+                  if (Array.isArray(f.value)) {
+                      return { [f.id]: { in: f.value } };
+                  }
+                  return { [f.id]: f.value };
+              }),
+          }
+        : undefined;
+
     const defaultQueryKey = [
         PaginatedListDataTableKey,
         minimalListQuery,