4 files changed, 37 insertions, 16 deletions
diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx
index e1c62e28..a4466784 100644
--- a/web/src/js/components/Header/FileMenu.jsx
+++ b/web/src/js/components/Header/FileMenu.jsx
@@ -1,8 +1,9 @@
 import React, { Component } from 'react'
+import { connect } from 'react-redux'
 import classnames from 'classnames'
-import * as flowActions from '../../ducks/flows'
+import * as flowsActions from '../../ducks/flows'
 
-export default class FileMenu extends Component {
+class FileMenu extends Component {
 
     constructor(props, context) {
         super(props, context)
@@ -35,7 +36,7 @@ export default class FileMenu extends Component {
     onNewClick(e) {
         e.preventDefault()
         if (confirm('Delete all flows?')) {
-            flowActions.clear()
+            this.props.onClear()
         }
     }
 
@@ -47,14 +48,14 @@ export default class FileMenu extends Component {
     onOpenFile(e) {
         e.preventDefault()
         if (e.target.files.length > 0) {
-            flowActions.upload(e.target.files[0])
+            this.props.onUpload(e.target.files[0])
             this.fileInput.value = ''
         }
     }
 
     onSaveClick(e) {
         e.preventDefault()
-        flowActions.download()
+        this.props.onDownload()
     }
 
     render() {
@@ -98,3 +99,12 @@ export default class FileMenu extends Component {
         )
     }
 }
+
+export default connect(
+    null,
+    {
+        onClear: flowsActions.clear,
+        onUpload: flowsActions.upload,
+        onDownload: flowsActions.download,
+    }
+)(FileMenu)
diff --git a/web/src/js/components/Header/FlowMenu.jsx b/web/src/js/components/Header/FlowMenu.jsx
index 1fa7037f..ba1dcbcb 100644
--- a/web/src/js/components/Header/FlowMenu.jsx
+++ b/web/src/js/components/Header/FlowMenu.jsx
@@ -1,8 +1,8 @@
 import React, { PropTypes } from 'react'
+import { connect } from 'react-redux'
 import Button from '../common/Button'
-import { FlowActions } from '../../actions.js'
 import { MessageUtils } from '../../flow/utils.js'
-import { connect } from 'react-redux'
+import * as flowsActions from '../../ducks/flows'
 
 FlowMenu.title = 'Flow'
 
@@ -10,16 +10,16 @@ FlowMenu.propTypes = {
     flow: PropTypes.object.isRequired,
 }
 
-function FlowMenu({ flow }) {
+function FlowMenu({ flow, onAccept, onReplay, onDuplicate, onRemove, onRevert }) {
 
     return (
         <div>
             <div className="menu-row">
-                <Button disabled={!flow.intercepted} title="[a]ccept intercepted flow" text="Accept" icon="fa-play" onClick={() => FlowActions.accept(flow)} />
-                <Button title="[r]eplay flow" text="Replay" icon="fa-repeat" onClick={FlowActions.replay.bind(null, flow)} />
-                <Button title="[D]uplicate flow" text="Duplicate" icon="fa-copy" onClick={FlowActions.duplicate.bind(null, flow)} />
-                <Button title="[d]elete flow" text="Delete" icon="fa-trash" onClick={FlowActions.delete.bind(null, flow)}/>
-                <Button disabled={!flow.modified} title="revert changes to flow [V]" text="Revert" icon="fa-history" onClick={() => FlowActions.revert(flow)} />
+                <Button disabled={!flow.intercepted} title="[a]ccept intercepted flow" text="Accept" icon="fa-play" onClick={() => onAccept(flow)} />
+                <Button title="[r]eplay flow" text="Replay" icon="fa-repeat" onClick={() => onReplay(flow)} />
+                <Button title="[D]uplicate flow" text="Duplicate" icon="fa-copy" onClick={() => onDuplicate(flow)} />
+                <Button title="[d]elete flow" text="Delete" icon="fa-trash" onClick={() => onRemove(flow)}/>
+                <Button disabled={!flow.modified} title="revert changes to flow [V]" text="Revert" icon="fa-history" onClick={() => onRevert(flow)} />
                 <Button title="download" text="Download" icon="fa-download" onClick={() => window.location = MessageUtils.getContentURL(flow, flow.response)}/>
             </div>
             <div className="clearfix"/>
@@ -30,5 +30,12 @@ function FlowMenu({ flow }) {
 export default connect(
     state => ({
         flow: state.flows.list.byId[state.flows.views.main.selected[0]],
-    })
+    }),
+    {
+        onAccept: flowsActions.accept,
+        onReplay: flowsActions.replay,
+        onDuplicate: flowsActions.duplicate,
+        onRemove: flowsActions.remove,
+        onRevert: flowsActions.revert,
+    }
 )(FlowMenu)
diff --git a/web/src/js/components/Header/MainMenu.jsx b/web/src/js/components/Header/MainMenu.jsx
index a466a980..1eb0acf2 100644
--- a/web/src/js/components/Header/MainMenu.jsx
+++ b/web/src/js/components/Header/MainMenu.jsx
@@ -2,7 +2,7 @@ import React, { Component, PropTypes } from 'react'
 import { connect } from 'react-redux'
 import FilterInput from './FilterInput'
 import { Query } from '../../actions.js'
-import { updateSettings } from '../../ducks/settings'
+import { update as updateSettings } from '../../ducks/settings'
 
 class MainMenu extends Component {
 
@@ -73,5 +73,9 @@ export default connect(
     }),
     {
         onSettingsChange: updateSettings,
+    },
+    null,
+    {
+        withRef: true,
     }
 )(MainMenu);
diff --git a/web/src/js/components/Header/OptionMenu.jsx b/web/src/js/components/Header/OptionMenu.jsx
index f871ec92..4a487cc9 100644
--- a/web/src/js/components/Header/OptionMenu.jsx
+++ b/web/src/js/components/Header/OptionMenu.jsx
@@ -2,7 +2,7 @@ import React, { PropTypes } from 'react'
 import { connect } from 'react-redux'
 import ToggleButton from '../common/ToggleButton'
 import ToggleInputButton from '../common/ToggleInputButton'
-import { updateSettings } from '../../ducks/settings'
+import { update as updateSettings } from '../../ducks/settings'
 
 OptionMenu.title = 'Options'