Internalize use of ImmutableJS for filter state

src/plugins/local/reducers/__tests__/localReducerTests.js

@@ -40,12 +40,46 @@ test('sets page size', test => {
   test.is(state.getIn(['pageProperties', 'pageSize']), 11);
 });
 
-test('sets filter', test => {
+test('sets filter null', test => {
   const state = reducers.GRIDDLE_SET_FILTER(new Immutable.Map(), {
-    filter: 'onetwothree',
+    filter: null,
   });
 
-  test.is(state.get('filter'), 'onetwothree');
+  test.is(state.get('filter'), null);
+  test.is(state.getIn(['pageProperties', 'currentPage']), 1)
+});
+
+test('sets filter string', test => {
+  const filter = 'onetwothree';
+  const state = reducers.GRIDDLE_SET_FILTER(new Immutable.Map(), {
+    filter
+  });
+
+  test.is(state.get('filter'), filter);
+  test.is(state.getIn(['pageProperties', 'currentPage']), 1)
+});
+
+test('sets filter function', test => {
+  const filter = (v, i) => i % 2;
+  const state = reducers.GRIDDLE_SET_FILTER(new Immutable.Map(), {
+    filter,
+  });
+
+  test.is(state.get('filter'), filter);
+  test.is(state.getIn(['pageProperties', 'currentPage']), 1)
+});
+
+test('sets filter object', test => {
+  const filter = {
+    id: (v, i) => i % 2,
+    name: 'ben',
+  };
+  const state = reducers.GRIDDLE_SET_FILTER(new Immutable.Map(), {
+    filter,
+  });
+
+  test.not(state.get('filter'), filter);
+  test.deepEqual(state.get('filter').toJS(), filter);
   test.is(state.getIn(['pageProperties', 'currentPage']), 1)
 });
 

src/plugins/local/reducers/index.js

@@ -1,3 +1,4 @@
+import Immutable from 'immutable';
 import { maxPageSelector, currentPageSelector } from '../selectors/localSelectors';
 
 import * as dataReducers from '../../../reducers//dataReducer';
@@ -63,7 +64,7 @@ export function GRIDDLE_PREVIOUS_PAGE(state, action) {
  */
 export function GRIDDLE_SET_FILTER(state, action) {
   return state
-    .set('filter', action.filter)
+    .set('filter', action.filter && Immutable.fromJS(action.filter))
     .setIn(['pageProperties', 'currentPage'], 1);
 };
 

stories/index.tsx

@@ -1213,10 +1213,9 @@ storiesOf('Filter', module)
   .add('with Custom Filter for the column "name"', () => {
     class CustomFilter extends React.Component<{setFilter: (e: any) => any, style: any, className: any}, {}> {
       public setFilter = (e: any) => {
-        console.log(e.target.value);
-        const filterAsMap = new Map();
-        filterAsMap.set('name', e.target.value);
-        this.props.setFilter(filterAsMap);
+        this.props.setFilter({
+          name: e.target.value,
+        });
       }
       public render() {
         return (