[web] add app ducks

web/src/js/components/ProxyApp.jsx

@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom'
 import _ from 'lodash'
 import { connect } from 'react-redux'
 
-import { connect as wsConnect } from '../ducks/websocket'
+import { init as appInit, destruct as appDestruct } from '../ducks/app'
 import Header from './Header'
 import EventLog from './EventLog'
 import Footer from './Footer'
@@ -37,7 +37,7 @@ class ProxyAppMain extends Component {
     }
 
     componentWillMount() {
-        this.props.wsConnect()
+        this.props.appInit()
     }
 
     /**
@@ -79,6 +79,7 @@ class ProxyAppMain extends Component {
      * @todo stop listening to window's key events
      */
     componentWillUnmount() {
+        this.props.appDestruct()
         this.settingsStore.removeListener('recalculate', this.onSettingsChange)
     }
 
@@ -168,6 +169,7 @@ export default connect(
         showEventLog: state.eventLog.visible
     }),
     {
-        wsConnect,
+        appInit,
+        appDestruct,
     }
 )(ProxyAppMain)

web/src/js/ducks/app.js

@@ -0,0 +1,27 @@
+import { connect as wsConnect, disconnect as wsDisconnect } from './websocket'
+
+export const INIT = 'APP_INIT'
+
+const defaultState = {}
+
+export function reduce(state = defaultState, action) {
+    switch (action.type) {
+
+        default:
+            return state
+    }
+}
+
+export function init() {
+    return dispatch => {
+        dispatch(wsConnect())
+        dispatch({ type: INIT })
+    }
+}
+
+export function destruct() {
+    return dispatch => {
+        dispatch(wsDisconnect())
+        dispatch({ type: DESTRUCT })
+    }
+}

web/src/js/ducks/websocket.js

@@ -3,17 +3,17 @@ import { AppDispatcher } from '../dispatcher.js'
 import * as eventLogActions from './eventLog'
 import * as flowActions from './flows'
 
-const CONNECT = 'WEBSOCKET_CONNECT'
-const CONNECTED = 'WEBSOCKET_CONNECTED'
-const DISCONNECT = 'WEBSOCKET_DISCONNECT'
-const DISCONNECTED = 'WEBSOCKET_DISCONNECTED'
-const ERROR = 'WEBSOCKET_ERROR'
-const MESSAGE = 'WEBSOCKET_MESSAGE'
+export const CONNECT = 'WEBSOCKET_CONNECT'
+export const CONNECTED = 'WEBSOCKET_CONNECTED'
+export const DISCONNECT = 'WEBSOCKET_DISCONNECT'
+export const DISCONNECTED = 'WEBSOCKET_DISCONNECTED'
+export const ERROR = 'WEBSOCKET_ERROR'
+export const MESSAGE = 'WEBSOCKET_MESSAGE'
 
 /* we may want to have an error message attribute here at some point */
 const defaultState = { connected: false, socket: null }
 
-export default function reducer(state = defaultState, action) {
+export default function reduce(state = defaultState, action) {
     switch (action.type) {
 
         case CONNECT:
@@ -52,7 +52,10 @@ export function connect() {
 }
 
 export function disconnect() {
-    return { type: DISCONNECT }
+    return (dispatch, getState) => {
+        getState().settings.socket.close()
+        dispatch({ type: DISCONNECT })
+    }
 }
 
 export function onConnect() {