From ba93a6ce9c7bb2c47fc1fbc3ec04b86c06b9679d Mon Sep 17 00:00:00 2001 From: AllenFang Date: Wed, 13 Dec 2017 21:48:52 +0800 Subject: [PATCH] All the downstream wrapper for filter wrapper should checking props.isDataChange --- .../src/wrapper.js | 9 ++++- .../test/wrapper.test.js | 38 ++++++++++++++----- .../src/sort/wrapper.js | 10 +++++ .../react-bootstrap-table2/src/store/index.js | 4 -- .../test/sort/wrapper.test.js | 35 +++++++++++++++++ 5 files changed, 80 insertions(+), 16 deletions(-) diff --git a/packages/react-bootstrap-table2-paginator/src/wrapper.js b/packages/react-bootstrap-table2-paginator/src/wrapper.js index 94995cd..f54a8d9 100644 --- a/packages/react-bootstrap-table2-paginator/src/wrapper.js +++ b/packages/react-bootstrap-table2-paginator/src/wrapper.js @@ -48,11 +48,16 @@ class PaginationWrapper extends Component { componentWillReceiveProps(nextProps) { let needNewState = false; let { currPage, currSizePerPage } = this.state; - const { page, sizePerPage } = nextProps.pagination.options; - if (typeof page !== 'undefined') { + const { page, sizePerPage, pageStartIndex } = nextProps.pagination.options; + + if (typeof page !== 'undefined') { // user defined page currPage = page; needNewState = true; + } else if (nextProps.isDataChanged) { // user didn't defined page but data change + currPage = typeof pageStartIndex !== 'undefined' ? pageStartIndex : Const.PAGE_START_INDEX; + needNewState = true; } + if (typeof sizePerPage !== 'undefined') { currSizePerPage = sizePerPage; needNewState = true; diff --git a/packages/react-bootstrap-table2-paginator/test/wrapper.test.js b/packages/react-bootstrap-table2-paginator/test/wrapper.test.js index 16852d0..7254e2a 100644 --- a/packages/react-bootstrap-table2-paginator/test/wrapper.test.js +++ b/packages/react-bootstrap-table2-paginator/test/wrapper.test.js @@ -100,29 +100,47 @@ describe('Wrapper', () => { }); describe('componentWillReceiveProps', () => { - it('should setting currPage state correclt by options.page', () => { - props.pagination.options.page = 2; - instance.componentWillReceiveProps(props); - expect(instance.state.currPage).toEqual(props.pagination.options.page); + let nextProps; + beforeEach(() => { + nextProps = createTableProps(); + }); + + it('should setting currPage state correctly by options.page', () => { + nextProps.pagination.options.page = 2; + instance.componentWillReceiveProps(nextProps); + expect(instance.state.currPage).toEqual(nextProps.pagination.options.page); }); it('should not setting currPage state if options.page not existing', () => { const { currPage } = instance.state; - instance.componentWillReceiveProps(props); + instance.componentWillReceiveProps(nextProps); expect(instance.state.currPage).toBe(currPage); }); - it('should setting currSizePerPage state correclt by options.sizePerPage', () => { - props.pagination.options.sizePerPage = 20; - instance.componentWillReceiveProps(props); - expect(instance.state.currSizePerPage).toEqual(props.pagination.options.sizePerPage); + it('should setting currSizePerPage state correctly by options.sizePerPage', () => { + nextProps.pagination.options.sizePerPage = 20; + instance.componentWillReceiveProps(nextProps); + expect(instance.state.currSizePerPage).toEqual(nextProps.pagination.options.sizePerPage); }); it('should not setting currSizePerPage state if options.sizePerPage not existing', () => { const { currSizePerPage } = instance.state; - instance.componentWillReceiveProps(props); + instance.componentWillReceiveProps(nextProps); expect(instance.state.currSizePerPage).toBe(currSizePerPage); }); + + it('should setting currPage state when nextProps.isDataChanged is true', () => { + nextProps.isDataChanged = true; + instance.componentWillReceiveProps(nextProps); + expect(instance.state.currPage).toBe(Const.PAGE_START_INDEX); + }); + + it('should setting currPage state when nextProps.isDataChanged is true and options.pageStartIndex is existing', () => { + nextProps.isDataChanged = true; + nextProps.pagination.options.pageStartIndex = 0; + instance.componentWillReceiveProps(nextProps); + expect(instance.state.currPage).toBe(nextProps.pagination.options.pageStartIndex); + }); }); }); diff --git a/packages/react-bootstrap-table2/src/sort/wrapper.js b/packages/react-bootstrap-table2/src/sort/wrapper.js index fcb644c..82f00b2 100644 --- a/packages/react-bootstrap-table2/src/sort/wrapper.js +++ b/packages/react-bootstrap-table2/src/sort/wrapper.js @@ -26,6 +26,16 @@ class SortWrapper extends Component { } } + componentWillReceiveProps(nextProps) { + if (nextProps.isDataChanged) { + const sortedColumn = nextProps.columns.find( + column => column.dataField === nextProps.store.sortField); + if (sortedColumn) { + nextProps.store.sortBy(sortedColumn, nextProps.store.sortOrder); + } + } + } + handleSort(column) { const { store } = this.props; store.sortBy(column); diff --git a/packages/react-bootstrap-table2/src/store/index.js b/packages/react-bootstrap-table2/src/store/index.js index eaca367..97d1aba 100644 --- a/packages/react-bootstrap-table2/src/store/index.js +++ b/packages/react-bootstrap-table2/src/store/index.js @@ -12,7 +12,6 @@ export default class Store { this._sortField = undefined; this._selected = []; this._filtering = false; - this._isDataChanged = false; } edit(rowId, dataField, newValue) { @@ -50,9 +49,6 @@ export default class Store { get keyField() { return this._keyField; } set keyField(keyField) { this._keyField = keyField; } - get isDataChanged() { return this._isDataChanged; } - set isDataChanged(isDataChanged) { this._isDataChanged = isDataChanged; } - get sortOrder() { return this._sortOrder; } set sortOrder(sortOrder) { this._sortOrder = sortOrder; } diff --git a/packages/react-bootstrap-table2/test/sort/wrapper.test.js b/packages/react-bootstrap-table2/test/sort/wrapper.test.js index 6618192..733f67d 100644 --- a/packages/react-bootstrap-table2/test/sort/wrapper.test.js +++ b/packages/react-bootstrap-table2/test/sort/wrapper.test.js @@ -1,5 +1,6 @@ import 'jsdom-global/register'; import React from 'react'; +import sinon from 'sinon'; import { shallow, mount } from 'enzyme'; import Const from '../../src/const'; @@ -114,4 +115,38 @@ describe('SortWrapper', () => { expect(store.sortOrder).toEqual(defaultSorted[0].order); }); }); + + describe('componentWillReceiveProps', () => { + let nextProps; + + beforeEach(() => { + nextProps = { columns, store }; + store.sortField = columns[1].dataField; + store.sortOrder = Const.SORT_DESC; + }); + + describe('if nextProps.isDataChanged is true', () => { + beforeEach(() => { + nextProps.isDataChanged = true; + store.sortBy = sinon.stub(); + }); + + it('should sorting again', () => { + wrapper.instance().componentWillReceiveProps(nextProps); + expect(store.sortBy.calledOnce).toBeTruthy(); + }); + }); + + describe('if nextProps.isDataChanged is false', () => { + beforeEach(() => { + nextProps.isDataChanged = false; + store.sortBy = sinon.stub(); + }); + + it('should not sorting', () => { + wrapper.instance().componentWillReceiveProps(nextProps); + expect(store.sortBy.calledOnce).toBeFalsy(); + }); + }); + }); });