From fa26bb6a5fbe8611d74b94669ad31329054874c7 Mon Sep 17 00:00:00 2001 From: Jen Huang Date: Wed, 7 Mar 2018 13:01:18 -0800 Subject: [PATCH 1/3] Add ability to specify default page size for EuiInMemoryTable --- .../tables/in_memory/in_memory_selection.js | 1 + .../src/views/tables/in_memory/props_info.js | 5 ++ .../in_memory_table.test.js.snap | 52 +++++++++++++++++-- src/components/basic_table/in_memory_table.js | 13 ++++- .../basic_table/in_memory_table.test.js | 31 ++++++++++- 5 files changed, 95 insertions(+), 7 deletions(-) diff --git a/src-docs/src/views/tables/in_memory/in_memory_selection.js b/src-docs/src/views/tables/in_memory/in_memory_selection.js index 8b99e4d39e7..6fed8e999a2 100644 --- a/src-docs/src/views/tables/in_memory/in_memory_selection.js +++ b/src-docs/src/views/tables/in_memory/in_memory_selection.js @@ -146,6 +146,7 @@ export class Table extends Component { }]; const pagination = { + defaultPageSize: 5, pageSizeOptions: [3, 5, 8] }; diff --git a/src-docs/src/views/tables/in_memory/props_info.js b/src-docs/src/views/tables/in_memory/props_info.js index e059e78b702..3ba263ffffa 100644 --- a/src-docs/src/views/tables/in_memory/props_info.js +++ b/src-docs/src/views/tables/in_memory/props_info.js @@ -57,6 +57,11 @@ export const propsInfo = { __docgenInfo: { _euiObjectType: 'type', props: { + defaultPageSize: { + description: 'Configures the default page size to show, must be one of "pageSizeOptions"', + required: false, + type: { name: 'number' } + }, pageSizeOptions: basicPropsInfo.Pagination.__docgenInfo.props.pageSizeOptions } } diff --git a/src/components/basic_table/__snapshots__/in_memory_table.test.js.snap b/src/components/basic_table/__snapshots__/in_memory_table.test.js.snap index 78583b3511d..80045d39c36 100644 --- a/src/components/basic_table/__snapshots__/in_memory_table.test.js.snap +++ b/src/components/basic_table/__snapshots__/in_memory_table.test.js.snap @@ -141,7 +141,7 @@ exports[`EuiInMemoryTable with pagination 1`] = ` /> `; -exports[`EuiInMemoryTable with pagination and error 1`] = ` +exports[`EuiInMemoryTable with pagination and default page size 1`] = ` @@ -223,6 +230,43 @@ exports[`EuiInMemoryTable with pagination and selection 1`] = ` /> `; +exports[`EuiInMemoryTable with pagination, default page size and error 1`] = ` + +`; + exports[`EuiInMemoryTable with pagination, selection and sorting 1`] = ` { return { page: !pagination ? undefined : { index: 0, - size: pagination.pageSizeOptions ? pagination.pageSizeOptions[0] : paginationBarDefaults.pageSizeOptions[0] + size: pagination.pageSizeOptions ? ( + pagination.defaultPageSize && pagination.pageSizeOptions.includes(pagination.defaultPageSize) ? + pagination.defaultPageSize : pagination.pageSizeOptions[0] + ) : paginationBarDefaults.pageSizeOptions[0] } }; }; @@ -126,7 +133,9 @@ export class EuiInMemoryTable extends React.Component { pageIndex: criteria.page.index, pageSize: criteria.page.size, totalItemCount: totalCount, - ...(isBoolean(this.props.pagination) ? {} : this.props.pagination) + ...(isBoolean(this.props.pagination) ? {} : { + pageSizeOptions: this.props.pagination.pageSizeOptions + }) }; const sorting = !this.props.sorting ? undefined : { sort: criteria.sort diff --git a/src/components/basic_table/in_memory_table.test.js b/src/components/basic_table/in_memory_table.test.js index afefd77fc34..8f351292944 100644 --- a/src/components/basic_table/in_memory_table.test.js +++ b/src/components/basic_table/in_memory_table.test.js @@ -145,7 +145,35 @@ describe('EuiInMemoryTable', () => { expect(component).toMatchSnapshot(); }); - test('with pagination and error', () => { + test('with pagination and default page size', () => { + + const props = { + ...requiredProps, + items: [ + { id: '1', name: 'name1' }, + { id: '2', name: 'name2' }, + { id: '3', name: 'name3' } + ], + columns: [ + { + field: 'name', + name: 'Name', + description: 'description' + } + ], + pagination: { + defaultPageSize: 4, + pageSizeOptions: [2, 4, 6] + } + }; + const component = shallow( + + ); + + expect(component).toMatchSnapshot(); + }); + + test('with pagination, default page size and error', () => { const props = { ...requiredProps, @@ -161,6 +189,7 @@ describe('EuiInMemoryTable', () => { } ], pagination: { + defaultPageSize: 4, pageSizeOptions: [2, 4, 6] } }; From bd7ced0f95d070c58eebeb7bc5bd4180704ff9fe Mon Sep 17 00:00:00 2001 From: Jen Huang Date: Wed, 7 Mar 2018 16:01:07 -0800 Subject: [PATCH 2/3] PR revisions --- .../tables/in_memory/in_memory_selection.js | 2 +- .../src/views/tables/in_memory/props_info.js | 2 +- src/components/basic_table/in_memory_table.js | 29 ++++++++++++++----- .../basic_table/in_memory_table.test.js | 4 +-- 4 files changed, 26 insertions(+), 11 deletions(-) diff --git a/src-docs/src/views/tables/in_memory/in_memory_selection.js b/src-docs/src/views/tables/in_memory/in_memory_selection.js index 6fed8e999a2..99f86d66a27 100644 --- a/src-docs/src/views/tables/in_memory/in_memory_selection.js +++ b/src-docs/src/views/tables/in_memory/in_memory_selection.js @@ -146,7 +146,7 @@ export class Table extends Component { }]; const pagination = { - defaultPageSize: 5, + initialPageSize: 5, pageSizeOptions: [3, 5, 8] }; diff --git a/src-docs/src/views/tables/in_memory/props_info.js b/src-docs/src/views/tables/in_memory/props_info.js index 3ba263ffffa..b03d8fbb510 100644 --- a/src-docs/src/views/tables/in_memory/props_info.js +++ b/src-docs/src/views/tables/in_memory/props_info.js @@ -57,7 +57,7 @@ export const propsInfo = { __docgenInfo: { _euiObjectType: 'type', props: { - defaultPageSize: { + initialPageSize: { description: 'Configures the default page size to show, must be one of "pageSizeOptions"', required: false, type: { name: 'number' } diff --git a/src/components/basic_table/in_memory_table.js b/src/components/basic_table/in_memory_table.js index bd3dc7f3d90..aec3d12e944 100644 --- a/src/components/basic_table/in_memory_table.js +++ b/src/components/basic_table/in_memory_table.js @@ -36,7 +36,7 @@ const InMemoryTablePropTypes = { pageSizeOptions: PropTypes.arrayOf(PropTypes.number) }), PropTypes.shape({ - defaultPageSize: PropTypes.number, + initialPageSize: PropTypes.number, pageSizeOptions: PropTypes.arrayOf(PropTypes.number) }) ]), @@ -54,14 +54,29 @@ const initialQuery = (props) => { }; const initialCriteria = (props) => { - const { pagination } = props; + if (!props.pagination) { + return { + page: undefined, + }; + } + + const { + pagination: { + pageSizeOptions, + initialPageSize, + } + } = props; + + if (initialPageSize && (!pageSizeOptions || !pageSizeOptions.includes(initialPageSize))) { + throw new Error(`EuiInMemoryTable received initialPageSize ${initialPageSize}, which wasn't provided within pageSizeOptions.`); + } + + const defaultPageSize = pageSizeOptions ? pageSizeOptions[0] : paginationBarDefaults.pageSizeOptions[0]; + return { - page: !pagination ? undefined : { + page: { index: 0, - size: pagination.pageSizeOptions ? ( - pagination.defaultPageSize && pagination.pageSizeOptions.includes(pagination.defaultPageSize) ? - pagination.defaultPageSize : pagination.pageSizeOptions[0] - ) : paginationBarDefaults.pageSizeOptions[0] + size: initialPageSize || defaultPageSize, } }; }; diff --git a/src/components/basic_table/in_memory_table.test.js b/src/components/basic_table/in_memory_table.test.js index 8f351292944..a11d50cc33b 100644 --- a/src/components/basic_table/in_memory_table.test.js +++ b/src/components/basic_table/in_memory_table.test.js @@ -162,7 +162,7 @@ describe('EuiInMemoryTable', () => { } ], pagination: { - defaultPageSize: 4, + initialPageSize: 4, pageSizeOptions: [2, 4, 6] } }; @@ -189,7 +189,7 @@ describe('EuiInMemoryTable', () => { } ], pagination: { - defaultPageSize: 4, + initialPageSize: 4, pageSizeOptions: [2, 4, 6] } }; From 34b486ce635322edea5988c56526bbf5c4b7bb82 Mon Sep 17 00:00:00 2001 From: Jen Huang Date: Wed, 7 Mar 2018 16:26:06 -0800 Subject: [PATCH 3/3] Update changelog --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 5fbd775d6ba..1b150678950 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,6 @@ # [`master`](https://github.com/elastic/eui/tree/master) -No public interface changes since `0.0.25`. +- Added `initialPageSize` option to `EuiInMemoryTable` ([#477](https://github.com/elastic/eui/pull/477)) # [`0.0.24`](https://github.com/elastic/eui/tree/v0.0.24)