From 2b7923b4f41ec6f8d08c17b2c4a4930e95387e1c Mon Sep 17 00:00:00 2001 From: Jason Date: Sat, 25 Jun 2016 02:18:52 +0800 Subject: [PATCH] [web] fix actions --- mitmproxy/web/static/app.js | 38 +++++++++--------- web/src/js/components/FlowView.jsx | 4 +- web/src/js/components/FlowView/Messages.jsx | 44 +++++++-------------- web/src/js/components/FlowView/Nav.jsx | 31 +++++++++++---- web/src/js/components/Header.jsx | 8 +++- web/src/js/components/Header/FileMenu.jsx | 20 +++++++--- web/src/js/components/Header/FlowMenu.jsx | 27 ++++++++----- web/src/js/components/Header/MainMenu.jsx | 6 ++- web/src/js/components/Header/OptionMenu.jsx | 2 +- web/src/js/components/MainView.jsx | 26 +++++++----- web/src/js/components/Prompt.jsx | 6 +-- web/src/js/components/ProxyApp.jsx | 9 +++-- web/src/js/ducks/flows.js | 18 ++++----- web/src/js/ducks/settings.js | 11 +++++- 14 files changed, 147 insertions(+), 103 deletions(-) diff --git a/mitmproxy/web/static/app.js b/mitmproxy/web/static/app.js index 7f7726d49..f00330981 100644 --- a/mitmproxy/web/static/app.js +++ b/mitmproxy/web/static/app.js @@ -38,7 +38,7 @@ "use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function FlowTableHead(e){var r=e.sortColumn,t=e.sortDesc,a=e.onSort,s=t?"sort-desc":"sort-asc";return _react2["default"].createElement("tr",null,_FlowColumns2["default"].map(function(e){return _react2["default"].createElement("th",{className:(0,_classnames2["default"])(e.headerClass,r===e.name&&s),key:e.name,onClick:function(){return a(e.name,e.name!==r?!1:!t)}},e.headerName)}))}Object.defineProperty(exports,"__esModule",{value:!0});var _react=require("react"),_react2=_interopRequireDefault(_react),_reactRedux=require("react-redux"),_classnames=require("classnames"),_classnames2=_interopRequireDefault(_classnames),_FlowColumns=require("./FlowColumns"),_FlowColumns2=_interopRequireDefault(_FlowColumns),_main=require("../../ducks/views/main");FlowTableHead.propTypes={onSort:_react.PropTypes.func.isRequired,sortDesc:_react2["default"].PropTypes.bool.isRequired,sortColumn:_react2["default"].PropTypes.string},exports["default"]=(0,_reactRedux.connect)(function(e){return{sortDesc:e.flows.views.main.sorter.desc,sortColumn:e.flows.views.main.sorter.column}},{onSort:_main.updateSorter})(FlowTableHead); },{"../../ducks/views/main":51,"./FlowColumns":11,"classnames":"classnames","react":"react","react-redux":"react-redux"}],14:[function(require,module,exports){ -"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function e(e,t){for(var r=0;r0&&(r.preventDefault(),this.refs[e-1+"-value"].focus())}},{key:"render",value:function(){var e=this,t=this.props.message;return _react2["default"].createElement("table",{className:"header-table"},_react2["default"].createElement("tbody",null,t.headers.map(function(t,r){return _react2["default"].createElement("tr",{key:r},_react2["default"].createElement("td",{className:"header-name"},_react2["default"].createElement(HeaderEditor,{ref:r+"-key",content:t[0],onDone:function(t){return e.onChange(r,0,t)},onRemove:function(t){return e.onRemove(r,0,t)},onTab:function(t){return e.onTab(r,0,t)}}),":"),_react2["default"].createElement("td",{className:"header-value"},_react2["default"].createElement(HeaderEditor,{ref:r+"-value",content:t[1],onDone:function(t){return e.onChange(r,1,t)},onRemove:function(t){return e.onRemove(r,1,t)},onTab:function(t){return e.onTab(r,1,t)}})))})))}}]),t}(_react.Component);Headers.propTypes={onChange:_react.PropTypes.func.isRequired,message:_react.PropTypes.object.isRequired},exports["default"]=Headers; },{"../../utils.js":55,"../ValueEditor":31,"react":"react","react-dom":"react-dom"}],17:[function(require,module,exports){ -"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function Error(e){var t=e.flow;return _react2["default"].createElement("section",null,_react2["default"].createElement("div",{className:"alert alert-warning"},t.error.msg,_react2["default"].createElement("div",null,_react2["default"].createElement("small",null,(0,_utils2.formatTimeStamp)(t.error.timestamp)))))}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Response=exports.Request=void 0;var _createClass=function(){function e(e,t){for(var r=0;r0&&(flowActions.upload(e.target.files[0]),this.fileInput.value="")}},{key:"onSaveClick",value:function(e){e.preventDefault(),flowActions.download()}},{key:"render",value:function(){var e=this;return _react2["default"].createElement("div",{className:(0,_classnames2["default"])("dropdown pull-left",{open:this.state.show})},_react2["default"].createElement("a",{href:"#",className:"special",onClick:this.onFileClick},"mitmproxy"),_react2["default"].createElement("ul",{className:"dropdown-menu",role:"menu"},_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onNewClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-file"}),"New")),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onOpenClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-folder-open"}),"Open..."),_react2["default"].createElement("input",{ref:function(t){return e.fileInput=t},className:"hidden",type:"file",onChange:this.onOpenFile})),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onSaveClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-floppy-o"}),"Save...")),_react2["default"].createElement("li",{role:"presentation",className:"divider"}),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"http://mitm.it/",target:"_blank"},_react2["default"].createElement("i",{className:"fa fa-fw fa-external-link"}),"Install Certificates..."))))}}]),t}(_react.Component);exports["default"]=FileMenu; +"use strict";function _interopRequireWildcard(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t["default"]=e,t}function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function e(e,t){for(var n=0;n0&&(this.props.onUpload(e.target.files[0]),this.fileInput.value="")}},{key:"onSaveClick",value:function(e){e.preventDefault(),this.props.onDownload()}},{key:"render",value:function(){var e=this;return _react2["default"].createElement("div",{className:(0,_classnames2["default"])("dropdown pull-left",{open:this.state.show})},_react2["default"].createElement("a",{href:"#",className:"special",onClick:this.onFileClick},"mitmproxy"),_react2["default"].createElement("ul",{className:"dropdown-menu",role:"menu"},_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onNewClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-file"}),"New")),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onOpenClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-folder-open"}),"Open..."),_react2["default"].createElement("input",{ref:function(t){return e.fileInput=t},className:"hidden",type:"file",onChange:this.onOpenFile})),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"#",onClick:this.onSaveClick},_react2["default"].createElement("i",{className:"fa fa-fw fa-floppy-o"}),"Save...")),_react2["default"].createElement("li",{role:"presentation",className:"divider"}),_react2["default"].createElement("li",null,_react2["default"].createElement("a",{href:"http://mitm.it/",target:"_blank"},_react2["default"].createElement("i",{className:"fa fa-fw fa-external-link"}),"Install Certificates..."))))}}]),t}(_react.Component);exports["default"]=(0,_reactRedux.connect)(null,{onClear:flowsActions.clear,onUpload:flowsActions.upload,onDownload:flowsActions.download})(FileMenu); -},{"../../ducks/flows":43,"classnames":"classnames","react":"react"}],22:[function(require,module,exports){ +},{"../../ducks/flows":43,"classnames":"classnames","react":"react","react-redux":"react-redux"}],22:[function(require,module,exports){ "use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function e(e,t){for(var r=0;re&&(a=i.length-1),this.selectFlow(i[a])}},{key:"onMainKeyDown",value:function(e){var t=this.props.selectedFlow;if(!e.ctrlKey){switch(e.keyCode){case _utils.Key.K:case _utils.Key.UP:this.selectFlowRelative(-1);break;case _utils.Key.J:case _utils.Key.DOWN:this.selectFlowRelative(1);break;case _utils.Key.SPACE:case _utils.Key.PAGE_DOWN:this.selectFlowRelative(10);break;case _utils.Key.PAGE_UP:this.selectFlowRelative(-10);break;case _utils.Key.END:this.selectFlowRelative(1e10);break;case _utils.Key.HOME:this.selectFlowRelative(-1e10);break;case _utils.Key.ESC:this.selectFlow(null);break;case _utils.Key.H:case _utils.Key.LEFT:this.refs.flowDetails&&this.refs.flowDetails.nextTab(-1);break;case _utils.Key.L:case _utils.Key.TAB:case _utils.Key.RIGHT:this.refs.flowDetails&&this.refs.flowDetails.nextTab(1);break;case _utils.Key.C:e.shiftKey&&_actions.FlowActions.clear();break;case _utils.Key.D:t&&(e.shiftKey?_actions.FlowActions.duplicate(t):_actions.FlowActions["delete"](t));break;case _utils.Key.A:e.shiftKey?_actions.FlowActions.accept_all():t&&t.intercepted&&_actions.FlowActions.accept(t);break;case _utils.Key.R:!e.shiftKey&&t&&_actions.FlowActions.replay(t);break;case _utils.Key.V:e.shiftKey&&t&&t.modified&&_actions.FlowActions.revert(t);break;case _utils.Key.E:this.refs.flowDetails&&this.refs.flowDetails.promptEdit();break;case _utils.Key.SHIFT:break;default:return void console.debug("keydown",e.keyCode)}e.preventDefault()}}},{key:"render",value:function(){var e=this,t=this.props,i=t.flows,l=t.selectedFlow,s=t.highlight;return _react2["default"].createElement("div",{className:"main-view"},_react2["default"].createElement(_FlowTable2["default"],{ref:"flowTable",flows:i,selected:l,highlight:s,onSelect:function(t){return e.selectFlow(t)}}),l&&[_react2["default"].createElement(_Splitter2["default"],{key:"splitter"}),_react2["default"].createElement(_FlowView2["default"],{key:"flowDetails",ref:"flowDetails",tab:this.props.routeParams.detailTab,query:this.props.query,updateLocation:this.props.updateLocation,flow:l})])}}]),t}(_react.Component);MainView.propTypes={highlight:_react.PropTypes.string,sort:_react.PropTypes.object},exports["default"]=(0,_reactRedux.connect)(function(e){return{flows:e.flows.views.main.view.data,filter:e.flows.views.main.filter,highlight:e.flows.views.main.highlight,selectedFlow:e.flows.list.data[e.flows.views.main.selected[0]]}},{selectFlow:_main.selectFlow,updateFilter:_main.updateFilter,updateHighlight:_main.updateHighlight},void 0,{withRef:!0})(MainView); +"use strict";function _interopRequireWildcard(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t["default"]=e,t}function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function e(e,t){for(var i=0;ie&&(r=i.length-1),this.selectFlow(i[r])}},{key:"onMainKeyDown",value:function(e){var t=this.props.selectedFlow;if(!e.ctrlKey){switch(e.keyCode){case _utils.Key.K:case _utils.Key.UP:this.selectFlowRelative(-1);break;case _utils.Key.J:case _utils.Key.DOWN:this.selectFlowRelative(1);break;case _utils.Key.SPACE:case _utils.Key.PAGE_DOWN:this.selectFlowRelative(10);break;case _utils.Key.PAGE_UP:this.selectFlowRelative(-10);break;case _utils.Key.END:this.selectFlowRelative(1e10);break;case _utils.Key.HOME:this.selectFlowRelative(-1e10);break;case _utils.Key.ESC:this.selectFlow(null);break;case _utils.Key.H:case _utils.Key.LEFT:this.refs.flowDetails&&this.refs.flowDetails.nextTab(-1);break;case _utils.Key.L:case _utils.Key.TAB:case _utils.Key.RIGHT:this.refs.flowDetails&&this.refs.flowDetails.nextTab(1);break;case _utils.Key.C:e.shiftKey&&this.props.onClear();break;case _utils.Key.D:t&&(e.shiftKey?this.props.onDuplicate(t):this.props.onRemove(t));break;case _utils.Key.A:e.shiftKey?this.props.onAcceptAll():t&&t.intercepted&&this.props.onAccept(t);break;case _utils.Key.R:!e.shiftKey&&t&&this.props.onReplay(t);break;case _utils.Key.V:e.shiftKey&&t&&t.modified&&this.props.onRevert(t);break;case _utils.Key.E:this.refs.flowDetails&&this.refs.flowDetails.promptEdit();break;case _utils.Key.SHIFT:break;default:return}e.preventDefault()}}},{key:"render",value:function(){var e=this,t=this.props,i=t.flows,l=t.selectedFlow,s=t.highlight;return _react2["default"].createElement("div",{className:"main-view"},_react2["default"].createElement(_FlowTable2["default"],{ref:"flowTable",flows:i,selected:l,highlight:s,onSelect:function(t){return e.selectFlow(t)}}),l&&[_react2["default"].createElement(_Splitter2["default"],{key:"splitter"}),_react2["default"].createElement(_FlowView2["default"],{key:"flowDetails",ref:"flowDetails",tab:this.props.routeParams.detailTab,query:this.props.query,updateLocation:this.props.updateLocation,onUpdate:function(t){return e.props.onUpdate(l,t)},flow:l})])}}]),t}(_react.Component);MainView.propTypes={highlight:_react.PropTypes.string,sort:_react.PropTypes.object},exports["default"]=(0,_reactRedux.connect)(function(e){return{flows:e.flows.views.main.view.data,filter:e.flows.views.main.filter,highlight:e.flows.views.main.highlight,selectedFlow:e.flows.list.byId[e.flows.views.main.selected[0]]}},{selectFlow:_main.select,updateFilter:_main.updateFilter,updateHighlight:_main.updateHighlight,onUpdate:flowsActions.update,onClear:flowsActions.clear,onDuplicate:flowsActions.duplicate,onRemove:flowsActions.remove,onAcceptAll:flowsActions.acceptAll,onAccept:flowsActions.accept,onReplay:flowsActions.replay,onRevert:flowsActions.revert},void 0,{withRef:!0})(MainView); -},{"../actions.js":1,"../ducks/views/main":51,"../utils.js":55,"./FlowTable":10,"./FlowView":14,"./common/Splitter":35,"react":"react","react-redux":"react-redux"}],29:[function(require,module,exports){ -"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function Prompt(e,t){function r(e){return _lodash2["default"].map(i,"key").includes(e)}function o(e){e.stopPropagation(),e.preventDefault();var r=i.find(function(t){return _utils.Key[t.key.toUpperCase()]===e.keyCode});(r||e.keyCode===_utils.Key.ESC||e.keyCode===_utils.Key.ENTER)&&(n(k||!1),t.returnFocus())}for(var a=e.prompt,n=e.done,u=e.options,i=[],s=0;s0&&r(p[0]);)p=p.substr(1);l={text:l,key:p[0]}}if(!l.text||!l.key||r(l.key))throw"invalid options";i.push(l)}return _react2["default"].createElement("div",{tabIndex:"0",onKeyDown:o,onClick:onClick,className:"prompt-dialog"},_react2["default"].createElement("div",{className:"prompt-content"},a||_react2["default"].createElement("strong",null,"Select: "),i.map(function(e){function t(t){n(e.key),t.stopPropagation()}var r=e.text.indexOf(e.key);return _react2["default"].createElement("span",{key:e.key,className:"option",onClick:t},-1!==r?e.text.substring(0,r):e.text+"(",prefix,_react2["default"].createElement("strong",{className:"text-primary"},e.key),-1!==r?e.text.substring(r+1):")")})))}Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=Prompt;var _react=require("react"),_react2=_interopRequireDefault(_react),_reactDom=require("react-dom"),_reactDom2=_interopRequireDefault(_reactDom),_lodash=require("lodash"),_lodash2=_interopRequireDefault(_lodash),_utils=require("../utils.js");Prompt.contextTypes={returnFocus:_react.PropTypes.func},Prompt.propTypes={options:_react.PropTypes.array.isRequired,done:_react.PropTypes.func.isRequired,prompt:_react.PropTypes.string}; +},{"../actions.js":1,"../ducks/flows":43,"../ducks/views/main":51,"../utils.js":55,"./FlowTable":10,"./FlowView":14,"./common/Splitter":35,"react":"react","react-redux":"react-redux"}],29:[function(require,module,exports){ +"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function Prompt(e,t){function r(e){return _lodash2["default"].map(s,"key").includes(e)}function o(e){e.stopPropagation(),e.preventDefault();var r=s.find(function(t){return _utils.Key[t.key.toUpperCase()]===e.keyCode});(r||e.keyCode===_utils.Key.ESC||e.keyCode===_utils.Key.ENTER)&&(n(r.key||!1),t.returnFocus())}for(var a=e.prompt,n=e.done,u=e.options,s=[],i=0;i0&&r(l[0]);)l=l.substr(1);p={text:p,key:l[0]}}if(!p.text||!p.key||r(p.key))throw"invalid options";s.push(p)}return _react2["default"].createElement("div",{tabIndex:"0",onKeyDown:o,className:"prompt-dialog"},_react2["default"].createElement("div",{className:"prompt-content"},a||_react2["default"].createElement("strong",null,"Select: "),s.map(function(e){function t(t){n(e.key),t.stopPropagation()}var r=e.text.indexOf(e.key);return _react2["default"].createElement("span",{key:e.key,className:"option",onClick:t},-1!==r?e.text.substring(0,r):e.text+"(",_react2["default"].createElement("strong",{className:"text-primary"},e.key),-1!==r?e.text.substring(r+1):")")})))}Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=Prompt;var _react=require("react"),_react2=_interopRequireDefault(_react),_reactDom=require("react-dom"),_reactDom2=_interopRequireDefault(_reactDom),_lodash=require("lodash"),_lodash2=_interopRequireDefault(_lodash),_utils=require("../utils.js");Prompt.contextTypes={returnFocus:_react.PropTypes.func},Prompt.propTypes={options:_react.PropTypes.array.isRequired,done:_react.PropTypes.func.isRequired,prompt:_react.PropTypes.string}; },{"../utils.js":55,"lodash":"lodash","react":"react","react-dom":"react-dom"}],30:[function(require,module,exports){ -"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function e(e,t){for(var r=0;rs?r?-1:1:s>n?r?1:-1:0}:void 0}Object.defineProperty(exports,"__esModule",{value:!0}),exports.SELECT=exports.UPDATE_HIGHLIGHT=exports.UPDATE_SORTER=exports.UPDATE_FILTER=void 0;var _extends=Object.assign||function(e){for(var t=1;ts?r?-1:1:s>n?r?1:-1:0}:void 0}Object.defineProperty(exports,"__esModule",{value:!0}),exports.SELECT=exports.UPDATE_HIGHLIGHT=exports.UPDATE_SORTER=exports.UPDATE_FILTER=void 0;var _extends=Object.assign||function(e){for(var t=1;t - + {this.state.prompt && ( )} diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx index ba6a5f2be..5321edd68 100644 --- a/web/src/js/components/FlowView/Messages.jsx +++ b/web/src/js/components/FlowView/Messages.jsx @@ -1,7 +1,6 @@ -import React, { Component } from 'react' +import React, { Component, PropTypes } from 'react' import _ from 'lodash' -import { FlowActions } from '../../actions.js' import { RequestUtils, isValidHttpVersion, parseUrl, parseHttpVersion } from '../../flow/utils.js' import { Key, formatTimeStamp } from '../../utils.js' import ContentView from '../ContentView' @@ -11,21 +10,21 @@ import Headers from './Headers' class RequestLine extends Component { render() { - const { flow } = this.props + const { flow, onUpdate } = this.props return (
FlowActions.update(flow, { request: { method } })} + onDone={method => onUpdate({ request: { method } })} inline />   FlowActions.update(flow, { request: Object.assign({ path: '' }, parseUrl(url)) })} + onDone={url => onUpdate({ request: Object.assign({ path: '' }, parseUrl(url)) })} isValid={url => !!parseUrl(url).host} inline /> @@ -33,7 +32,7 @@ class RequestLine extends Component { FlowActions.update(flow, { request: { http_version: parseHttpVersion(ver) } })} + onDone={ver => onUpdate({ request: { http_version: parseHttpVersion(ver) } })} isValid={isValidHttpVersion} inline /> @@ -45,14 +44,14 @@ class RequestLine extends Component { class ResponseLine extends Component { render() { - const { flow } = this.props + const { flow, onUpdate } = this.props return (
FlowActions.update(flow, { response: { http_version: parseHttpVersion(nextVer) } })} + onDone={nextVer => onUpdate({ response: { http_version: parseHttpVersion(nextVer) } })} isValid={isValidHttpVersion} inline /> @@ -60,7 +59,7 @@ class ResponseLine extends Component { FlowActions.update(flow, { response: { code: parseInt(code) } })} + onDone={code => onUpdate({ response: { code: parseInt(code) } })} isValid={code => /^\d+$/.test(code)} inline /> @@ -68,7 +67,7 @@ class ResponseLine extends Component { FlowActions.update(flow, { response: { msg } })} + onDone={msg => onUpdate({ response: { msg } })} inline />
@@ -79,15 +78,15 @@ class ResponseLine extends Component { export class Request extends Component { render() { - const { flow } = this.props + const { flow, onUpdate } = this.props return (
- + FlowActions.update(flow, { request: { headers } })} + onChange={headers => onUpdate({ request: { headers } })} />
@@ -118,15 +117,15 @@ export class Request extends Component { export class Response extends Component { render() { - const { flow } = this.props + const { flow, onUpdate } = this.props return (
- + FlowActions.update(flow, { response: { headers } })} + onChange={headers => onUpdate({ response: { headers } })} />
@@ -153,16 +152,3 @@ export class Response extends Component { } } } - -export function Error({ flow }) { - return ( -
-
- {flow.error.msg} -
- {formatTimeStamp(flow.error.timestamp)} -
-
-
- ) -} diff --git a/web/src/js/components/FlowView/Nav.jsx b/web/src/js/components/FlowView/Nav.jsx index 386c3a6ca..b9e15d922 100644 --- a/web/src/js/components/FlowView/Nav.jsx +++ b/web/src/js/components/FlowView/Nav.jsx @@ -1,6 +1,7 @@ import React, { PropTypes } from 'react' +import { connect } from 'react-redux' import classnames from 'classnames' -import { FlowActions } from '../../actions.js' +import * as flowsActions from '../../ducks/flows' NavAction.propTypes = { icon: PropTypes.string.isRequired, @@ -27,9 +28,14 @@ Nav.propTypes = { active: PropTypes.string.isRequired, tabs: PropTypes.array.isRequired, onSelectTab: PropTypes.func.isRequired, + onRemove: PropTypes.func.isRequired, + onDuplicate: PropTypes.func.isRequired, + onReplay: PropTypes.func.isRequired, + onAccept: PropTypes.func.isRequired, + onRevert: PropTypes.func.isRequired, } -export default function Nav({ flow, active, tabs, onSelectTab }) { +function Nav({ flow, active, tabs, onSelectTab, onRemove, onDuplicate, onReplay, onAccept, onRevert }) { return ( ) } + +export default connect( + null, + { + onRemove: flowsActions.remove, + onDuplicate: flowsActions.duplicate, + onReplay: flowsActions.replay, + onAccept: flowsActions.accept, + onRevert: flowsActions.revert, + } +)(Nav) diff --git a/web/src/js/components/Header.jsx b/web/src/js/components/Header.jsx index 545684bbc..b6ef1cc73 100644 --- a/web/src/js/components/Header.jsx +++ b/web/src/js/components/Header.jsx @@ -14,8 +14,6 @@ class Header extends Component { handleClick(active, e) { e.preventDefault() this.props.setActiveMenu(active.title) - // this.props.updateLocation(active.route) - // this.setState({ active }) } render() { @@ -42,6 +40,7 @@ class Header extends Component {
@@ -50,6 +49,7 @@ class Header extends Component { ) } } + export default connect( state => ({ selectedFlow: state.flows.views.main.selected[0], @@ -57,5 +57,9 @@ export default connect( }), { setActiveMenu, + }, + null, + { + withRef: true, } )(Header) diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx index e1c62e288..a4466784c 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 1fa7037f7..ba1dcbcbd 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 Button from '../common/Button' -import { FlowActions } from '../../actions.js' -import { MessageUtils } from '../../flow/utils.js' import { connect } from 'react-redux' +import Button from '../common/Button' +import { MessageUtils } from '../../flow/utils.js' +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 (
-
@@ -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 a466a9801..1eb0acf2e 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 f871ec925..4a487cc99 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' diff --git a/web/src/js/components/MainView.jsx b/web/src/js/components/MainView.jsx index 847223d26..5066d2633 100644 --- a/web/src/js/components/MainView.jsx +++ b/web/src/js/components/MainView.jsx @@ -1,11 +1,11 @@ import React, { Component, PropTypes } from 'react' import { connect } from 'react-redux' -import { FlowActions } from '../actions.js' import { Query } from '../actions.js' import { Key } from '../utils.js' import Splitter from './common/Splitter' import FlowTable from './FlowTable' import FlowView from './FlowView' +import * as flowsActions from '../ducks/flows' import { select as selectFlow, updateFilter, updateHighlight } from '../ducks/views/main' class MainView extends Component { @@ -110,33 +110,33 @@ class MainView extends Component { break case Key.C: if (e.shiftKey) { - FlowActions.clear() + this.props.onClear() } break case Key.D: if (flow) { if (e.shiftKey) { - FlowActions.duplicate(flow) + this.props.onDuplicate(flow) } else { - FlowActions.delete(flow) + this.props.onRemove(flow) } } break case Key.A: if (e.shiftKey) { - FlowActions.accept_all() + this.props.onAcceptAll() } else if (flow && flow.intercepted) { - FlowActions.accept(flow) + this.props.onAccept(flow) } break case Key.R: if (!e.shiftKey && flow) { - FlowActions.replay(flow) + this.props.onReplay(flow) } break case Key.V: if (e.shiftKey && flow && flow.modified) { - FlowActions.revert(flow) + this.props.onRevert(flow) } break case Key.E: @@ -147,7 +147,6 @@ class MainView extends Component { case Key.SHIFT: break default: - console.debug('keydown', e.keyCode) return } e.preventDefault() @@ -172,6 +171,7 @@ class MainView extends Component { tab={this.props.routeParams.detailTab} query={this.props.query} updateLocation={this.props.updateLocation} + onUpdate={attrs => this.props.onUpdate(selectedFlow, attrs)} flow={selectedFlow} /> ]} @@ -191,6 +191,14 @@ export default connect( selectFlow, updateFilter, updateHighlight, + onUpdate: flowsActions.update, + onClear: flowsActions.clear, + onDuplicate: flowsActions.duplicate, + onRemove: flowsActions.remove, + onAcceptAll: flowsActions.acceptAll, + onAccept: flowsActions.accept, + onReplay: flowsActions.replay, + onRevert: flowsActions.revert, }, undefined, { withRef: true } diff --git a/web/src/js/components/Prompt.jsx b/web/src/js/components/Prompt.jsx index 6b19b3b39..701a0b85e 100755 --- a/web/src/js/components/Prompt.jsx +++ b/web/src/js/components/Prompt.jsx @@ -37,7 +37,7 @@ export default function Prompt({ prompt, done, options }, context) { } return ( -
+
{prompt || Select: } {opts.map(opt => { @@ -49,7 +49,7 @@ export default function Prompt({ prompt, done, options }, context) { return ( {idx !== -1 ? opt.text.substring(0, idx) : opt.text + '('} - {prefix}{opt.key} + {opt.key} {idx !== -1 ? opt.text.substring(idx + 1) : ')'} ) @@ -65,7 +65,7 @@ export default function Prompt({ prompt, done, options }, context) { if (!key && event.keyCode !== Key.ESC && event.keyCode !== Key.ENTER) { return } - done(k || false) + done(key.key || false) context.returnFocus() } } diff --git a/web/src/js/components/ProxyApp.jsx b/web/src/js/components/ProxyApp.jsx index 84564c325..1ac979bc8 100644 --- a/web/src/js/components/ProxyApp.jsx +++ b/web/src/js/components/ProxyApp.jsx @@ -77,8 +77,8 @@ class ProxyAppMain extends Component { break default: let main = this.refs.view - if (this.refs.view.getWrappedInstance) { - main = this.refs.view.getWrappedInstance() + if (this.refs.view.refs.wrappedInstance) { + main = this.refs.view.refs.wrappedInstance } if (main.onMainKeyDown) { main.onMainKeyDown(e) @@ -87,9 +87,10 @@ class ProxyAppMain extends Component { } if (name) { - const headerComponent = this.refs.header + const headerComponent = this.refs.header.refs.wrappedInstance || this.refs.header headerComponent.setState({ active: Header.entries[0] }, () => { - headerComponent.refs.active.refs[name].select() + const active = headerComponent.refs.active.refs.wrappedInstance || headerComponent.refs.active + active.refs[name].select() }) } diff --git a/web/src/js/ducks/flows.js b/web/src/js/ducks/flows.js index e9ac38f6c..fc6b3f8ce 100644 --- a/web/src/js/ducks/flows.js +++ b/web/src/js/ducks/flows.js @@ -40,8 +40,8 @@ export default function reduce(state = defaultState, action) { case REMOVE: return { ...state, - list: reduceList(state.list, listActions.remove(action.item.id)), - views: reduceViews(state.views, viewsActions.remove(action.item.id)), + list: reduceList(state.list, listActions.remove(action.id)), + views: reduceViews(state.views, viewsActions.remove(action.id)), } case RECEIVE: @@ -113,7 +113,7 @@ export function revert(flow) { * @public */ export function update(flow, body) { - fetchApi(`/flows/${flow.id}`, { method: 'PUT', body }) + fetchApi.put(`/flows/${flow.id}`, body) return { type: REQUEST_ACTION } } @@ -152,13 +152,13 @@ export function handleWsMsg(msg) { switch (msg.cmd) { case websocketActions.CMD_ADD: - return add(msg.data) + return addItem(msg.data) case websocketActions.CMD_UPDATE: - return update(msg.data.id, msg.data) + return updateItem(msg.data.id, msg.data) case websocketActions.CMD_REMOVE: - return remove(msg.data.id) + return removeItem(msg.data.id) case websocketActions.CMD_RESET: return fetchData() @@ -185,20 +185,20 @@ export function receiveData(list) { /** * @private */ -export function add(item) { +export function addItem(item) { return { type: ADD, item } } /** * @private */ -export function update(id, item) { +export function updateItem(id, item) { return { type: UPDATE, id, item } } /** * @private */ -export function remove(id) { +export function removeItem(id) { return { type: REMOVE, id } } diff --git a/web/src/js/ducks/settings.js b/web/src/js/ducks/settings.js index 7101aa1e5..b2ce9085a 100644 --- a/web/src/js/ducks/settings.js +++ b/web/src/js/ducks/settings.js @@ -40,7 +40,7 @@ export function handleWsMsg(msg) { switch (msg.cmd) { case websocketActions.CMD_UPDATE: - return { type: UPDATE, settings: msg.data } + return updateSettings(msg.data) default: console.error('unknown settings update', msg) @@ -51,7 +51,7 @@ export function handleWsMsg(msg) { /** * @public */ -export function updateSettings(settings) { +export function update(settings) { fetchApi.put('/settings', settings) return { type: REQUEST_UPDATE } } @@ -69,3 +69,10 @@ export function fetchData() { export function receiveData(settings) { return { type: RECEIVE, settings } } + +/** + * @private + */ +export function updateSettings(settings) { + return { type: UPDATE, settings } +}