From ed3380775947236c8e608ca89cf38a981de1b565 Mon Sep 17 00:00:00 2001 From: kishor82 Date: Tue, 19 Dec 2023 11:22:49 +0530 Subject: [PATCH] Added suggested changes and updated tests. Signed-off-by: kishor82 --- .../components/data_grid/data_grid_table.tsx | 4 +++- .../components/utils/page_size_options.ts | 24 ++++++++++--------- .../components/utils/use_pagination.test.ts | 24 +++++++------------ 3 files changed, 25 insertions(+), 27 deletions(-) diff --git a/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx b/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx index 4cd59c57484..99e1c167453 100644 --- a/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx +++ b/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx @@ -18,6 +18,7 @@ import { SortOrder } from '../../../saved_searches/types'; import { buildColumns } from '../../utils/columns'; import { useOpenSearchDashboards } from '../../../../../opensearch_dashboards_react/public'; import { DiscoverServices } from '../../../build_services'; +import { SAMPLE_SIZE_SETTING } from '../../../../common'; export interface DataGridTableProps { columns: string[]; @@ -58,7 +59,8 @@ export const DataGridTable = ({ const [inspectedHit, setInspectedHit] = useState(); const rowCount = useMemo(() => (rows ? rows.length : 0), [rows]); - const pagination = usePagination({ rowCount, services }); + const pageSizeLimit = services.uiSettings.get(SAMPLE_SIZE_SETTING); + const pagination = usePagination({ rowCount, pageSizeLimit }); let adjustedColumns = buildColumns(columns); // handle case where the user removes selected filed and leaves only time column diff --git a/src/plugins/discover/public/application/components/utils/page_size_options.ts b/src/plugins/discover/public/application/components/utils/page_size_options.ts index f5d9b9e0cd0..93e527f129c 100644 --- a/src/plugins/discover/public/application/components/utils/page_size_options.ts +++ b/src/plugins/discover/public/application/components/utils/page_size_options.ts @@ -3,23 +3,25 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { uniq } from 'lodash'; - /** - * Generates an array of pagination options based on the provided `sampleSize`. - * The array includes default values (25, 50, 100) and additional options derived from the `sampleSize` setting. + * Generates an array of pagination options based on the provided `pageSizeLimit`. + * The array includes default values (25, 50, 100) and additional options derived from the `pageSizeLimit` setting. * Ensures uniqueness and sorts the array in ascending order, representing available page size options for pagination. - * @param {number} sampleSize - The sample size used to determine additional pagination options. + * @param {number} pageSizeLimit - The sample size used to determine additional pagination options. * @returns {number[]} - An array of available page size options. */ -export const generatePageSizeOptions = (sampleSize: number): number[] => { - if (sampleSize && sampleSize > 0) { - const maxSize = 500; - const pageSizeFromSetting = [...Array(Math.floor(sampleSize / maxSize)).keys()].map( - (i) => (i + 1) * maxSize +export const generatePageSizeOptions = (pageSizeLimit: number): number[] => { + const isInDefaultRange = pageSizeLimit < defaultPageOptions[defaultPageOptions.length - 1]; + + if (pageSizeLimit && pageSizeLimit > 0 && !isInDefaultRange) { + const stepSize = 500; + const pageSizeFromSetting = [...Array(Math.ceil(pageSizeLimit / stepSize)).keys()].map( + (i) => (i + 1) * stepSize + ); + return Array.from(new Set([...defaultPageOptions, ...pageSizeFromSetting])).sort( + (a, b) => a - b ); - return uniq([...defaultPageOptions, ...pageSizeFromSetting]).sort((a, b) => a - b); } return defaultPageOptions; }; diff --git a/src/plugins/discover/public/application/components/utils/use_pagination.test.ts b/src/plugins/discover/public/application/components/utils/use_pagination.test.ts index ac1d3617081..0a6f7363d80 100644 --- a/src/plugins/discover/public/application/components/utils/use_pagination.test.ts +++ b/src/plugins/discover/public/application/components/utils/use_pagination.test.ts @@ -6,30 +6,24 @@ import { renderHook, act } from '@testing-library/react-hooks'; import { usePagination } from './use_pagination'; -import { uiSettingsServiceMock } from '../../../../../../core/public/mocks'; - describe('usePagination', () => { - // TODO: create mock for DiscoverServices - const services: any = { - uiSettings: uiSettingsServiceMock.createSetupContract(), - }; - + const pageSizeLimit = 500; it('should initialize correctly with visParams and nRow', () => { const nRow = 30; - const { result } = renderHook(() => usePagination({ rowCount: nRow, services })); + const { result } = renderHook(() => usePagination({ rowCount: nRow, pageSizeLimit })); expect(result.current).toEqual({ pageIndex: 0, pageSize: 100, onChangeItemsPerPage: expect.any(Function), onChangePage: expect.any(Function), - pageSizeOptions: [25, 50, 100], + pageSizeOptions: [25, 50, 100, 500], }); }); it('should update pageSize correctly when calling onChangeItemsPerPage', () => { const nRow = 30; - const { result } = renderHook(() => usePagination({ rowCount: nRow, services })); + const { result } = renderHook(() => usePagination({ rowCount: nRow, pageSizeLimit })); act(() => { result.current?.onChangeItemsPerPage(20); @@ -40,13 +34,13 @@ describe('usePagination', () => { pageSize: 20, onChangeItemsPerPage: expect.any(Function), onChangePage: expect.any(Function), - pageSizeOptions: [25, 50, 100], + pageSizeOptions: [25, 50, 100, 500], }); }); it('should update pageIndex correctly when calling onChangePage', () => { const nRow = 30; - const { result } = renderHook(() => usePagination({ rowCount: nRow, services })); + const { result } = renderHook(() => usePagination({ rowCount: nRow, pageSizeLimit })); act(() => { result.current?.onChangePage(1); @@ -57,13 +51,13 @@ describe('usePagination', () => { pageSize: 100, onChangeItemsPerPage: expect.any(Function), onChangePage: expect.any(Function), - pageSizeOptions: [25, 50, 100], + pageSizeOptions: [25, 50, 100, 500], }); }); it('should correct pageIndex if it exceeds maximum page index after nRow or perPage change', () => { const nRow = 300; - const { result } = renderHook(() => usePagination({ rowCount: nRow, services })); + const { result } = renderHook(() => usePagination({ rowCount: nRow, pageSizeLimit })); act(() => { result.current?.onChangePage(4); @@ -74,7 +68,7 @@ describe('usePagination', () => { pageSize: 100, onChangeItemsPerPage: expect.any(Function), onChangePage: expect.any(Function), - pageSizeOptions: [25, 50, 100], + pageSizeOptions: [25, 50, 100, 500], }); }); });