diff options
author | Clemens <cle1000.cb@gmail.com> | 2016-07-19 12:23:20 +0200 |
---|---|---|
committer | Clemens <cle1000.cb@gmail.com> | 2016-07-19 12:23:20 +0200 |
commit | 48728af43ad746d70ef3e251dc28b75028dea1e6 (patch) | |
tree | 77b8b1eef4845c5bcc641d748435a32558c5d089 /web/src/js/components/FlowView | |
parent | 87797d7ac07108ce5fd00902918e4900907b94b6 (diff) | |
download | mitmproxy-48728af43ad746d70ef3e251dc28b75028dea1e6.tar.gz mitmproxy-48728af43ad746d70ef3e251dc28b75028dea1e6.tar.bz2 mitmproxy-48728af43ad746d70ef3e251dc28b75028dea1e6.zip |
moved flow editor state to redux
Diffstat (limited to 'web/src/js/components/FlowView')
-rw-r--r-- | web/src/js/components/FlowView/FlowEditorButton.jsx | 48 | ||||
-rw-r--r-- | web/src/js/components/FlowView/Messages.jsx | 15 |
2 files changed, 59 insertions, 4 deletions
diff --git a/web/src/js/components/FlowView/FlowEditorButton.jsx b/web/src/js/components/FlowView/FlowEditorButton.jsx new file mode 100644 index 00000000..e9c75535 --- /dev/null +++ b/web/src/js/components/FlowView/FlowEditorButton.jsx @@ -0,0 +1,48 @@ +import React, { PropTypes, Component } from 'react' +import { connect } from 'react-redux' + +import {closeFlowEditor} from '../../ducks/ui.js' +import {openFlowEditor} from '../../ducks/ui.js' + +// FlowEditorButton.propTypes = { +// isFlowEditorOpen: PropTypes.bool.isRequired, +// content: PropTypes.string.isRequired, +// onContentChange: PropTypes.func.isRequired +// } + +class FlowEditorButton extends Component{ + static propTypes = { + isFlowEditorOpen: PropTypes.bool.isRequired, + content: PropTypes.string.isRequired, + onContentChange: PropTypes.func.isRequired + } + + render(){ + let { isFlowEditorOpen, closeFlowEditor, openFlowEditor, onContentChange, content } = this.props + return ( + <div className="edit-flow-container"> + {isFlowEditorOpen ? + <a className="edit-flow" onClick={() => {onContentChange(content); closeFlowEditor()}}> + <i className="fa fa-check"/> + </a> + : + <a className="edit-flow" onClick={() => openFlowEditor()}> + <i className="fa fa-pencil"/> + </a> + } + </div> + ) + } +} + +export default connect( + state => ({ + isFlowEditorOpen: state.ui.isFlowEditorOpen, + content: state.flows.modifiedFlow.content + }), + { + closeFlowEditor, + openFlowEditor + + } +)(FlowEditorButton) diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx index 27e18c05..8cb918a8 100644 --- a/web/src/js/components/FlowView/Messages.jsx +++ b/web/src/js/components/FlowView/Messages.jsx @@ -7,6 +7,8 @@ import ContentView from '../ContentView' import ValueEditor from '../ValueEditor' import Headers from './Headers' import * as flowActions from '../../ducks/flows' +import FlowEditorButton from './FlowEditorButton.jsx' + class RequestLine extends Component { @@ -77,21 +79,23 @@ class ResponseLine extends Component { } export class Request extends Component { - - render() { + render() { const { flow, updateFlow } = this.props + let onContentChange = content => flowActions.updateContent(this.props.flow, content, "request") return ( <section className="request"> + <FlowEditorButton onContentChange={onContentChange}/> <RequestLine ref="requestLine" flow={flow} updateFlow={updateFlow} /> <Headers ref="headers" message={flow.request} onChange={headers => updateFlow({ request: { headers } })} /> + <hr/> <ContentView flow={flow} - onContentChange={content => flowActions.updateContent(this.props.flow, content, "request") } + onContentChange={onContentChange} message={flow.request} /> </section> @@ -120,11 +124,14 @@ export class Request extends Component { export class Response extends Component { + render() { const { flow, updateFlow } = this.props + let onContentChange = content => flowActions.updateContent(this.props.flow, content, "response") return ( <section className="response"> + <FlowEditorButton onContentChange={onContentChange}/> <ResponseLine ref="responseLine" flow={flow} updateFlow={updateFlow} /> <Headers ref="headers" @@ -133,7 +140,7 @@ export class Response extends Component { /> <hr/> <ContentView flow={flow} - onContentChange={content => flowActions.updateContent(this.props.flow, content, "response") } + onContentChange={onContentChange} message={flow.response} /> </section> |