Merge pull request #461 from ClickHouse/pagination_all_rows

Conditional `All rows` option for `<Pagination/>`

src/components/Pagination/Pagination.test.tsx

@@ -159,4 +159,22 @@ describe("Pagination", () => {
     });
     expect(onChange).not.toHaveBeenCalled();
   });
+
+  it("should not show `All rows` in the page sizes if it's disabled", async () => {
+    const onPageSizeChange = vi.fn();
+    const { getByText, queryByText } = renderPagination({
+      currentPage: 1,
+      onChange,
+      onPageSizeChange,
+      maxRowsPerPageList: [250, 500],
+      allowAllRows: false,
+    });
+    expect(queryByText("All rows")).not.toBeInTheDocument();
+
+    await vi.waitFor(() => {
+      fireEvent.click(getByText("250 rows"));
+      fireEvent.click(getByText("500 rows"));
+      expect(onPageSizeChange).toBeCalledTimes(1);
+    });
+  });
 });

src/components/Pagination/Pagination.tsx

@@ -30,6 +30,7 @@ export interface PaginationProps
   onPageNumberFocus?: FocusEventHandler<HTMLInputElement>;
   onPageNumberBlur?: FocusEventHandler<HTMLInputElement>;
   disableNextButton?: boolean;
+  allowAllRows?: boolean;
 }
 const CustomSelect = styled.div`
   width: 150px;
@@ -51,6 +52,7 @@ export const Pagination = ({
   onPageNumberFocus,
   onPageNumberBlur,
   disableNextButton,
+  allowAllRows = true,
   ...props
 }: PaginationProps): ReactElement => {
   const hasRowCount = ["number", "string"].includes(typeof rowCount);
@@ -129,6 +131,11 @@ export const Pagination = ({
     [currentPage, onChangeProp, onNextPageClick, rightButtonDisabled]
   );
 
+  // if `allowAllRows` is false we need to switch to the first option in the list
+  if (pageSize === -1 && !allowAllRows && maxRowsPerPageList.length > 0) {
+    pageSize = maxRowsPerPageList[0];
+  }
+
   return (
     <Container
       gap={gap}
@@ -201,7 +208,7 @@ export const Pagination = ({
           onSelect={onPageSizeChange}
           value={pageSize.toString()}
         >
-          <Select.Item value="-1">All rows</Select.Item>
+          {allowAllRows && <Select.Item value="-1">All rows</Select.Item>}
           {maxRowsPerPageList.map(option => (
             <Select.Item
               key={option}