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/EventLog.jsx10
-rw-r--r--web/src/js/components/FlowTable/FlowColumns.jsx8
-rw-r--r--web/src/js/components/FlowTable/FlowTableHead.jsx10
-rw-r--r--web/src/js/components/Header.jsx7
-rw-r--r--web/src/js/components/Header/FileMenu.jsx8
-rw-r--r--web/src/js/components/Header/FlowMenu.jsx2
-rw-r--r--web/src/js/components/Header/ViewMenu.jsx4
-rw-r--r--web/src/js/components/MainView.jsx21
8 files changed, 31 insertions, 39 deletions
diff --git a/web/src/js/components/EventLog.jsx b/web/src/js/components/EventLog.jsx
index 169162ee..e426672a 100644
--- a/web/src/js/components/EventLog.jsx
+++ b/web/src/js/components/EventLog.jsx
@@ -1,6 +1,6 @@
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
-import { toggleEventLogFilter, toggleEventLogVisibility } from '../ducks/eventLog'
+import { toggleFilter, toggleVisibility } from '../ducks/eventLog'
import ToggleButton from './common/ToggleButton'
import EventList from './EventLog/EventList'
@@ -69,11 +69,11 @@ class EventLog extends Component {
export default connect(
state => ({
- filters: state.eventLog.filter,
- events: state.eventLog.filteredEvents,
+ filters: state.eventLog.filters,
+ events: state.eventLog.view.data,
}),
{
- onClose: toggleEventLogVisibility,
- onToggleFilter: toggleEventLogFilter,
+ onClose: toggleVisibility,
+ onToggleFilter: toggleFilter,
}
)(EventLog)
diff --git a/web/src/js/components/FlowTable/FlowColumns.jsx b/web/src/js/components/FlowTable/FlowColumns.jsx
index 11c0796c..0ff80453 100644
--- a/web/src/js/components/FlowTable/FlowColumns.jsx
+++ b/web/src/js/components/FlowTable/FlowColumns.jsx
@@ -9,7 +9,6 @@ export function TLSColumn({ flow }) {
)
}
-TLSColumn.sortKeyFun = flow => flow.request.scheme
TLSColumn.headerClass = 'col-tls'
TLSColumn.headerName = ''
@@ -68,7 +67,6 @@ export function PathColumn({ flow }) {
)
}
-PathColumn.sortKeyFun = flow => RequestUtils.pretty_url(flow.request)
PathColumn.headerClass = 'col-path'
PathColumn.headerName = 'Path'
@@ -78,7 +76,6 @@ export function MethodColumn({ flow }) {
)
}
-MethodColumn.sortKeyFun = flow => flow.request.method
MethodColumn.headerClass = 'col-method'
MethodColumn.headerName = 'Method'
@@ -88,7 +85,6 @@ export function StatusColumn({ flow }) {
)
}
-StatusColumn.sortKeyFun = flow => flow.response && flow.response.status_code
StatusColumn.headerClass = 'col-status'
StatusColumn.headerName = 'Status'
@@ -98,7 +94,7 @@ export function SizeColumn({ flow }) {
)
}
-SizeColumn.sortKeyFun = flow => {
+SizeColumn.getTotalSize = flow => {
let total = flow.request.contentLength
if (flow.response) {
total += flow.response.contentLength || 0
@@ -106,7 +102,6 @@ SizeColumn.sortKeyFun = flow => {
return total
}
-SizeColumn.getTotalSize = SizeColumn.sortKeyFun
SizeColumn.headerClass = 'col-size'
SizeColumn.headerName = 'Size'
@@ -122,7 +117,6 @@ export function TimeColumn({ flow }) {
)
}
-TimeColumn.sortKeyFun = flow => flow.response && flow.response.timestamp_end - flow.request.timestamp_start
TimeColumn.headerClass = 'col-time'
TimeColumn.headerName = 'Time'
diff --git a/web/src/js/components/FlowTable/FlowTableHead.jsx b/web/src/js/components/FlowTable/FlowTableHead.jsx
index 840f6a34..6deee808 100644
--- a/web/src/js/components/FlowTable/FlowTableHead.jsx
+++ b/web/src/js/components/FlowTable/FlowTableHead.jsx
@@ -3,7 +3,7 @@ import { connect } from 'react-redux'
import classnames from 'classnames'
import columns from './FlowColumns'
-import { setSort } from "../../ducks/flows"
+import { updateSorter } from '../../ducks/views/main'
FlowTableHead.propTypes = {
onSort: PropTypes.func.isRequired,
@@ -19,7 +19,7 @@ function FlowTableHead({ sortColumn, sortDesc, onSort }) {
{columns.map(Column => (
<th className={classnames(Column.headerClass, sortColumn === Column.name && sortType)}
key={Column.name}
- onClick={() => onSort({ sortColumn: Column.name, sortDesc: Column.name !== sortColumn ? false : !sortDesc })}>
+ onClick={() => onSort(Column.name, Column.name !== sortColumn ? false : !sortDesc)}>
{Column.headerName}
</th>
))}
@@ -29,10 +29,10 @@ function FlowTableHead({ sortColumn, sortDesc, onSort }) {
export default connect(
state => ({
- sortDesc: state.flows.sort.sortDesc,
- sortColumn: state.flows.sort.sortColumn,
+ sortDesc: state.flows.views.main.sorter.desc,
+ sortColumn: state.flows.views.main.sorter.column,
}),
{
- onSort: setSort,
+ onSort: updateSorter,
}
)(FlowTableHead)
diff --git a/web/src/js/components/Header.jsx b/web/src/js/components/Header.jsx
index ab25eb41..545684bb 100644
--- a/web/src/js/components/Header.jsx
+++ b/web/src/js/components/Header.jsx
@@ -1,7 +1,6 @@
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import classnames from 'classnames'
-import { toggleEventLogVisibility } from '../ducks/eventLog'
import MainMenu from './Header/MainMenu'
import ViewMenu from './Header/ViewMenu'
import OptionMenu from './Header/OptionMenu'
@@ -52,9 +51,9 @@ class Header extends Component {
}
}
export default connect(
- (state) => ({
- selectedFlow: state.flows.selected[0],
- activeMenu: state.ui.activeMenu
+ state => ({
+ selectedFlow: state.flows.views.main.selected[0],
+ activeMenu: state.ui.activeMenu,
}),
{
setActiveMenu,
diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx
index b075b3c8..e1c62e28 100644
--- a/web/src/js/components/Header/FileMenu.jsx
+++ b/web/src/js/components/Header/FileMenu.jsx
@@ -1,6 +1,6 @@
import React, { Component } from 'react'
import classnames from 'classnames'
-import { FlowActions } from '../../actions.js'
+import * as flowActions from '../../ducks/flows'
export default class FileMenu extends Component {
@@ -35,7 +35,7 @@ export default class FileMenu extends Component {
onNewClick(e) {
e.preventDefault()
if (confirm('Delete all flows?')) {
- FlowActions.clear()
+ flowActions.clear()
}
}
@@ -47,14 +47,14 @@ export default class FileMenu extends Component {
onOpenFile(e) {
e.preventDefault()
if (e.target.files.length > 0) {
- FlowActions.upload(e.target.files[0])
+ flowActions.upload(e.target.files[0])
this.fileInput.value = ''
}
}
onSaveClick(e) {
e.preventDefault()
- FlowActions.download()
+ flowActions.download()
}
render() {
diff --git a/web/src/js/components/Header/FlowMenu.jsx b/web/src/js/components/Header/FlowMenu.jsx
index abecf0dc..689cea5c 100644
--- a/web/src/js/components/Header/FlowMenu.jsx
+++ b/web/src/js/components/Header/FlowMenu.jsx
@@ -29,6 +29,6 @@ function FlowMenu({ flow }) {
export default connect(
state => ({
- flow: state.flows.all.byId[state.flows.selected[0]]
+ flow: state.flows.list.data[state.flows.views.main.selected[0]],
})
)(FlowMenu)
diff --git a/web/src/js/components/Header/ViewMenu.jsx b/web/src/js/components/Header/ViewMenu.jsx
index 8d662c28..894fa71a 100644
--- a/web/src/js/components/Header/ViewMenu.jsx
+++ b/web/src/js/components/Header/ViewMenu.jsx
@@ -1,7 +1,7 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import ToggleButton from '../common/ToggleButton'
-import { toggleEventLogVisibility } from '../../ducks/eventLog'
+import { toggleVisibility } from '../../ducks/eventLog'
ViewMenu.title = 'View'
ViewMenu.route = 'flows'
@@ -27,6 +27,6 @@ export default connect(
visible: state.eventLog.visible,
}),
{
- onToggle: toggleEventLogVisibility,
+ onToggle: toggleVisibility,
}
)(ViewMenu)
diff --git a/web/src/js/components/MainView.jsx b/web/src/js/components/MainView.jsx
index 7064d3bf..b3fe73ec 100644
--- a/web/src/js/components/MainView.jsx
+++ b/web/src/js/components/MainView.jsx
@@ -6,7 +6,7 @@ import { Key } from '../utils.js'
import Splitter from './common/Splitter'
import FlowTable from './FlowTable'
import FlowView from './FlowView'
-import { selectFlow, setFilter, setHighlight } from '../ducks/flows'
+import { selectFlow, updateFilter, updateHighlight } from '../ducks/views/main'
class MainView extends Component {
@@ -25,10 +25,10 @@ class MainView extends Component {
this.props.selectFlow(nextProps.routeParams.flowId)
}
if (nextProps.location.query[Query.SEARCH] !== nextProps.filter) {
- this.props.setFilter(nextProps.location.query[Query.SEARCH], false)
+ this.props.updateFilter(nextProps.location.query[Query.SEARCH], false)
}
if (nextProps.location.query[Query.HIGHLIGHT] !== nextProps.highlight) {
- this.props.setHighlight(nextProps.location.query[Query.HIGHLIGHT], false)
+ this.props.updateHighlight(nextProps.location.query[Query.HIGHLIGHT], false)
}
}
@@ -154,7 +154,7 @@ class MainView extends Component {
}
render() {
- const { flows, selectedFlow, highlight, sort } = this.props
+ const { flows, selectedFlow, highlight } = this.props
return (
<div className="main-view">
<FlowTable
@@ -182,16 +182,15 @@ class MainView extends Component {
export default connect(
state => ({
- flows: state.flows.view,
- filter: state.flows.filter,
- sort: state.flows.sort,
- highlight: state.flows.highlight,
- selectedFlow: state.flows.all.byId[state.flows.selected[0]]
+ flows: state.flows.views.main.view.data,
+ filter: state.flows.views.main.filter,
+ highlight: state.flows.views.main.highlight,
+ selectedFlow: state.flows.list.data[state.flows.views.main.selected[0]]
}),
{
selectFlow,
- setFilter,
- setHighlight,
+ updateFilter,
+ updateHighlight,
},
undefined,
{ withRef: true }