aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--web/src/js/components/ContentView.jsx9
-rw-r--r--web/src/js/components/ContentView/ContentViews.jsx11
-rw-r--r--web/src/js/components/FlowView/Messages.jsx18
-rw-r--r--web/src/js/components/FlowView/ToggleEdit.jsx7
-rw-r--r--web/src/js/components/common/CodeEditor.jsx4
-rw-r--r--web/src/js/ducks/ui/flow.js26
6 files changed, 50 insertions, 25 deletions
diff --git a/web/src/js/components/ContentView.jsx b/web/src/js/components/ContentView.jsx
index 93f16ec0..06272627 100644
--- a/web/src/js/components/ContentView.jsx
+++ b/web/src/js/components/ContentView.jsx
@@ -18,7 +18,7 @@ ContentView.propTypes = {
ContentView.isContentTooLarge = msg => msg.contentLength > 1024 * 1024 * (ContentViews.ViewImage.matches(msg) ? 10 : 0.2)
function ContentView(props) {
- const { flow, message, contentView, selectView, displayLarge, setDisplayLarge, onContentChange, readonly, isFlowEditorOpen } = props
+ const { flow, message, contentView, selectView, displayLarge, setDisplayLarge, uploadContent, onContentChange, readonly } = props
if (message.contentLength === 0) {
return <MetaViews.ContentEmpty {...props}/>
@@ -38,10 +38,10 @@ function ContentView(props) {
<div>
{View.textView ? (
<ContentLoader flow={flow} message={message}>
- <View readonly={readonly} isFlowEditorOpen={isFlowEditorOpen} content="" />
+ <View readonly={readonly} onChange={onContentChange} content="" />
</ContentLoader>
) : (
- <View flow={flow} message={message} />
+ <View flow={flow} readonly={readonly} message={message} />
)}
<div className="view-options text-center">
<ViewSelector onSelectView={selectView} active={View} message={message}/>
@@ -62,7 +62,7 @@ function ContentView(props) {
ref={ref => ContentView.fileInput = ref}
className="hidden"
type="file"
- onChange={e => {if(e.target.files.length > 0) onContentChange(e.target.files[0])}}
+ onChange={e => {if(e.target.files.length > 0) uploadContent(e.target.files[0])}}
/>
</div>
</div>
@@ -73,7 +73,6 @@ export default connect(
state => ({
contentView: state.ui.flow.contentView,
displayLarge: state.ui.flow.displayLarge,
- isFlowEditorOpen : !!state.ui.flow.modifiedFlow // FIXME
}),
{
selectView: setContentView,
diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx
index 0eaf3ea8..6c7f4900 100644
--- a/web/src/js/components/ContentView/ContentViews.jsx
+++ b/web/src/js/components/ContentView/ContentViews.jsx
@@ -29,9 +29,8 @@ ViewRaw.propTypes = {
content: React.PropTypes.string.isRequired,
}
-export function ViewRaw({ content, isFlowEditorOpen, readonly }) {
- let showEditor = isFlowEditorOpen && !readonly
- return showEditor ? <CodeEditor content={content} onChange={content =>alert(content)}/> : <pre>{content}</pre>
+export function ViewRaw({ content, readonly, onChange }) {
+ return readonly ? <pre>{content}</pre> : <CodeEditor content={content} onChange={onChange}/>
}
ViewJSON.textView = true
@@ -61,12 +60,12 @@ ViewAuto.propTypes = {
flow: React.PropTypes.object.isRequired,
}
-export function ViewAuto({ message, flow }) {
+export function ViewAuto({ message, flow, readonly }) {
const View = ViewAuto.findView(message)
if (View.textView) {
- return <ContentLoader message={message} flow={flow}><View content="" /></ContentLoader>
+ return <ContentLoader message={message} flow={flow}><View readonly={readonly} content="" /></ContentLoader>
} else {
- return <View message={message} flow={flow} />
+ return <View readonly={readonly} message={message} flow={flow} />
}
}
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,
diff --git a/web/src/js/components/common/CodeEditor.jsx b/web/src/js/components/common/CodeEditor.jsx
index 5b2305a8..ad7af39d 100644
--- a/web/src/js/components/common/CodeEditor.jsx
+++ b/web/src/js/components/common/CodeEditor.jsx
@@ -13,10 +13,6 @@ export default class CodeEditor extends Component{
super(props)
}
- componentWillMount(){
- this.props.onChange(this.props.content)
- }
-
render() {
let options = {
lineNumbers: true
diff --git a/web/src/js/ducks/ui/flow.js b/web/src/js/ducks/ui/flow.js
index c70ebfa9..e78f6373 100644
--- a/web/src/js/ducks/ui/flow.js
+++ b/web/src/js/ducks/ui/flow.js
@@ -88,9 +88,31 @@ export function updateEdit(update) {
return { type: UPDATE_EDIT, update }
}
-export function stopEdit(flow) {
+export function uploadContent(flow, content, type){
return (dispatch) => {
- dispatch(flowsActions.update(flow, flow)).then(() => {
+ dispatch(flowsActions.updateContent(flow, content, type)).then( () => {
+ dispatch(flowsActions.updateFlow(flow))
+ dispatch({ type: STOP_EDIT })
+ })
+ }
+}
+
+export function stopEdit(modified_flow, old_flow) {
+ //make diff of modified_flow and old_flow
+ return (dispatch) => {
+ let flow = {...modified_flow}
+
+ if (flow.response.content) {
+ dispatch(flowsActions.updateContent(flow, flow.response.content, "response"))
+ flow.response = _.omit(flow.response, "content")
+ }
+ if (flow.request.content) {
+ dispatch(flowsActions.updateContent(flow, flow.request.content, "request"))
+ flow.request = _.omit(flow.request, "content")
+ }
+
+
+ dispatch(flowsActions.update(flow)).then(() => {
dispatch(flowsActions.updateFlow(flow))
dispatch({ type: STOP_EDIT })
})