[WORK IN PROGRESS] Switch to selectors

js/helpers/__tests__/dataHelperTests.js

@@ -11,7 +11,6 @@ import {
   getColumnTitles,
   getColumnProperties,
   getAllPossibleColumns,
-  getSortedColumns,
   getDataColumns
 } from '../data-helpers';
 
@@ -55,13 +54,27 @@ describe('data helpers', () => {
       expect(results.toJSON().map(withoutMetadata)).toEqual([{two: 'two', one: 'one'}, {two: 'four', one: 'three'}]);
     });
 
+    it('sorts the columns', () => {
+      const state = getBasicState();
+      const sorted = getVisibleDataColumns(state.get('data'), ['two', 'one']);
+
+      expect(Object.keys(sorted.toJSON()[0])).toEqual(['two', 'one', '__metadata']);
+    });
+
     //test for the columns that are made up from thin air
     it('gets null for magic column', () => {
       const state = getBasicState();
       const results = getVisibleDataColumns(state.get('data'), ['one', 'onepointfive', 'two']);
 
       expect(results.toJSON().map(withoutMetadata)).toEqual([{two: 'two', onepointfive: null,  one: 'one'}, {two: 'four', onepointfive: null,  one: 'three'}]);
     });
+
+    it('gets correct order for magic column', () => {
+      const state = getBasicState();
+      const results = getVisibleDataColumns(state.get('data'), ['one', 'onepointfive', 'two']);
+
+      expect(Object.keys(results.toJSON()[0])).toEqual(['one', 'onepointfive', 'two', '__metadata']);
+    });
   })
 
   describe('updateVisibleData', () => {
@@ -144,15 +157,6 @@ describe('data helpers', () => {
     });
   });
 
-  describe('getSortedColumns', () => {
-    it('sorts the columns', () => {
-      const state = getBasicState();
-      const sorted = getSortedColumns(state.get('data'), ['two', 'one']);
-
-      expect(sorted.toJSON()).toEqual([{two: 'two', one: 'one'}, {two: 'four', one: 'three'}]);
-    });
-  });
-
   describe('getDataColumns', () => {
     it('gets the columns arranged by order', () => {
       const state = getBasicState();

js/helpers/__tests__/localHelperTests.js

@@ -2,6 +2,7 @@ import Immutable from 'immutable';
 
 import {
   getVisibleData,
+  getOriginalData,
   hasNext,
   hasPrevious,
   getDataSet,
@@ -29,6 +30,14 @@ describe('localHelpers', () => {
     expect(visibleData.toJSON().map(withoutMetadata)).toEqual([{two: 'two', one: 'one'}]);
   });
 
+  it('gets original data', () => {
+    const state = getBasicState();
+    const data = getOriginalData(state);
+
+    expect(data.size).toEqual(state.getIn(['pageProperties', 'pageSize']));
+    expect(data.toJSON()).toEqual([{two: 'two', one: 'one'}]);
+  });
+
   describe('hasNext', () => {
     it('returns true when on first page and there are more results', () => {
       //this is currently one page and one result per page and there are two items

js/helpers/data-helpers.js

@@ -5,7 +5,7 @@ export function getVisibleData(state) {
   const data =  state.get('data');
 
   const columns = getDataColumns(state, data);
-  return getVisibleDataColumns(getSortedColumns(data, columns), columns);
+  return getVisibleDataColumns(data, columns);
 }
 
 export function updateVisibleData(state) {
@@ -69,11 +69,6 @@ export function getAllPossibleColumns(state) {
   return state.get('data').get(0).keySeq();
 }
 
-export function getSortedColumns(data, columns) {
-  return data
-    .map(item => item.sortBy((val, key) => columns.indexOf(key)));
-}
-
 //From Immutable docs - https://github.com/facebook/immutable-js/wiki/Predicates
 function keyInArray(keys) {
   var keySet = Immutable.Set(keys);
@@ -105,7 +100,8 @@ export function getVisibleDataColumns(data, columns) {
 
   const result = data.map(d => d.filter(keyInArray(columns)));
 
-  return result.mergeDeep(extra);
+  return result.mergeDeep(extra)
+    .map(item => item.sortBy((val, key) => columns.indexOf(key) > -1 ? columns.indexOf(key) :  MAX_SAFE_INTEGER ));
 }
 
 export function getDataColumns(state, data) {

js/helpers/local-helpers.js

@@ -1,7 +1,6 @@
 import {
   getPageCount,
   getDataColumns,
-  getSortedColumns,
   getVisibleDataColumns,
   addKeyToRows
 } from './data-helpers';
@@ -18,9 +17,17 @@ export function getVisibleData(state) {
 
   const data =  getDataSet(state)
     .skip(pageSize * (currentPage-1)).take(pageSize);
-
   const columns = getDataColumns(state, data);
-  return getVisibleDataColumns(getSortedColumns(data, columns), columns);
+  return getVisibleDataColumns(data, columns);
+}
+
+export function getOriginalData(state) {
+  //get the max page / current page and the current page of data
+  const pageSize = state.getIn(['pageProperties', 'pageSize']);
+  const currentPage = state.getIn(['pageProperties', 'currentPage']);
+
+  return getDataSet(state)
+    .skip(pageSize * (currentPage-1)).take(pageSize);
 }
 
 export function hasNext(state) {

js/initialStates/local-state.js

@@ -4,8 +4,9 @@ export default Immutable.fromJS({
   pageProperties: {
     pageSize: 10,
     currentPage: 1,
-    sortColumns: [],
-    sortAscending: true
   },
-  filter: ''
-});
+  metadataColumns: ['griddleKey'],
+  filter: '',
+  sortColumns: [],
+  sortDirections: []
+});

js/module.js

@@ -3,9 +3,13 @@ import * as states from './initialStates/index';
 import GriddleReducer from './reducers/griddle-reducer';
 import * as GriddleActions from './actions/local-actions';
 import * as GriddleHelpers from './helpers';
+import * as selectors from './selectors';
+import * as utils from './utils';
 
 export { reducers as Reducers }
+export { utils as Utils }
+export { selectors as Selectors }
 export { states as States }
 export { GriddleActions as GriddleActions };
 export { GriddleReducer as GriddleReducer };
-export {GriddleHelpers as GriddleHelpers}
+export {GriddleHelpers as GriddleHelpers}

js/reducers/__tests__/localReducerTest.js

@@ -13,7 +13,12 @@ import LocalReducer, {
 
 import extend from 'lodash.assign';
 
-const initialState = {renderProperties: {columnProperties: null}};
+const initialState = {
+  renderProperties: {columnProperties: null},
+  sortDirections: [],
+  sortColumns: []
+};
+
 //TODO: Import the testHelpers instead of using this directly
 const getMethod = (options) => {
   if(!options.method) {
@@ -32,6 +37,9 @@ const defaultData = [
   {one: "ichi", two: "ni", three: "san"},
 ];
 
+const withDefaultKeys = (data) => data.toJSON().map(row => ({ one: row["one"], two: row["two"], three: row["three"]}))
+
+
 describe('localDataReducer', () => {
   describe('load data', () => {
     const loadData = (options) => {
@@ -42,25 +50,14 @@ describe('localDataReducer', () => {
       const helpers = extend(Helpers, { addKeyToRows:  (state) => {return state} });
       const state = loadData({ helpers, payload: { data: defaultData }});
 
-      expect(state.get('data').toJSON()).toEqual(defaultData);
+      expect(withDefaultKeys(state.get('data'))).toEqual(defaultData);
     });
 
     it('sets all columns', () => {
       const helpers = extend(Helpers, { addKeyToRows:  (state) => {return state} });
       const state = loadData({ helpers, payload: { data: defaultData }});
       expect(state.get('allColumns')).toEqual(['one', 'two', 'three'])
     });
-
-    it('sets max page', () => {
-      const helpers = extend(Helpers, {
-        addKeyToRows: (state) => {return state},
-        getPageCount: (state) => { return 3}
-      });
-
-      const state = loadData({ helpers, payload: { data: defaultData }});
-
-      expect(state.getIn(['pageProperties', 'maxPage'])).toEqual(3);
-    });
   });
 
   describe('after reduce', () => {
@@ -71,47 +68,11 @@ describe('localDataReducer', () => {
     const defaultHelpers = extend(Helpers, {
       getDataSet: (state) => { return state; },
       getVisibleData: (state) => { return state; },
+      getOriginalData: (state) => { return state; },
       hasNext: (state) => { return true; },
       hasPrevious: (state) => { return true; },
       getDataSetSize: (state) => { return state.count(); }
     });
-
-    it('sets visible data', () => {
-      const visibleData = [{ one: "one", two: "two", three: "three" }];
-      const helpers = extend({}, defaultHelpers, {
-        getVisibleData: (state) => { return visibleData; },
-      });
-
-      const state = afterReduce({ helpers });
-      expect(state.get('visibleData')).toEqual(visibleData);
-    });
-
-    it('sets has next', () => {
-      const helpers = extend({}, defaultHelpers, {
-        hasNext: (state) => { return true; },
-      });
-
-      const state = afterReduce({ helpers });
-      expect(state.get('hasNext')).toEqual(true);
-    });
-
-    it('sets has previous', () => {
-      const helpers = extend({}, defaultHelpers, {
-        hasPrevious: (state) => { return true; },
-      });
-
-      const state = afterReduce({ helpers });
-      expect(state.get('hasPrevious')).toEqual(true);
-    });
-
-    it('sets max page', () => {
-      const helpers = extend({}, defaultHelpers, {
-        getPageCount: (state) => { return 3}
-      });
-
-      const state = afterReduce({ helpers });
-      expect(state.getIn(['pageProperties', 'maxPage'])).toEqual(3);
-    });
   });
 
   describe('set page size', () => {
@@ -123,14 +84,12 @@ describe('localDataReducer', () => {
       getPageCount: (state) => { return 3; }
     });
 
-
     it('sets the page size', () => {
       const state = setPageSize({ helpers: defaultHelpers,
         state: Immutable.fromJS({ data: defaultData }),
         payload: { pageSize: 10 }
       });
 
-      expect(state.getIn(['pageProperties', 'maxPage'])).toEqual(3);
       expect(state.getIn(['pageProperties', 'pageSize'])).toEqual(10);
     });
   });
@@ -155,39 +114,39 @@ describe('localDataReducer', () => {
         payload: { pageNumber: 2 }
       }, GRIDDLE_GET_PAGE);
 
-      expect(state.get('data')).toEqual(defaultPage[2]);
+      expect(state.getIn(['pageProperties', 'currentPage'])).toEqual(2);
     });
 
     it('gets next page', () => {
       const state = reducer({ helpers: defaultHelpers,
         state: Immutable.fromJS({ pageProperties: { currentPage: 0, maxPage: 2 } }),
       }, GRIDDLE_NEXT_PAGE);
 
-      expect(state.get('data')).toEqual(defaultPage[1]);
+      expect(state.getIn(['pageProperties', 'currentPage'])).toEqual(1);
     });
 
     it('gets last page when calling next page on last page', () => {
       const state = reducer({ helpers: defaultHelpers,
         state: Immutable.fromJS({ pageProperties: { currentPage: 2, maxPage: 2 } }),
       }, GRIDDLE_NEXT_PAGE);
 
-      expect(state.get('data')).toEqual(defaultPage[2]);
+      expect(state.getIn(['pageProperties', 'currentPage'])).toEqual(2);
     });
 
     it('gets previous page', () => {
       const state = reducer({ helpers: defaultHelpers,
         state: Immutable.fromJS({ pageProperties: { currentPage: 1 } }),
       }, GRIDDLE_PREVIOUS_PAGE);
 
-      expect(state.get('data')).toEqual(defaultPage[0]);
+      expect(state.getIn(['pageProperties', 'currentPage'])).toEqual(0);
     });
 
     it('gets first page when calling previous on first page', () => {
       const state = reducer({ helpers: defaultHelpers,
         state: Immutable.fromJS({ pageProperties: { currentPage: 0 } }),
       }, GRIDDLE_PREVIOUS_PAGE);
 
-      expect(state.get('data')).toEqual(defaultPage[0]);
+      expect(state.getIn(['pageProperties', 'currentPage'])).toEqual(0);
     });
   });
 
@@ -212,22 +171,10 @@ describe('localDataReducer', () => {
       return getMethod(extend(options, { method }));
     }
 
-    it('returns the state when no sort columns are present', () => {
-      const state = reducer({}, GRIDDLE_SORT);
-
-      expect(state.toJSON()).toEqual(initialState);
-    });
-
-    it('calls sortDataByColumns when sort column present', () => {
-      let count = 0;
-
-      const helpers = extend(Helpers,
-        { sortDataByColumns: (state, pageNumber) => new Immutable.Map({count: count++ }) });
-      const payload = { sortColumns: ['one'] };
-      const state = reducer({ helpers, payload }, GRIDDLE_SORT)
+    it('sets sort column', () => {
+      const state = reducer({payload: { sortColumns: ['one']}}, GRIDDLE_SORT);
 
-      //the sortByColumns method should increment the count -- this is a cheezy shouldHaveBeenCalled
-      expect(count).toEqual(1);
+      expect(state.get('sortColumns')).toEqual(['one']);
     });
   });
 });