From 4ddbfd4972f84606450b0e1ff87778423ccb49d0 Mon Sep 17 00:00:00 2001
From: AllenFang <ayu780129@hotmail.com>
Date: Fri, 21 Dec 2018 16:23:14 +0800
Subject: [PATCH] fix #711

---
 docs/README.md                                |  9 +++
 .../examples/rows/row-hidden.js               | 57 +++++++++++++++++++
 .../stories/index.js                          |  2 +
 .../src/bootstrap-table.js                    |  5 +-
 .../src/props-resolver/index.js               | 10 ++++
 .../test/props-resolver/index.test.js         | 45 +++++++++++++++
 6 files changed, 125 insertions(+), 3 deletions(-)
 create mode 100644 packages/react-bootstrap-table2-example/examples/rows/row-hidden.js

diff --git a/docs/README.md b/docs/README.md
index 56f1fa3..3fc1c58 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -27,6 +27,7 @@
 * [rowStyle](#rowStyle)
 * [rowClasses](#rowClasses)
 * [rowEvents](#rowEvents)
+* [hiddenRows](#hiddenRows)
 * [defaultSorted](#defaultSorted)
 * [defaultSortDirection](#defaultSortDirection)
 * [pagination](#pagination)
@@ -181,6 +182,14 @@ const rowEvents = {
 <BootstrapTable data={ data } columns={ columns } rowEvents={ rowEvents } />
 ```
 
+### <a name='hiddenRows'>hiddenRows - [Array]</a>
+Hide rows, this props accept an array of row keys:
+
+```js
+const hiddenRows = [1, 4];
+<BootstrapTable data={ data } columns={ columns } hiddenRows={ hiddenRows } />
+```
+
 ### <a name='defaultSorted'>defaultSorted - [Array]</a>
 `defaultSorted` accept an object array which allow you to define the default sort columns when first render.
 
diff --git a/packages/react-bootstrap-table2-example/examples/rows/row-hidden.js b/packages/react-bootstrap-table2-example/examples/rows/row-hidden.js
new file mode 100644
index 0000000..c200a7b
--- /dev/null
+++ b/packages/react-bootstrap-table2-example/examples/rows/row-hidden.js
@@ -0,0 +1,57 @@
+/* eslint no-unused-vars: 0 */
+/* eslint no-console: 0 */
+import React from 'react';
+
+import BootstrapTable from 'react-bootstrap-table-next';
+import Code from 'components/common/code-block';
+import { productsGenerator } from 'utils/common';
+
+const products = productsGenerator();
+
+const columns = [{
+  dataField: 'id',
+  text: 'Product ID'
+}, {
+  dataField: 'name',
+  text: 'Product Name'
+}, {
+  dataField: 'price',
+  text: 'Product Price'
+}];
+
+const rowEvents = {
+  onClick: (e, row, rowIndex) => {
+    console.log(`clicked on row with index: ${rowIndex}`);
+  },
+  onMouseEnter: (e, row, rowIndex) => {
+    console.log(`enter on row with index: ${rowIndex}`);
+  }
+};
+
+const sourceCode = `\
+import BootstrapTable from 'react-bootstrap-table-next';
+
+const columns = [{
+  dataField: 'id',
+  text: 'Product ID'
+}, {
+  dataField: 'name',
+  text: 'Product Name'
+}, {
+  dataField: 'price',
+  text: 'Product Price'
+}];
+
+const hiddenRowKeys = [1, 3];
+
+<BootstrapTable keyField="id" data={ products } columns={ columns } hiddenRows={ hiddenRowKeys } />
+`;
+
+const hiddenRowKeys = [1, 3];
+
+export default () => (
+  <div>
+    <BootstrapTable keyField="id" data={ products } columns={ columns } hiddenRows={ hiddenRowKeys } />
+    <Code>{ sourceCode }</Code>
+  </div>
+);
diff --git a/packages/react-bootstrap-table2-example/stories/index.js b/packages/react-bootstrap-table2-example/stories/index.js
index 2757280..fe2eecd 100644
--- a/packages/react-bootstrap-table2-example/stories/index.js
+++ b/packages/react-bootstrap-table2-example/stories/index.js
@@ -79,6 +79,7 @@ import ClearAllFilters from 'examples/column-filter/clear-all-filters';
 import RowStyleTable from 'examples/rows/row-style';
 import RowClassTable from 'examples/rows/row-class';
 import RowEventTable from 'examples/rows/row-event';
+import RowHiddenTable from 'examples/rows/row-hidden';
 
 // table sort
 import EnableSortTable from 'examples/sort/enable-sort-table';
@@ -271,6 +272,7 @@ storiesOf('Work on Rows', module)
   .addDecorator(bootstrapStyle())
   .add('Customize Row Style', () => <RowStyleTable />)
   .add('Customize Row Class', () => <RowClassTable />)
+  .add('Hide Rows', () => <RowHiddenTable />)
   .add('Row Event', () => <RowEventTable />);
 
 storiesOf('Sort Table', module)
diff --git a/packages/react-bootstrap-table2/src/bootstrap-table.js b/packages/react-bootstrap-table2/src/bootstrap-table.js
index c23eb91..8bcd7c1 100644
--- a/packages/react-bootstrap-table2/src/bootstrap-table.js
+++ b/packages/react-bootstrap-table2/src/bootstrap-table.js
@@ -21,7 +21,7 @@ class BootstrapTable extends PropsBaseResolver(Component) {
 
   // Exposed APIs
   getData() {
-    return this.props.data;
+    return this.visibleRows();
   }
 
   render() {
@@ -39,7 +39,6 @@ class BootstrapTable extends PropsBaseResolver(Component) {
 
   renderTable() {
     const {
-      data,
       columns,
       keyField,
       tabIndexCell,
@@ -88,7 +87,7 @@ class BootstrapTable extends PropsBaseResolver(Component) {
             expandRow={ expandRow }
           />
           <Body
-            data={ data }
+            data={ this.getData() }
             keyField={ keyField }
             tabIndexCell={ tabIndexCell }
             columns={ columns }
diff --git a/packages/react-bootstrap-table2/src/props-resolver/index.js b/packages/react-bootstrap-table2/src/props-resolver/index.js
index 0c3c92d..92ae62d 100644
--- a/packages/react-bootstrap-table2/src/props-resolver/index.js
+++ b/packages/react-bootstrap-table2/src/props-resolver/index.js
@@ -1,3 +1,4 @@
+import _ from '../utils';
 import ColumnResolver from './column-resolver';
 
 export default ExtendBase =>
@@ -15,4 +16,13 @@ export default ExtendBase =>
     isEmpty() {
       return this.props.data.length === 0;
     }
+
+    visibleRows() {
+      const { data, hiddenRows, keyField } = this.props;
+      if (!hiddenRows || hiddenRows.length === 0) return data;
+      return data.filter((row) => {
+        const key = _.get(row, keyField);
+        return !hiddenRows.includes(key);
+      });
+    }
   };
diff --git a/packages/react-bootstrap-table2/test/props-resolver/index.test.js b/packages/react-bootstrap-table2/test/props-resolver/index.test.js
index 4543041..8c3d256 100644
--- a/packages/react-bootstrap-table2/test/props-resolver/index.test.js
+++ b/packages/react-bootstrap-table2/test/props-resolver/index.test.js
@@ -25,6 +25,51 @@ describe('TableResolver', () => {
   const BootstrapTableMock = extendTo(ExtendBase);
   let wrapper;
 
+  describe('visibleRows', () => {
+    describe('if hiddenRows prop is not existing', () => {
+      beforeEach(() => {
+        const mockElement = React.createElement(BootstrapTableMock, {
+          data, columns, keyField
+        }, null);
+        wrapper = shallow(mockElement);
+      });
+
+      it('should return correct data', () => {
+        expect(wrapper.instance().visibleRows()).toEqual(data);
+      });
+    });
+
+    describe('if hiddenRows prop is an empty array', () => {
+      beforeEach(() => {
+        const mockElement = React.createElement(BootstrapTableMock, {
+          data, columns, keyField, hiddenRows: []
+        }, null);
+        wrapper = shallow(mockElement);
+      });
+
+      it('should return correct data', () => {
+        expect(wrapper.instance().visibleRows()).toEqual(data);
+      });
+    });
+
+    describe('if hiddenRows prop is not an empty array', () => {
+      const hiddenRows = [1];
+
+      beforeEach(() => {
+        const mockElement = React.createElement(BootstrapTableMock, {
+          data, columns, keyField, hiddenRows
+        }, null);
+        wrapper = shallow(mockElement);
+      });
+
+      it('should return correct data', () => {
+        const result = wrapper.instance().visibleRows();
+        expect(result).toHaveLength(data.length - hiddenRows.length);
+        expect(result).toEqual(data.filter(d => !hiddenRows.includes(d.id)));
+      });
+    });
+  });
+
   describe('validateProps', () => {
     describe('if keyField is defined and columns is all visible', () => {
       beforeEach(() => {