[web] connect new ducks actions

This commit is contained in:
Jason 2016-06-23 01:15:14 +08:00
parent bcea39657a
commit 72fdca49ec
10 changed files with 31 additions and 28 deletions

View File

@ -1,8 +1,8 @@
jest.unmock("../../ducks/ui");
jest.unmock("../../ducks/flows");
import reducer, {setActiveMenu} from '../../ducks/ui';
import {SELECT_FLOW} from '../../ducks/flows';
import reducer, { setActiveMenu } from '../../ducks/ui';
import { SELECT_FLOW } from '../../ducks/flows';
describe("ui reducer", () => {
it("should return the initial state", () => {

View File

@ -10,7 +10,7 @@ import Connection from "./connection"
import ProxyApp from "./components/ProxyApp"
import MainView from './components/MainView'
import rootReducer from './ducks/index'
import { addLogEntry } from "./ducks/eventLog"
import { add as addLog } from "./ducks/eventLog"
// logger must be last
const store = createStore(
@ -19,7 +19,7 @@ const store = createStore(
)
window.addEventListener('error', msg => {
store.dispatch(addLogEntry(msg))
store.dispatch(addLog(msg))
})
// @todo remove this

View File

@ -1,6 +1,6 @@
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { toggleEventLogFilter, toggleEventLogVisibility } from '../ducks/eventLog'
import { toggleFilter, toggleVisibility } from '../ducks/eventLog'
import ToggleButton from './common/ToggleButton'
import EventList from './EventLog/EventList'
@ -73,7 +73,7 @@ export default connect(
events: state.eventLog.filteredEvents,
}),
{
onClose: toggleEventLogVisibility,
onToggleFilter: toggleEventLogFilter,
onClose: toggleVisibility,
onToggleFilter: toggleFilter,
}
)(EventLog)

View File

@ -3,7 +3,7 @@ import { connect } from 'react-redux'
import classnames from 'classnames'
import columns from './FlowColumns'
import { setSort } from "../../ducks/flows"
import { updateSorter } from "../../ducks/flows"
FlowTableHead.propTypes = {
onSort: PropTypes.func.isRequired,
@ -33,6 +33,6 @@ export default connect(
sortColumn: state.flows.sort.sortColumn,
}),
{
onSort: setSort,
onSort: updateSorter,
}
)(FlowTableHead)

View File

@ -1,7 +1,6 @@
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import classnames from 'classnames'
import { toggleEventLogVisibility } from '../ducks/eventLog'
import MainMenu from './Header/MainMenu'
import ViewMenu from './Header/ViewMenu'
import OptionMenu from './Header/OptionMenu'

View File

@ -1,7 +1,7 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import ToggleButton from '../common/ToggleButton'
import { toggleEventLogVisibility } from '../../ducks/eventLog'
import { toggleVisibility } from '../../ducks/eventLog'
ViewMenu.title = 'View'
ViewMenu.route = 'flows'
@ -27,6 +27,6 @@ export default connect(
visible: state.eventLog.visible,
}),
{
onToggle: toggleEventLogVisibility,
onToggle: toggleVisibility,
}
)(ViewMenu)

View File

@ -6,7 +6,7 @@ import { Key } from '../utils.js'
import Splitter from './common/Splitter'
import FlowTable from './FlowTable'
import FlowView from './FlowView'
import { selectFlow, setFilter, setHighlight } from '../ducks/flows'
import { selectFlow, updateFilter, updateHighlight } from '../ducks/flows'
class MainView extends Component {
@ -25,10 +25,10 @@ class MainView extends Component {
this.props.selectFlow(nextProps.routeParams.flowId)
}
if (nextProps.location.query[Query.SEARCH] !== nextProps.filter) {
this.props.setFilter(nextProps.location.query[Query.SEARCH], false)
this.props.updateFilter(nextProps.location.query[Query.SEARCH], false)
}
if (nextProps.location.query[Query.HIGHLIGHT] !== nextProps.highlight) {
this.props.setHighlight(nextProps.location.query[Query.HIGHLIGHT], false)
this.props.updateHighlight(nextProps.location.query[Query.HIGHLIGHT], false)
}
}
@ -190,8 +190,8 @@ export default connect(
}),
{
selectFlow,
setFilter,
setHighlight,
updateFilter,
updateHighlight,
},
undefined,
{ withRef: true }

View File

@ -14,22 +14,22 @@ export default function Connection(url, dispatch) {
ws.onopen = function () {
dispatch(webSocketActions.connected())
dispatch(settingsActions.fetchSettings())
dispatch(flowActions.fetchFlows())
dispatch(eventLogActions.fetchData())
dispatch(flowActions.fetchData())
// workaround to make sure that our state is already available.
.then(() => {
console.log("flows are loaded now")
ConnectionActions.open()
})
dispatch(eventLogActions.fetchLogEntries())
};
ws.onmessage = function (m) {
var message = JSON.parse(m.data);
AppDispatcher.dispatchServerAction(message);
switch (message.type) {
case eventLogActions.UPDATE_LOG:
return dispatch(eventLogActions.updateLogEntries(message))
case flowActions.UPDATE_FLOWS:
return dispatch(flowActions.updateFlows(message))
case eventLogActions.WS_MSG_TYPE:
return dispatch(eventLogActions.handleWsMsg(message))
case flowActions.WS_MSG_TYPE:
return dispatch(flowActions.handleWsMsg(message))
case settingsActions.UPDATE_SETTINGS:
return dispatch(settingsActions.updateSettings(message))
default:
@ -38,11 +38,11 @@ export default function Connection(url, dispatch) {
};
ws.onerror = function () {
ConnectionActions.error();
dispatch(eventLogActions.addLogEntry("WebSocket connection error."));
dispatch(eventLogActions.add("WebSocket connection error."));
};
ws.onclose = function () {
ConnectionActions.close();
dispatch(eventLogActions.addLogEntry("WebSocket connection closed."));
dispatch(eventLogActions.add("WebSocket connection closed."));
dispatch(webSocketActions.disconnected());
};
return ws;

View File

@ -2,6 +2,8 @@ import { fetchApi as fetch } from '../utils'
import { CMD_RESET as WS_CMD_RESET } from './websocket'
import reduceList, * as listActions from './utils/list'
export const WS_MSG_TYPE = 'UPDATE_LOG'
export const TOGGLE_VISIBILITY = 'EVENTLOG_TOGGLE_VISIBILITY'
export const TOGGLE_FILTER = 'EVENTLOG_TOGGLE_FILTER'
export const ADD = 'EVENTLOG_ADD'

View File

@ -2,11 +2,13 @@ import { fetchApi as fetch } from '../utils'
import { CMD_RESET as WS_CMD_RESET } from './websocket'
import reduceList, * as listActions from './utils/list'
export const WS_MSG_TYPE ='UPDATE_FLOWS'
export const UPDATE_FILTER = 'FLOWS_UPDATE_FLOW_FILTER'
export const UPDATE_HIGHLIGHT = 'FLOWS_UPDATE_FLOW_HIGHLIGHT'
export const UPDATE_SORT = 'FLOWS_UPDATE_FLOW_SORT'
export const WS_MSG = 'FLOWS_WS_MSG'
export const SELECT = 'FLOWS_SELECT'
export const SELECT_FLOW = 'FLOWS_SELECT_FLOW'
export const REQUEST_ACTION = 'FLOWS_REQUEST_ACTION'
export const REQUEST = 'FLOWS_REQUEST'
export const RECEIVE = 'FLOWS_RECEIVE'
@ -43,7 +45,7 @@ export default function reduce(state = defaultState, action) {
list: reduceList(state.list, listActions.updateSorter(makeSortFun(action.sortKeyFun, action.desc))),
}
case SELECT:
case SELECT_FLOW:
return {
...state,
selected: [action.id],
@ -116,7 +118,7 @@ export function updateSorter(column, desc, sortKeyFun) {
*/
export function selectFlow(id) {
return (dispatch, getState) => {
dispatch({ type: SELECT, currentSelection: getState().flows.selected[0], id })
dispatch({ type: SELECT_FLOW, currentSelection: getState().flows.selected[0], id })
}
}