diff options
Diffstat (limited to 'components/client-table/client-table-toolbar.tsx')
| -rw-r--r-- | components/client-table/client-table-toolbar.tsx | 23 |
1 files changed, 14 insertions, 9 deletions
diff --git a/components/client-table/client-table-toolbar.tsx b/components/client-table/client-table-toolbar.tsx index 43b0a032..089501e1 100644 --- a/components/client-table/client-table-toolbar.tsx +++ b/components/client-table/client-table-toolbar.tsx @@ -12,6 +12,8 @@ interface ClientTableToolbarProps { visibleRows: number onExport?: () => void actions?: React.ReactNode + customToolbar?: React.ReactNode + viewOptions?: React.ReactNode } export function ClientTableToolbar({ @@ -21,11 +23,13 @@ export function ClientTableToolbar({ visibleRows, onExport, actions, + customToolbar, + viewOptions, }: ClientTableToolbarProps) { return ( - <div className="flex items-center justify-between gap-4 p-1"> - <div className="flex items-center gap-2 flex-1"> - <div className="relative flex-1 max-w-sm"> + <div className="flex w-full items-center justify-between gap-4 p-1 overflow-x-auto"> + <div className="flex items-center gap-2"> + <div className="relative max-w-sm min-w-[200px]"> <Search className="absolute left-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" /> <Input placeholder="Search all columns..." @@ -37,18 +41,19 @@ export function ClientTableToolbar({ <div className="text-sm text-muted-foreground whitespace-nowrap"> Showing {visibleRows} of {totalRows} </div> - </div> - - <div className="flex items-center gap-2"> - {actions} + {viewOptions} {onExport && ( <Button onClick={onExport} variant="outline" size="sm"> <Download className="mr-2 h-4 w-4" /> Export </Button> - )} + )} + </div> + + <div className="flex items-center gap-2 shrink-0"> + {customToolbar} + {actions} </div> </div> ) } - |
