wrapping some agent components.

src/components/wrappers/table/data-table-with-pagination.tsx

@@ -30,9 +30,9 @@ export function DataTableWithPagination<TData, TValue>({columns, data}: DataTabl
     })
 
     return (
-        <div className="flex flex-col justify-between h-full">
+        <div>
             <DataTable table={table}/>
-            <TablePagination table={table} pageSizeOptions={[5, 10, 20, 50, 100]}/>
+            <TablePagination table={table}/>
         </div>
     )
 }

src/components/wrappers/table/table-pagination-size.tsx

@@ -1,4 +1,3 @@
-import {useEffect} from "react";
 import {Select, SelectContent, SelectItem, SelectTrigger, SelectValue} from "@/components/ui/select";
 import {cn} from "@/lib/utils";
 
@@ -13,12 +12,8 @@ export const TablePaginationSize = (props: tablePaginationSizeProps) => {
 
     const {className, table, pageSizeOptions = [10, 20, 30, 40, 50]} = props
 
-    useEffect(() => {
-        table.setPageSize(Number(pageSizeOptions[0]))
-    }, []);
-
     return (
-        <div className={cn("flex items-center justify-center space-x-2", className)}>
+        <div className={cn("flex items-center space-x-2", className)}>
             <p className="whitespace-nowrap text-sm font-medium">Rows per page</p>
             <Select
                 value={`${table.getState().pagination.pageSize}`}

src/components/wrappers/table/table-pagination.tsx

@@ -8,17 +8,16 @@ interface tablePaginationProps {
     className?: string
     table: any
     maxVisiblePages?: number
-    pageSizeOptions?: number[]
 }
 
 export function TablePagination(props: tablePaginationProps) {
 
-    const {className, table, maxVisiblePages = 3, pageSizeOptions = [10, 20, 30, 40, 50]} = props
+    const {className, table, maxVisiblePages = 3} = props
 
     return (
-        <div className={cn("flex mt-6", className)}>
-            <TablePaginationSize table={table} pageSizeOptions={pageSizeOptions}/>
-            <TablePaginationNavigation table={table} maxVisiblePages={maxVisiblePages} className="justify-end"/>
+        <div className={cn("flex justify-between mt-8", className)}>
+            <TablePaginationSize table={table}/>
+            <TablePaginationNavigation table={table} maxVisiblePages={maxVisiblePages}/>
         </div>
     )
 }