feat: add defaultValue support in datatable filters (#704)

Author: rohanchkrabrty

apps/www/src/components/datatable-demo.tsx

@@ -72,10 +72,15 @@ export const columns: DataTableColumnDef<Payment, unknown>[] = [
         value: 'failed'
       }
     ],
-    filterType: 'multiselect',
+    filterType: 'select',
     enableColumnFilter: true,
     enableHiding: true,
-
+    defaultFilterValue: '',
+    filterProps: {
+      select: {
+        autocomplete: true
+      }
+    }
   },
   {
     accessorKey: 'email',

packages/raystack/components/data-table/data-table.types.tsx

@@ -81,6 +81,7 @@ export type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {
   enableHiding?: boolean;
   defaultHidden?: boolean;
   filterOptions?: FilterSelectOption[];
+  defaultFilterValue?: unknown;
   filterProps?: {
     select?: BaseSelectProps;
   };

packages/raystack/components/data-table/hooks/useFilters.tsx

@@ -18,11 +18,12 @@ export function useFilters<TData, TValue>() {
     const dataType = getDataType({ filterType, dataType: columnDef.dataType });
     const defaultFilter = filterOperators[filterType][0];
     const defaultValue =
-      filterType === FilterType.date
+      columnDef.defaultFilterValue ??
+      (filterType === FilterType.date
         ? new Date()
         : filterType === FilterType.select
           ? options[0].value
-          : '';
+          : '');
 
     updateTableQuery(query => {
       return {