simplify web ui ducks

7 files changed, 132 insertions, 158 deletions

diff --git a/web/src/js/__tests__/ducks/flowView.js b/web/src/js/__tests__/ducks/flowView.js
new file mode 100644
index 00000000..d5d9a6d9
--- /dev/null
+++ b/web/src/js/__tests__/ducks/flowView.js
@@ -0,0 +1,67 @@
+jest.unmock('../../ducks/flows')
+jest.unmock('../../ducks/flowView')
+jest.unmock('../../ducks/utils/view')
+jest.unmock('../../ducks/utils/list')
+jest.unmock('./tutils')
+
+import { createStore } from './tutils'
+
+import flows, * as flowActions from '../../ducks/flows'
+import flowView, * as flowViewActions from '../../ducks/flowView'
+
+
+function testStore() {
+    let store = createStore({
+        flows,
+        flowView
+    })
+    for (let i of [1, 2, 3, 4]) {
+        store.dispatch(
+            flowActions.addFlow({ id: i })
+        )
+    }
+    return store
+}
+
+describe('select relative', () => {
+
+    function testSelect(start, relative, result) {
+        const store = testStore()
+        store.dispatch(flowActions.select(start))
+        expect(store.getState().flows.selected).toEqual(start ? [start] : [])
+        store.dispatch(flowViewActions.selectRelative(relative))
+        expect(store.getState().flows.selected).toEqual([result])
+    }
+
+    describe('previous', () => {
+
+        it('should select the previous flow', () => {
+            testSelect(3, -1, 2)
+        })
+
+        it('should not changed when first flow is selected', () => {
+            testSelect(1, -1, 1)
+        })
+
+        it('should select first flow if no flow is selected', () => {
+            testSelect(undefined, -1, 1)
+        })
+
+    })
+
+    describe('next', () => {
+
+        it('should select the next flow', () => {
+            testSelect(2, 1, 3)
+        })
+
+        it('should not changed when last flow is selected', () => {
+            testSelect(4, 1, 4)
+        })
+
+        it('should select last flow if no flow is selected', () => {
+            testSelect(undefined, 1, 4)
+        })
+
+    })
+})
diff --git a/web/src/js/__tests__/ducks/flows.js b/web/src/js/__tests__/ducks/flows.js
new file mode 100644
index 00000000..2b261cb1
--- /dev/null
+++ b/web/src/js/__tests__/ducks/flows.js
@@ -0,0 +1,30 @@
+jest.unmock('../../ducks/flows');
+
+import reduceFlows, * as flowActions from '../../ducks/flows'
+
+
+describe('select flow', () => {
+
+    let state = reduceFlows(undefined, {})
+    for (let i of [1, 2, 3, 4]) {
+        state = reduceFlows(state, flowActions.addFlow({ id: i }))
+    }
+
+    it('should be possible to select a single flow', () => {
+        expect(reduceFlows(state, flowActions.select(2))).toEqual(
+            {
+                ...state,
+                selected: [2],
+            }
+        )
+    })
+
+    it('should be possible to deselect a flow', () => {
+        expect(reduceFlows({ ...state, selected: [1] }, flowActions.select())).toEqual(
+            {
+                ...state,
+                selected: [],
+            }
+        )
+    })
+})
diff --git a/web/src/js/__tests__/ducks/tutils.js b/web/src/js/__tests__/ducks/tutils.js
new file mode 100644
index 00000000..90a21b78
--- /dev/null
+++ b/web/src/js/__tests__/ducks/tutils.js
@@ -0,0 +1,12 @@
+jest.unmock('redux')
+jest.unmock('redux-thunk')
+
+import { combineReducers, applyMiddleware, createStore as createReduxStore } from 'redux'
+import thunk from 'redux-thunk'
+
+export function createStore(parts) {
+    return createReduxStore(
+        combineReducers(parts),
+        applyMiddleware(...[thunk])
+    )
+}
diff --git a/web/src/js/__tests__/ducks/ui.js b/web/src/js/__tests__/ducks/ui.js
index ae2b75b9..d3242815 100644
--- a/web/src/js/__tests__/ducks/ui.js
+++ b/web/src/js/__tests__/ducks/ui.js
@@ -1,14 +1,8 @@
-jest.unmock('lodash')
-jest.unmock('redux')
-jest.unmock('redux-thunk')
 jest.unmock('../../ducks/ui')
-jest.unmock('../../ducks/views/main')
+jest.unmock('../../ducks/flows')
 
-import _ from 'lodash'
-import thunk from 'redux-thunk'
-import { applyMiddleware, createStore, combineReducers } from 'redux'
-import reducer, { setActiveMenu, selectTabRelative } from '../../ducks/ui'
-import { SELECT } from '../../ducks/views/main'
+import reducer, { setActiveMenu } from '../../ducks/ui'
+import * as flowActions from '../../ducks/flows'
 
 describe('ui reducer', () => {
     it('should return the initial state', () => {
@@ -20,69 +14,23 @@ describe('ui reducer', () => {
     })
 
     it('should change the state to Start when deselecting a flow and we a currently at the flow tab', () => {
-        expect(reducer({ activeMenu: 'Flow' }, {
-            type: SELECT,
-            currentSelection: 1,
-            flowId : undefined,
-        }).activeMenu).toEqual('Start')
+        expect(reducer(
+            { activeMenu: 'Flow', isFlowSelected: true },
+            flowActions.select(undefined)).activeMenu
+        ).toEqual('Start')
     })
 
     it('should change the state to Flow when we selected a flow and no flow was selected before', () => {
-        expect(reducer({ activeMenu: 'Start' }, {
-            type: SELECT,
-            currentSelection: undefined,
-            flowId : 1,
-        }).activeMenu).toEqual('Flow')
+        expect(reducer(
+            { activeMenu: 'Start', isFlowSelected: false },
+            flowActions.select(1)).activeMenu
+        ).toEqual('Flow')
     })
 
     it('should not change the state to Flow when OPTIONS tab is selected and we selected a flow and a flow as selected before', () => {
-        expect(reducer({activeMenu: 'Options'}, {
-            type: SELECT,
-            currentSelection: 1,
-            flowId : '2',
-        }).activeMenu).toEqual('Options')
-    })
-
-    describe('select tab relative', () => {
-
-        it('should select tab according to flow properties', () => {
-            const store = createTestStore(makeState([{ id: 1 }], 1))
-            store.dispatch(selectTabRelative(1))
-            expect(store.getState().ui.panel).toEqual('details')
-        })
-
-        it('should select last tab when first tab is selected', () => {
-            const store = createTestStore(makeState([{ id: 1, request: true, response: true, error: true }], 1))
-            store.dispatch(selectTabRelative(-1))
-            expect(store.getState().ui.panel).toEqual('details')
-        })
-
+        expect(reducer(
+            { activeMenu: 'Options', isFlowSelected: true },
+            flowActions.select(1)
+        ).activeMenu).toEqual('Options')
     })
 })
-
-function createTestStore(state) {
-    return createStore(
-        combineReducers({ ui: reducer, flows: (state = {}) => state }),
-        state,
-        applyMiddleware(thunk)
-    )
-}
-
-
-// TODO: We should not duplicate our reducer logic here.
-function makeState(flows, selected) {
-    return {
-        flows: {
-            list: {
-                data: flows,
-                byId: _.fromPairs(flows.map(flow => [flow.id, flow])),
-                indexOf: _.fromPairs(flows.map((flow, index) => [flow.id, index])),
-            },
-            views: {
-                main: {
-                    selected: [selected],
-                },
-            },
-        },
-    }
-}
diff --git a/web/src/js/__tests__/ducks/utils/list.js b/web/src/js/__tests__/ducks/utils/list.js
index 8cae91ec..72d162f2 100644
--- a/web/src/js/__tests__/ducks/utils/list.js
+++ b/web/src/js/__tests__/ducks/utils/list.js
@@ -27,7 +27,7 @@ describe('list reduce', () => {
             { id: 1, val: 1 },
             { id: 2, val: 3 }
         ])
-        expect(reduce(state, list.update(2, { id: 2, val: 3 }))).toEqual(result)
+        expect(reduce(state, list.update({ id: 2, val: 3 }))).toEqual(result)
     })
 
     it('should remove item', () => {
diff --git a/web/src/js/__tests__/ducks/utils/view.js b/web/src/js/__tests__/ducks/utils/view.js
index 1b07f723..f0b147da 100644
--- a/web/src/js/__tests__/ducks/utils/view.js
+++ b/web/src/js/__tests__/ducks/utils/view.js
@@ -14,7 +14,7 @@ describe('view reduce', () => {
         const result = createState([
             { id: 1 }
         ])
-        expect(reduce(state, view.updateFilter(state, item => item.id === 1))).toEqual(result)
+        expect(reduce(state, view.updateFilter(state.data, item => item.id === 1))).toEqual(result)
     })
 
     it('should sort items', () => {
@@ -72,7 +72,7 @@ describe('view reduce', () => {
             { id: 1, val: 1 },
             { id: 2, val: 3 }
         ])
-        expect(reduce(state, view.update(2, { id: 2, val: 3 }))).toEqual(result)
+        expect(reduce(state, view.update({ id: 2, val: 3 }))).toEqual(result)
     })
 
     it('should sort updated item', () => {
@@ -84,7 +84,7 @@ describe('view reduce', () => {
             { id: 2, val: 3 },
             { id: 1, val: 1 }
         ])
-        expect(reduce(state, view.update(2, { id: 2, val: 3 }, undefined, (a, b) => b.id - a.id))).toEqual(result)
+        expect(reduce(state, view.update({ id: 2, val: 3 }, undefined, (a, b) => b.id - a.id))).toEqual(result)
     })
 
     it('should filter updated item', () => {
@@ -96,7 +96,7 @@ describe('view reduce', () => {
             { id: 1, val: 1 }
         ])
         result.indexOf[2] = null
-        expect(reduce(state, view.update(2, { id: 2, val: 3 }, i => i.id === i.val))).toEqual(result)
+        expect(reduce(state, view.update({ id: 2, val: 3 }, i => i.id === i.val))).toEqual(result)
     })
 
     it('should remove item', () => {
@@ -119,7 +119,7 @@ describe('view reduce', () => {
         const result = createState([
             { id: 1 }
         ])
-        expect(reduce(state, view.receive({ data: [{ id: 1 }] }))).toEqual(result)
+        expect(reduce(state, view.receive([{ id: 1 }]))).toEqual(result)
     })
 
     it('should sort received items', () => {
@@ -131,7 +131,7 @@ describe('view reduce', () => {
             { id: 2 },
             { id: 1 }
         ])
-        expect(reduce(state, view.receive({ data: [{ id: 1 }, { id: 2 }] }, undefined, (a, b) => b.id - a.id))).toEqual(result)
+        expect(reduce(state, view.receive([{ id: 1 }, { id: 2 }], undefined, (a, b) => b.id - a.id))).toEqual(result)
     })
 
     it('should filter received', () => {
@@ -142,7 +142,7 @@ describe('view reduce', () => {
         const result = createState([
             { id: 1 }
         ])
-        expect(reduce(state, view.receive({ data: [{ id: 1 }, { id: 2 }] }, i => i.id === 1))).toEqual(result)
+        expect(reduce(state, view.receive([{ id: 1 }, { id: 2 }], i => i.id === 1))).toEqual(result)
     })
 })
 
diff --git a/web/src/js/__tests__/ducks/views/main.js b/web/src/js/__tests__/ducks/views/main.js
deleted file mode 100644
index 0255f6ce..00000000
--- a/web/src/js/__tests__/ducks/views/main.js
+++ /dev/null
@@ -1,83 +0,0 @@
-jest.unmock('../../../ducks/views/main');
-jest.unmock('../../../ducks/utils/view');
-jest.unmock('redux-thunk')
-jest.unmock('redux')
-
-import reduce, { selectRelative } from '../../../ducks/views/main';
-import thunk from 'redux-thunk'
-import { applyMiddleware, createStore, combineReducers } from 'redux'
-
-describe('main reduce', () => {
-
-    describe('select previous', () => {
-
-        it('should not changed when first flow is selected', () => {
-            const flows = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }]
-            const store = createTestStore(makeState(flows, 1))
-            store.dispatch(selectRelative(-1))
-            expect(store.getState().flows.views.main.selected).toEqual([1])
-        })
-
-        it('should select last flow if no flow is selected', () => {
-            const flows = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }]
-            const store = createTestStore(makeState(flows))
-            store.dispatch(selectRelative(-1))
-            expect(store.getState().flows.views.main.selected).toEqual([4])
-        })
-
-    })
-
-    describe('select next', () => {
-
-        it('should not change when last flow is selected', () => {
-            const flows = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }]
-            const store = createTestStore(makeState(flows, 4))
-            store.dispatch(selectRelative(1))
-            expect(store.getState().flows.views.main.selected).toEqual([4])
-        })
-
-        it('should select first flow if no flow is selected', () => {
-            const flows = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }]
-            const store = createTestStore(makeState(flows, 1))
-            store.dispatch(selectRelative(1))
-            expect(store.getState().flows.views.main.selected).toEqual([2])
-        })
-
-    })
-})
-
-function createTestStore(defaultState) {
-    return createStore(
-        (state = defaultState, action) => ({
-            flows: {
-                ...state.flows,
-                views: {
-                    main: reduce(state.flows.views.main, action)
-                }
-            }
-        }),
-        defaultState,
-        applyMiddleware(thunk)
-    )
-}
-
-// TODO: We should not duplicate our reducer logic here.
-function makeState(flows, selected) {
-    const list = {
-        data: flows,
-        byId: _.fromPairs(flows.map(flow => [flow.id, flow])),
-        indexOf: _.fromPairs(flows.map((flow, index) => [flow.id, index])),
-    }
-
-    return {
-        flows: {
-            list,
-            views: {
-                main: {
-                    selected: [selected],
-                    view: list,
-                }
-            }
-        }
-    }
-}