2 files changed, 17 insertions, 8 deletions
diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx
index 50568799..0f6df8da 100644
--- a/web/src/js/components/FlowView/Messages.jsx
+++ b/web/src/js/components/FlowView/Messages.jsx
@@ -9,7 +9,7 @@ import ValidateEditor from '../ValueEditor/ValidateEditor'
 import ValueEditor from '../ValueEditor/ValueEditor'
 
 import Headers from './Headers'
-import { startEdit, updateEdit } from '../../ducks/ui/flow'
+import { startEdit, updateEdit, uploadContent } from '../../ducks/ui/flow'
 import ToggleEdit from './ToggleEdit'
 
 function RequestLine({ flow, readonly, updateFlow }) {
@@ -68,17 +68,18 @@ function ResponseLine({ flow, readonly, updateFlow }) {
 
 const Message = connect(
     state => ({
-        flow: state.ui.flow.modifiedFlow || state.flows.byId[state.flows.selected[0]],
+        flow: state.flows.byId[state.flows.selected[0]],
         isEdit: !!state.ui.flow.modifiedFlow,
     }),
     {
         updateFlow: updateEdit,
+        uploadContent: uploadContent
     }
 )
 
 export class Request extends Component {
     render() {
-        const { flow, isEdit, updateFlow } = this.props
+        const { flow, isEdit, updateFlow, uploadContent } = this.props
 
         return (
             <section className="request">
@@ -94,7 +95,12 @@ export class Request extends Component {
                 />
 
                 <hr/>
-                <ContentView flow={flow} message={flow.request}/>
+                <ContentView
+                    readonly={!isEdit}
+                    flow={flow}
+                    onContentChange={content => updateFlow({ request: {content}})}
+                    uploadContent={content => uploadContent(flow, content, "request")}
+                    message={flow.request}/>
             </section>
         )
     }
@@ -129,7 +135,7 @@ Request = Message(Request)
 
 export class Response extends Component {
     render() {
-        const { flow, isEdit, updateFlow } = this.props
+        const { flow, isEdit, updateFlow, uploadContent } = this.props
 
         return (
             <section className="response">
@@ -147,6 +153,8 @@ export class Response extends Component {
                 <ContentView
                     readonly={!isEdit}
                     flow={flow}
+                    onContentChange={content => updateFlow({ response: {content}})}
+                    uploadContent={content => uploadContent(flow, content, "response")}
                     message={flow.response}
                 />
             </section>
diff --git a/web/src/js/components/FlowView/ToggleEdit.jsx b/web/src/js/components/FlowView/ToggleEdit.jsx
index 0c8cbbd8..cf197998 100644
--- a/web/src/js/components/FlowView/ToggleEdit.jsx
+++ b/web/src/js/components/FlowView/ToggleEdit.jsx
@@ -10,11 +10,11 @@ ToggleEdit.propTypes = {
     stopEdit: PropTypes.func.isRequired,
 }
 
-function ToggleEdit({ isEdit, startEdit, stopEdit, flow }) {
+function ToggleEdit({ isEdit, startEdit, stopEdit, flow, old_flow }) {
     return (
         <div className="edit-flow-container">
             {isEdit ?
-                <a className="edit-flow" onClick={() => stopEdit(flow)}>
+                <a className="edit-flow" onClick={() => stopEdit(flow, old_flow)}>
                     <i className="fa fa-check"/>
                 </a>
                 :
@@ -29,7 +29,8 @@ function ToggleEdit({ isEdit, startEdit, stopEdit, flow }) {
 export default connect(
     state => ({
         isEdit: !!state.ui.flow.modifiedFlow,
-        flow: state.ui.flow.modifiedFlow || state.flows.byId[state.flows.selected[0]]
+        flow: state.ui.flow.modifiedFlow || state.flows.byId[state.flows.selected[0]],
+        old_flow: state.flows.byId[state.flows.selected[0]]
     }),
     {
         startEdit,