@@ -263,21 +263,31 @@ function Pagination<T>({ table }: React.PropsWithChildren<{ table: ReactTable<T>
263
263
< div className = "flex items-center space-x-4" >
264
264
< Select defaultValue = "0"
265
265
value = { `${ pageSize } ` }
266
- onValueChange = { ( value ) => table . setPageSize ( Number ( value ) ) } >
266
+ onValueChange = { ( value ) => {
267
+ let size = Number ( value ) ;
268
+ if ( size === 0 ) {
269
+ for ( let row of table . getExpandedRowModel ( ) . rows ) {
270
+ size += row . getLeafRows ( ) . length ;
271
+ }
272
+ }
273
+ table . setPageSize ( size ) ;
274
+ } } >
267
275
< SelectPrimitive . Trigger >
268
276
< div className = "px-1 py-0 hover:bg-inherit text-muted-foreground text-xs" >
269
277
{ pageIndex * pageSize } -
270
278
{ Math . min ( ( pageIndex + 1 ) * pageSize , rowCount ) } of
271
279
{ rowCount }
272
280
</ div >
273
281
</ SelectPrimitive . Trigger >
274
- < SelectContent side = "top" > < SelectGroup >
275
- < SelectLabel > Rows per page</ SelectLabel >
276
- { [ 10 , 20 , 30 , 40 , 50 ] . map ( ( pageSize ) => (
277
- < SelectItem key = { pageSize } value = { `${ pageSize } ` } >
278
- { pageSize }
279
- </ SelectItem >
280
- ) ) } </ SelectGroup >
282
+ < SelectContent side = "top" >
283
+ < SelectGroup >
284
+ < SelectLabel > Rows per page</ SelectLabel >
285
+ { [ 10 , 20 , 30 , 40 , 50 , 0 ] . map ( ( pageSize ) => (
286
+ < SelectItem key = { pageSize } value = { `${ pageSize } ` } >
287
+ { pageSize > 0 ? pageSize : 'disable pagination' }
288
+ </ SelectItem >
289
+ ) ) }
290
+ </ SelectGroup >
281
291
</ SelectContent >
282
292
</ Select >
283
293
< div className = "flex items-center space-x-2" >
0 commit comments