aboutsummaryrefslogtreecommitdiffstats
path: root/web/src/js
diff options
context:
space:
mode:
Diffstat (limited to 'web/src/js')
-rw-r--r--web/src/js/components/ContentView.jsx2
-rw-r--r--web/src/js/components/ContentView/ContentViews.jsx1
-rw-r--r--web/src/js/components/FlowView/FlowEditorButton.jsx48
-rw-r--r--web/src/js/components/FlowView/Messages.jsx22
-rw-r--r--web/src/js/components/common/Button.jsx8
-rw-r--r--web/src/js/components/common/CodeEditor.jsx30
-rw-r--r--web/src/js/components/common/Splitter.jsx1
-rw-r--r--web/src/js/ducks/flows.js11
8 files changed, 115 insertions, 8 deletions
diff --git a/web/src/js/components/ContentView.jsx b/web/src/js/components/ContentView.jsx
index 6a982a5d..0b93d3f0 100644
--- a/web/src/js/components/ContentView.jsx
+++ b/web/src/js/components/ContentView.jsx
@@ -6,6 +6,8 @@ import * as MetaViews from './ContentView/MetaViews'
import ContentLoader from './ContentView/ContentLoader'
import ViewSelector from './ContentView/ViewSelector'
import { setContentView, setDisplayLarge } from '../ducks/ui'
+import CodeEditor from './common/CodeEditor'
+import {setModifiedFlowContent} from '../ducks/flows'
ContentView.propTypes = {
// It may seem a bit weird at the first glance:
diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx
index b0297dcc..82ee0adc 100644
--- a/web/src/js/components/ContentView/ContentViews.jsx
+++ b/web/src/js/components/ContentView/ContentViews.jsx
@@ -2,6 +2,7 @@ import React, { PropTypes } from 'react'
import ContentLoader from './ContentLoader'
import { MessageUtils } from '../../flow/utils.js'
+
const views = [ViewAuto, ViewImage, ViewJSON, ViewRaw]
ViewImage.regex = /^image\/(png|jpe?g|gif|vnc.microsoft.icon|x-icon)$/i
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 9295f97c..8cb918a8 100644
--- a/web/src/js/components/FlowView/Messages.jsx
+++ b/web/src/js/components/FlowView/Messages.jsx
@@ -6,6 +6,9 @@ import { Key, formatTimeStamp } from '../../utils.js'
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 {
@@ -76,20 +79,25 @@ 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} message={flow.request}/>
+ <ContentView flow={flow}
+ onContentChange={onContentChange}
+ message={flow.request}
+ />
</section>
)
}
@@ -116,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"
@@ -128,7 +139,10 @@ export class Response extends Component {
onChange={headers => updateFlow({ response: { headers } })}
/>
<hr/>
- <ContentView flow={flow} message={flow.response}/>
+ <ContentView flow={flow}
+ onContentChange={onContentChange}
+ message={flow.response}
+ />
</section>
)
}
diff --git a/web/src/js/components/common/Button.jsx b/web/src/js/components/common/Button.jsx
index 574288df..cd01af22 100644
--- a/web/src/js/components/common/Button.jsx
+++ b/web/src/js/components/common/Button.jsx
@@ -2,7 +2,8 @@ import React, { PropTypes } from 'react'
Button.propTypes = {
onClick: PropTypes.func.isRequired,
- text: PropTypes.string.isRequired
+ text: PropTypes.string,
+ icon: PropTypes.string
}
export default function Button({ onClick, text, icon, disabled }) {
@@ -10,9 +11,8 @@ export default function Button({ onClick, text, icon, disabled }) {
<div className={"btn btn-default"}
onClick={onClick}
disabled={disabled}>
- <i className={"fa fa-fw " + icon}/>
- &nbsp;
- {text}
+ {icon && (<i className={"fa fa-fw " + icon}/> )}
+ {text && text}
</div>
)
}
diff --git a/web/src/js/components/common/CodeEditor.jsx b/web/src/js/components/common/CodeEditor.jsx
new file mode 100644
index 00000000..5b2305a8
--- /dev/null
+++ b/web/src/js/components/common/CodeEditor.jsx
@@ -0,0 +1,30 @@
+import React, { Component, PropTypes } from 'react'
+import { render } from 'react-dom';
+import Codemirror from 'react-codemirror';
+
+
+export default class CodeEditor extends Component{
+ static propTypes = {
+ content: PropTypes.string.isRequired,
+ onChange: PropTypes.func.isRequired,
+ }
+
+ constructor(props){
+ super(props)
+ }
+
+ componentWillMount(){
+ this.props.onChange(this.props.content)
+ }
+
+ render() {
+ let options = {
+ lineNumbers: true
+ };
+ return (
+ <div onKeyDown={e => e.stopPropagation()}>
+ <Codemirror value={this.props.content} onChange={this.props.onChange} options={options}/>
+ </div>
+ )
+ }
+}
diff --git a/web/src/js/components/common/Splitter.jsx b/web/src/js/components/common/Splitter.jsx
index 9d22b6fd..bd4fb3d2 100644
--- a/web/src/js/components/common/Splitter.jsx
+++ b/web/src/js/components/common/Splitter.jsx
@@ -12,6 +12,7 @@ export default class Splitter extends Component {
this.state = { applied: false, startX: false, startY: false }
this.onMouseMove = this.onMouseMove.bind(this)
+ this.onMouseDown = this.onMouseDown.bind(this)
this.onMouseUp = this.onMouseUp.bind(this)
this.onDragEnd = this.onDragEnd.bind(this)
}
diff --git a/web/src/js/ducks/flows.js b/web/src/js/ducks/flows.js
index dfcd5ba9..ffb7ac87 100644
--- a/web/src/js/ducks/flows.js
+++ b/web/src/js/ducks/flows.js
@@ -16,6 +16,7 @@ export const UNKNOWN_CMD = 'FLOWS_UNKNOWN_CMD'
export const FETCH_ERROR = 'FLOWS_FETCH_ERROR'
export const SELECT = 'FLOWS_SELECT'
+
const defaultState = {
selected: [],
...reduceList(undefined, {}),
@@ -118,6 +119,16 @@ export function update(flow, data) {
return { type: REQUEST_ACTION }
}
+export function updateContent(flow, file, type) {
+ const body = new FormData()
+ if (typeof file !== File)
+ file = new Blob([file], {type: 'plain/text'})
+ body.append('file', file)
+ fetchApi(`/flows/${flow.id}/${type}/content`, {method: 'post', body} )
+ return { type: REQUEST_ACTION }
+}
+
+
/**
* @public
*/
generated by cgit v1.2.3 (git 2.25.1) at 2025-04-15 23:00:00 +0000