[web] fix flows data flow

web/src/js/__tests__/ducks/ui.js

@@ -1,4 +1,5 @@
 jest.unmock("../../ducks/ui");
+// @todo fix it ( this is why I don't like to add tests until our architecture is stable :P )
 jest.unmock("../../ducks/flows");
 
 import reducer, { setActiveMenu } from '../../ducks/ui';

web/src/js/components/FlowTable/FlowTableHead.jsx

@@ -3,7 +3,7 @@ import { connect } from 'react-redux'
 import classnames from 'classnames'
 import columns from './FlowColumns'
 
-import { updateSorter } from "../../ducks/flows"
+import { updateSorter } from '../../ducks/views/main'
 
 FlowTableHead.propTypes = {
     onSort: PropTypes.func.isRequired,
@@ -19,7 +19,7 @@ function FlowTableHead({ sortColumn, sortDesc, onSort }) {
             {columns.map(Column => (
                 <th className={classnames(Column.headerClass, sortColumn === Column.name && sortType)}
                     key={Column.name}
-                    onClick={() => onSort(Column.name, Column.name !== sortColumn ? false : !sortDesc, Column.sortKeyFun)}>
+                    onClick={() => onSort(Column.name, Column.name !== sortColumn ? false : !sortDesc)}>
                     {Column.headerName}
                 </th>
             ))}
@@ -29,8 +29,8 @@ function FlowTableHead({ sortColumn, sortDesc, onSort }) {
 
 export default connect(
     state => ({
-        sortDesc: state.flows.sorter.desc,
-        sortColumn: state.flows.sorter.column,
+        sortDesc: state.flows.views.main.sorter.desc,
+        sortColumn: state.flows.views.main.sorter.column,
     }),
     {
         onSort: updateSorter,

web/src/js/components/Header.jsx

@@ -52,8 +52,8 @@ class Header extends Component {
 }
 export default connect(
     state => ({
-        selectedFlow: state.flows.selected[0],
-        activeMenu: state.ui.activeMenu
+        selectedFlow: state.flows.views.main.selected[0],
+        activeMenu: state.ui.activeMenu,
     }),
     {
         setActiveMenu,

web/src/js/components/Header/FlowMenu.jsx

@@ -29,6 +29,6 @@ function FlowMenu({ flow }) {
 
 export default connect(
     state => ({
-        flow: state.flows.list.byId[state.flows.selected[0]]
+        flow: state.flows.list.data[state.flows.views.main.selected[0]],
     })
 )(FlowMenu)

web/src/js/components/MainView.jsx

@@ -6,7 +6,7 @@ import { Key } from '../utils.js'
 import Splitter from './common/Splitter'
 import FlowTable from './FlowTable'
 import FlowView from './FlowView'
-import { selectFlow, updateFilter, updateHighlight } from '../ducks/flows'
+import { selectFlow, updateFilter, updateHighlight } from '../ducks/views/main'
 
 class MainView extends Component {
 
@@ -182,10 +182,10 @@ class MainView extends Component {
 
 export default connect(
     state => ({
-        flows: state.flows.list.data,
-        filter: state.flows.filter,
-        highlight: state.flows.highlight,
-        selectedFlow: state.flows.list.byId[state.flows.selected[0]]
+        flows: state.flows.views.main.view.data,
+        filter: state.flows.views.main.filter,
+        highlight: state.flows.views.main.highlight,
+        selectedFlow: state.flows.list.data[state.flows.views.main.selected[0]]
     }),
     {
         selectFlow,

web/src/js/ducks/views/main.js

@@ -29,10 +29,10 @@ const sortKeyFuns = {
 
 
 const defaultState = {
-    filter: null,
-    sorter: null,
     highlight: null,
     selected: [],
+    filter: null,
+    sorter: { column: null, desc: false },
     view: null,
 }