aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--mitmproxy/web/static/app.js62
-rw-r--r--web/src/js/components/Header.js21
-rw-r--r--web/src/js/components/MainView.jsx6
-rw-r--r--web/src/js/ducks/view.js31
4 files changed, 36 insertions, 84 deletions
diff --git a/mitmproxy/web/static/app.js b/mitmproxy/web/static/app.js
index b229e651..a1354a7d 100644
--- a/mitmproxy/web/static/app.js
+++ b/mitmproxy/web/static/app.js
@@ -1390,12 +1390,6 @@ var Header = function (_Component) {
var selectedFlow = _props.selectedFlow;
var active_menu = _props.active_menu;
- var Active = _.find(Header.entries, function (e) {
- return e.title == active_menu;
- });
- var entries = selectedFlow ? Header.entries : Header.entries.filter(function (h) {
- return h != _FlowMenu2.default;
- });
return _react2.default.createElement(
'header',
null,
@@ -1403,12 +1397,12 @@ var Header = function (_Component) {
'nav',
{ className: 'nav-tabs nav-tabs-lg' },
_react2.default.createElement(_FileMenu2.default, null),
- entries.map(function (Entry) {
+ Header.entries.map(function (Entry) {
return _react2.default.createElement(
'a',
{ key: Entry.title,
href: '#',
- className: (0, _classnames2.default)({ active: Entry === Active }),
+ className: (0, _classnames2.default)({ active: Entry.title === active_menu, hidden: !selectedFlow && Entry === _FlowMenu2.default }),
onClick: function onClick(e) {
return _this2.handleClick(Entry, e);
} },
@@ -1419,11 +1413,16 @@ var Header = function (_Component) {
_react2.default.createElement(
'div',
{ className: 'menu' },
- _react2.default.createElement(Active, {
- ref: 'active',
- settings: settings,
- updateLocation: updateLocation,
- query: query
+ Header.entries.map(function (Entry) {
+ return _react2.default.createElement(
+ 'div',
+ { className: (0, _classnames2.default)({ hidden: Entry.title !== active_menu }) },
+ _react2.default.createElement(Entry, {
+ settings: settings,
+ updateLocation: updateLocation,
+ query: query
+ })
+ );
})
)
);
@@ -2281,8 +2280,6 @@ var _index2 = _interopRequireDefault(_index);
var _flows = require('../ducks/flows');
-var _view = require('../ducks/view');
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -2329,10 +2326,8 @@ var MainView = function (_Component) {
key: 'selectFlow',
value: function selectFlow(flow) {
if (flow) {
- this.props.setFlowMenu();
this.props.updateLocation('/flows/' + flow.id + '/' + (this.props.routeParams.detailTab || 'request'));
} else {
- this.props.setDefaultMenu();
this.props.updateLocation('/flows');
}
}
@@ -2506,14 +2501,12 @@ exports.default = (0, _reactRedux.connect)(function (state) {
}, function (dispatch) {
return (0, _redux.bindActionCreators)({
selectFlow: _flows.selectFlow,
- setDefaultMenu: _view.setDefaultMenu,
- setFlowMenu: _view.setFlowMenu,
setFilter: _flows.setFilter,
setHighlight: _flows.setHighlight
}, dispatch);
}, undefined, { withRef: true })(MainView);
-},{"../actions.js":2,"../ducks/flows":34,"../ducks/view":38,"../utils.js":43,"./FlowTable":6,"./common.js":21,"./flowview/index.js":25,"react":"react","react-redux":"react-redux","redux":"redux"}],20:[function(require,module,exports){
+},{"../actions.js":2,"../ducks/flows":34,"../utils.js":43,"./FlowTable":6,"./common.js":21,"./flowview/index.js":25,"react":"react","react-redux":"react-redux","redux":"redux"}],20:[function(require,module,exports){
"use strict";
Object.defineProperty(exports, "__esModule", {
@@ -5520,12 +5513,11 @@ Object.defineProperty(exports, "__esModule", {
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
exports.default = reducer;
-exports.setDefaultMenu = setDefaultMenu;
-exports.setFlowMenu = setFlowMenu;
exports.setActiveMenu = setActiveMenu;
+
+var _flows = require('./flows');
+
var ACTIVE_MENU = 'ACTIVE_MENU';
-var DEFAULT_MENU = 'DEFAULT_MENU';
-var FLOW_MENU = 'FLOW_MENU';
var defaultState = {
active_menu: 'Start'
@@ -5539,31 +5531,15 @@ function reducer() {
return _extends({}, state, {
active_menu: action.active_menu
});
- case DEFAULT_MENU:
+ case _flows.SELECT_FLOW:
return _extends({}, state, {
- active_menu: defaultState.active_menu
+ active_menu: action.flowId ? 'Flow' : 'Start'
});
- case FLOW_MENU:
- return _extends({}, state, {
- active_menu: "Flow"
- });
-
default:
return state;
}
}
-function setDefaultMenu(active_menu) {
- return {
- type: DEFAULT_MENU
- };
-}
-function setFlowMenu() {
- return {
- type: FLOW_MENU
- };
-}
-
function setActiveMenu(active_menu) {
return {
type: ACTIVE_MENU,
@@ -5571,7 +5547,7 @@ function setActiveMenu(active_menu) {
};
}
-},{}],39:[function(require,module,exports){
+},{"./flows":34}],39:[function(require,module,exports){
'use strict';
Object.defineProperty(exports, "__esModule", {
diff --git a/web/src/js/components/Header.js b/web/src/js/components/Header.js
index 07ae3a9f..f0cd3dcd 100644
--- a/web/src/js/components/Header.js
+++ b/web/src/js/components/Header.js
@@ -27,28 +27,29 @@ class Header extends Component {
render() {
const { settings, updateLocation, query, selectedFlow, active_menu} = this.props
- const Active = _.find(Header.entries, (e) => e.title == active_menu);
- const entries = selectedFlow ? Header.entries : Header.entries.filter((h) => h != FlowMenu)
return (
<header>
<nav className="nav-tabs nav-tabs-lg">
<FileMenu/>
- {entries.map(Entry => (
+ {Header.entries.map(Entry => (
<a key={Entry.title}
href="#"
- className={classnames({ active: Entry === Active })}
+ className={classnames({ active: Entry.title === active_menu, hidden: !selectedFlow && Entry === FlowMenu })}
onClick={e => this.handleClick(Entry, e)}>
{Entry.title}
</a>
))}
</nav>
<div className="menu">
- <Active
- ref="active"
- settings={settings}
- updateLocation={updateLocation}
- query={query}
- />
+ {Header.entries.map(Entry => (
+ <div className={classnames({ hidden: Entry.title !== active_menu })}>
+ <Entry
+ settings={settings}
+ updateLocation={updateLocation}
+ query={query}
+ />
+ </div>
+ ))}
</div>
</header>
)
diff --git a/web/src/js/components/MainView.jsx b/web/src/js/components/MainView.jsx
index 24013ca8..eb15af8a 100644
--- a/web/src/js/components/MainView.jsx
+++ b/web/src/js/components/MainView.jsx
@@ -1,7 +1,6 @@
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
-
import { FlowActions } from '../actions.js'
import { Query } from '../actions.js'
import { Key } from '../utils.js'
@@ -9,7 +8,6 @@ import { Splitter } from './common.js'
import FlowTable from './FlowTable'
import FlowView from './flowview/index.js'
import { selectFlow, setFilter, setHighlight } from '../ducks/flows'
-import { setDefaultMenu, setFlowMenu } from '../ducks/view'
class MainView extends Component {
@@ -40,10 +38,8 @@ class MainView extends Component {
*/
selectFlow(flow) {
if (flow) {
- this.props.setFlowMenu()
this.props.updateLocation(`/flows/${flow.id}/${this.props.routeParams.detailTab || 'request'}`)
} else {
- this.props.setDefaultMenu()
this.props.updateLocation('/flows')
}
}
@@ -195,8 +191,6 @@ export default connect(
}),
dispatch => bindActionCreators({
selectFlow,
- setDefaultMenu,
- setFlowMenu,
setFilter,
setHighlight,
}, dispatch),
diff --git a/web/src/js/ducks/view.js b/web/src/js/ducks/view.js
index 8a4c25a1..2b6fe67d 100644
--- a/web/src/js/ducks/view.js
+++ b/web/src/js/ducks/view.js
@@ -1,46 +1,27 @@
+import { SELECT_FLOW } from './flows'
const ACTIVE_MENU = 'ACTIVE_MENU'
-const DEFAULT_MENU = 'DEFAULT_MENU'
-const FLOW_MENU = 'FLOW_MENU'
const defaultState = {
- active_menu: 'Start',
+ active_menu: 'Start'
}
export default function reducer(state = defaultState, action) {
switch (action.type) {
case ACTIVE_MENU:
return {
- ...state,
+ ...state,
active_menu: action.active_menu
}
- case DEFAULT_MENU:
- return {
+ case SELECT_FLOW:
+ return{
...state,
- active_menu: defaultState.active_menu
- }
- case FLOW_MENU:
- return {
- ... state,
- active_menu: "Flow"
+ active_menu: action.flowId ? 'Flow' : 'Start'
}
-
-
default:
return state
}
}
-export function setDefaultMenu(active_menu) {
- return {
- type: DEFAULT_MENU,
- }
-}
-export function setFlowMenu() {
- return {
- type: FLOW_MENU,
- }
-}
-
export function setActiveMenu(active_menu) {
return {
type: ACTIVE_MENU,