Merge pull request #10 from lowdefy/events-filter-change

feat: Add onFilterChanged event.

README.md

@@ -36,6 +36,8 @@ The block types are hosted at:
   - `selected: object[]`: List of selected row objects.
   - `rowIndex: number`: List index of the clicked row.
   - `colId: string`: Column id of the clicked cell.
+- `onFilterChanged`: Trigger event when the filter changes and pass the following to `_event`:
+  - `rows: object[]`: List of row objects matched by the filter.
 - `onRowClick`: Trigger event when a row is clicked and pass the following to `_event`:
   - `row: object`: Row data object.
   - `selected: object[]`: List of selected row objects.

package.json

@@ -21,6 +21,10 @@
     {
       "name": "Gerrie van Wyk",
       "url": "https://github.com/Gervwyk"
+    },
+    {
+      "name": "Johann Möller",
+      "url": "https://github.com/JohannMoller"
     }
   ],
   "repository": {

src/AgGrid.js

@@ -29,6 +29,7 @@ class AgGrid extends React.Component {
     this.onCellClicked = this.onCellClicked.bind(this);
     this.onRowSelected = this.onRowSelected.bind(this);
     this.onSelectionChanged = this.onSelectionChanged.bind(this);
+    this.onFilterChanged = this.onFilterChanged.bind(this);
   }
 
   onGridReady(params) {
@@ -83,13 +84,24 @@ class AgGrid extends React.Component {
     }
   }
 
+  onFilterChanged(event) {
+    if (this.props.events.onFilterChanged) {
+      this.props.methods.triggerEvent({
+        name: 'onFilterChanged',
+        event: { rows: event.api.rowModel.rowsToDisplay.map((row) => row.data) },
+      });
+      console.log(event);
+    }
+  }
+
   render() {
     const { quickFilterValue, ...someProperties } = this.props.properties;
     if (quickFilterValue && quickFilterValue === '') {
       this.gridApi.setQuickFilter(quickFilterValue); // check if empty string matches all
     }
     return (
       <AgGridReact
+        onFilterChanged={this.onFilterChanged}
         onSelectionChanged={this.onSelectionChanged}
         onRowSelected={this.onRowSelected}
         onRowClicked={this.onRowClick}

src/AgGridInput.js

@@ -31,6 +31,7 @@ class AgGridInput extends React.Component {
     this.onSelectionChanged = this.onSelectionChanged.bind(this);
     this.onRowDragEnd = this.onRowDragEnd.bind(this);
     this.onCellValueChanged = this.onCellValueChanged.bind(this);
+    this.onFilterChanged = this.onFilterChanged.bind(this);
   }
 
   onGridReady(params) {
@@ -88,6 +89,15 @@ class AgGridInput extends React.Component {
     }
   }
 
+  onFilterChanged(event) {
+    if (this.props.events.onFilterChanged) {
+      this.props.methods.triggerEvent({
+        name: 'onFilterChanged',
+        event: { rows: event.api.rowModel.rowsToDisplay.map((row) => row.data) },
+      });
+    }
+  }
+
   onRowDragEnd(event) {
     if (event.overNode !== event.node) {
       const fromData = event.node.data;