aboutsummaryrefslogtreecommitdiffstats
path: root/web/src/js/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/src/js/components')
-rw-r--r--web/src/js/components/ContentView/ShowFullContentButton.jsx4
-rw-r--r--web/src/js/components/FlowTable/FlowColumns.jsx12
-rw-r--r--web/src/js/components/Header.jsx4
-rw-r--r--web/src/js/components/Header/FileMenu.jsx8
-rw-r--r--web/src/js/components/Header/FlowMenu.jsx27
-rw-r--r--web/src/js/components/Header/MenuToggle.jsx2
-rw-r--r--web/src/js/components/common/Button.jsx2
7 files changed, 39 insertions, 20 deletions
diff --git a/web/src/js/components/ContentView/ShowFullContentButton.jsx b/web/src/js/components/ContentView/ShowFullContentButton.jsx
index cfd96dd8..fd68991e 100644
--- a/web/src/js/components/ContentView/ShowFullContentButton.jsx
+++ b/web/src/js/components/ContentView/ShowFullContentButton.jsx
@@ -16,7 +16,9 @@ function ShowFullContentButton ( {setShowFullContent, showFullContent, visibleLi
return (
!showFullContent &&
<div>
- <Button className="view-all-content-btn btn-xs" onClick={() => setShowFullContent()} text="Show full content"/>
+ <Button className="view-all-content-btn btn-xs" onClick={() => setShowFullContent()}>
+ Show full content
+ </Button>
<span className="pull-right"> {visibleLines}/{contentLines} are visible &nbsp; </span>
</div>
)
diff --git a/web/src/js/components/FlowTable/FlowColumns.jsx b/web/src/js/components/FlowTable/FlowColumns.jsx
index 0ff80453..02a4fba1 100644
--- a/web/src/js/components/FlowTable/FlowColumns.jsx
+++ b/web/src/js/components/FlowTable/FlowColumns.jsx
@@ -54,6 +54,15 @@ IconColumn.getIcon = flow => {
}
export function PathColumn({ flow }) {
+
+ let err;
+ if(flow.error){
+ if (flow.error.msg === "Connection killed"){
+ err = <i className="fa fa-fw fa-times pull-right"></i>
+ } else {
+ err = <i className="fa fa-fw fa-exclamation pull-right"></i>
+ }
+ }
return (
<td className="col-path">
{flow.request.is_replay && (
@@ -62,6 +71,7 @@ export function PathColumn({ flow }) {
{flow.intercepted && (
<i className="fa fa-fw fa-pause pull-right"></i>
)}
+ {err}
{RequestUtils.pretty_url(flow.request)}
</td>
)
@@ -109,7 +119,7 @@ export function TimeColumn({ flow }) {
return (
<td className="col-time">
{flow.response ? (
- formatTimeDelta(1000 * (flow.response.timestamp_end - flow.request.timestamp_start))
+ formatTimeDelta(1000 * (flow.response.timestamp_end - flow.server_conn.timestamp_start))
) : (
'...'
)}
diff --git a/web/src/js/components/Header.jsx b/web/src/js/components/Header.jsx
index 1500db1b..c15c951f 100644
--- a/web/src/js/components/Header.jsx
+++ b/web/src/js/components/Header.jsx
@@ -22,7 +22,9 @@ class Header extends Component {
if(selectedFlowId)
entries.push(FlowMenu)
- const Active = _.find(entries, (e) => e.title == activeMenu)
+ // Make sure to have a fallback in case FlowMenu is selected but we don't have any flows
+ // (e.g. because they are all deleted or not yet received)
+ const Active = _.find(entries, (e) => e.title == activeMenu) || MainMenu
return (
<header>
diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx
index 53c63ea1..ec32c857 100644
--- a/web/src/js/components/Header/FileMenu.jsx
+++ b/web/src/js/components/Header/FileMenu.jsx
@@ -21,23 +21,23 @@ function FileMenu ({clearFlows, loadFlows, saveFlows}) {
<Dropdown className="pull-left" btnClass="special" text="mitmproxy">
<a href="#" onClick={e => FileMenu.onNewClick(e, clearFlows)}>
<i className="fa fa-fw fa-file"></i>
- New
+ &nbsp;New
</a>
<FileChooser
icon="fa-folder-open"
- text="Open..."
+ text="&nbsp;Open..."
onOpenFile={file => loadFlows(file)}
/>
<a href="#" onClick={e =>{ e.preventDefault(); saveFlows();}}>
<i className="fa fa-fw fa-floppy-o"></i>
- Save...
+ &nbsp;Save...
</a>
<Divider/>
<a href="http://mitm.it/" target="_blank">
<i className="fa fa-fw fa-external-link"></i>
- Install Certificates...
+ &nbsp;Install Certificates...
</a>
</Dropdown>
)
diff --git a/web/src/js/components/Header/FlowMenu.jsx b/web/src/js/components/Header/FlowMenu.jsx
index 420cb054..a404fdb7 100644
--- a/web/src/js/components/Header/FlowMenu.jsx
+++ b/web/src/js/components/Header/FlowMenu.jsx
@@ -8,21 +8,23 @@ FlowMenu.title = 'Flow'
FlowMenu.propTypes = {
flow: PropTypes.object,
- acceptFlow: PropTypes.func.isRequired,
+ resumeFlow: PropTypes.func.isRequired,
+ killFlow: PropTypes.func.isRequired,
replayFlow: PropTypes.func.isRequired,
duplicateFlow: PropTypes.func.isRequired,
removeFlow: PropTypes.func.isRequired,
revertFlow: PropTypes.func.isRequired
}
-function FlowMenu({ flow, acceptFlow, replayFlow, duplicateFlow, removeFlow, revertFlow }) {
+function FlowMenu({ flow, resumeFlow, killFlow, replayFlow, duplicateFlow, removeFlow, revertFlow }) {
if (!flow)
return <div/>
return (
<div>
<div className="menu-group">
<div className="menu-content">
- <Button title="[r]eplay flow" icon="fa-repeat text-primary" onClick={() => replayFlow(flow)}>
+ <Button title="[r]eplay flow" icon="fa-repeat text-primary"
+ onClick={() => replayFlow(flow)}>
Replay
</Button>
<Button title="[D]uplicate flow" icon="fa-copy text-info"
@@ -33,7 +35,8 @@ function FlowMenu({ flow, acceptFlow, replayFlow, duplicateFlow, removeFlow, rev
icon="fa-history text-warning" onClick={() => revertFlow(flow)}>
Revert
</Button>
- <Button title="[d]elete flow" icon="fa-trash text-danger" onClick={() => removeFlow(flow)}>
+ <Button title="[d]elete flow" icon="fa-trash text-danger"
+ onClick={() => removeFlow(flow)}>
Delete
</Button>
</div>
@@ -51,17 +54,18 @@ function FlowMenu({ flow, acceptFlow, replayFlow, duplicateFlow, removeFlow, rev
<div className="menu-group">
<div className="menu-content">
<Button disabled={!flow || !flow.intercepted} title="[a]ccept intercepted flow"
- icon="fa-play text-success" onClick={() => acceptFlow(flow)}
- >
- Resume
- </Button>
-
+ icon="fa-play text-success" onClick={() => resumeFlow(flow)}>
+ Resume
+ </Button>
+ <Button disabled={!flow || !flow.intercepted} title="kill intercepted flow [x]"
+ icon="fa-times text-danger" onClick={() => killFlow(flow)}>
+ Abort
+ </Button>
</div>
<div className="menu-legend">Interception</div>
</div>
-
</div>
)
}
@@ -71,7 +75,8 @@ export default connect(
flow: state.flows.byId[state.flows.selected[0]],
}),
{
- acceptFlow: flowsActions.accept,
+ resumeFlow: flowsActions.resume,
+ killFlow: flowsActions.kill,
replayFlow: flowsActions.replay,
duplicateFlow: flowsActions.duplicate,
removeFlow: flowsActions.remove,
diff --git a/web/src/js/components/Header/MenuToggle.jsx b/web/src/js/components/Header/MenuToggle.jsx
index 8977f3b9..91f093c6 100644
--- a/web/src/js/components/Header/MenuToggle.jsx
+++ b/web/src/js/components/Header/MenuToggle.jsx
@@ -14,7 +14,7 @@ export function MenuToggle({ value, onChange, children }) {
<div className="menu-entry">
<label>
<input type="checkbox"
- value={value}
+ checked={value}
onChange={onChange}/>
{children}
</label>
diff --git a/web/src/js/components/common/Button.jsx b/web/src/js/components/common/Button.jsx
index 69471f25..f05a68d0 100644
--- a/web/src/js/components/common/Button.jsx
+++ b/web/src/js/components/common/Button.jsx
@@ -11,7 +11,7 @@ Button.propTypes = {
export default function Button({ onClick, children, icon, disabled, className, title }) {
return (
<div className={classnames(className, 'btn btn-default')}
- onClick={onClick}
+ onClick={!disabled && onClick}
disabled={disabled}
title={title}>
{icon && (<i className={"fa fa-fw " + icon}/> )}