зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1409064 - Network Monitor to ES6 classes r=Honza
MozReview-Commit-ID: FBuucEQ8Zhs --HG-- extra : rebase_source : 858b118df3ce44c8da5794c405d9b8f029f6c7e8
This commit is contained in:
Родитель
e26530837a
Коммит
5c75212853
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -49,21 +49,28 @@ const SUMMARY_VERSION = L10N.getStr("netmonitor.summary.version");
|
|||
* Headers panel component
|
||||
* Lists basic information about the request
|
||||
*/
|
||||
const HeadersPanel = createClass({
|
||||
displayName: "HeadersPanel",
|
||||
|
||||
propTypes: {
|
||||
cloneSelectedRequest: PropTypes.func.isRequired,
|
||||
request: PropTypes.object.isRequired,
|
||||
renderValue: PropTypes.func,
|
||||
openLink: PropTypes.func,
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
class HeadersPanel extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
cloneSelectedRequest: PropTypes.func.isRequired,
|
||||
request: PropTypes.object.isRequired,
|
||||
renderValue: PropTypes.func,
|
||||
openLink: PropTypes.func,
|
||||
};
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
rawHeadersOpened: false,
|
||||
};
|
||||
},
|
||||
|
||||
this.getProperties = this.getProperties.bind(this);
|
||||
this.toggleRawHeaders = this.toggleRawHeaders.bind(this);
|
||||
this.renderSummary = this.renderSummary.bind(this);
|
||||
this.renderValue = this.renderValue.bind(this);
|
||||
}
|
||||
|
||||
getProperties(headers, title) {
|
||||
if (headers && headers.headers.length) {
|
||||
|
@ -80,13 +87,13 @@ const HeadersPanel = createClass({
|
|||
}
|
||||
|
||||
return null;
|
||||
},
|
||||
}
|
||||
|
||||
toggleRawHeaders() {
|
||||
this.setState({
|
||||
rawHeadersOpened: !this.state.rawHeadersOpened,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
renderSummary(label, value) {
|
||||
return (
|
||||
|
@ -101,7 +108,7 @@ const HeadersPanel = createClass({
|
|||
}),
|
||||
)
|
||||
);
|
||||
},
|
||||
}
|
||||
|
||||
renderValue(props) {
|
||||
const member = props.member;
|
||||
|
@ -127,7 +134,7 @@ const HeadersPanel = createClass({
|
|||
}) : null
|
||||
)
|
||||
);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
|
@ -273,6 +280,6 @@ const HeadersPanel = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = HeadersPanel;
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
const Services = require("Services");
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -29,33 +29,37 @@ const MediaQueryList = window.matchMedia("(min-width: 700px)");
|
|||
* Monitor panel component
|
||||
* The main panel for displaying various network request information
|
||||
*/
|
||||
const MonitorPanel = createClass({
|
||||
displayName: "MonitorPanel",
|
||||
|
||||
propTypes: {
|
||||
connector: PropTypes.object.isRequired,
|
||||
isEmpty: PropTypes.bool.isRequired,
|
||||
networkDetailsOpen: PropTypes.bool.isRequired,
|
||||
openNetworkDetails: PropTypes.func.isRequired,
|
||||
request: PropTypes.object,
|
||||
sourceMapService: PropTypes.object,
|
||||
openLink: PropTypes.func,
|
||||
updateRequest: PropTypes.func.isRequired,
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
class MonitorPanel extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
connector: PropTypes.object.isRequired,
|
||||
isEmpty: PropTypes.bool.isRequired,
|
||||
networkDetailsOpen: PropTypes.bool.isRequired,
|
||||
openNetworkDetails: PropTypes.func.isRequired,
|
||||
request: PropTypes.object,
|
||||
sourceMapService: PropTypes.object,
|
||||
openLink: PropTypes.func,
|
||||
updateRequest: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
isVerticalSpliter: MediaQueryList.matches,
|
||||
};
|
||||
},
|
||||
|
||||
this.onLayoutChange = this.onLayoutChange.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
MediaQueryList.addListener(this.onLayoutChange);
|
||||
},
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
updateFormDataSections(nextProps);
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
MediaQueryList.removeListener(this.onLayoutChange);
|
||||
|
@ -70,13 +74,13 @@ const MonitorPanel = createClass({
|
|||
Services.prefs.setIntPref(
|
||||
"devtools.netmonitor.panes-network-details-height", clientHeight);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
onLayoutChange() {
|
||||
this.setState({
|
||||
isVerticalSpliter: MediaQueryList.matches,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -116,7 +120,7 @@ const MonitorPanel = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = connect(
|
||||
(state) => ({
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -39,23 +39,23 @@ const SECTION_NAMES = [
|
|||
* Params panel component
|
||||
* Displays the GET parameters and POST data of a request
|
||||
*/
|
||||
const ParamsPanel = createClass({
|
||||
displayName: "ParamsPanel",
|
||||
|
||||
propTypes: {
|
||||
connector: PropTypes.object.isRequired,
|
||||
openLink: PropTypes.func,
|
||||
request: PropTypes.object.isRequired,
|
||||
updateRequest: PropTypes.func.isRequired,
|
||||
},
|
||||
class ParamsPanel extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
connector: PropTypes.object.isRequired,
|
||||
openLink: PropTypes.func,
|
||||
request: PropTypes.object.isRequired,
|
||||
updateRequest: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
updateFormDataSections(this.props);
|
||||
},
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
updateFormDataSections(nextProps);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -124,7 +124,7 @@ const ParamsPanel = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Mapping array to dict for TreeView usage.
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -40,20 +40,20 @@ const EDITOR_CONFIG_ID = "EDITOR_CONFIG";
|
|||
* Source editor - Enable by specifying object level 1 property name to EDITOR_CONFIG_ID.
|
||||
* Rep - Default enabled.
|
||||
*/
|
||||
const PropertiesView = createClass({
|
||||
displayName: "PropertiesView",
|
||||
class PropertiesView extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
object: PropTypes.object,
|
||||
enableInput: PropTypes.bool,
|
||||
expandableStrings: PropTypes.bool,
|
||||
filterPlaceHolder: PropTypes.string,
|
||||
sectionNames: PropTypes.array,
|
||||
openLink: PropTypes.func,
|
||||
cropLimit: PropTypes.number
|
||||
};
|
||||
}
|
||||
|
||||
propTypes: {
|
||||
object: PropTypes.object,
|
||||
enableInput: PropTypes.bool,
|
||||
expandableStrings: PropTypes.bool,
|
||||
filterPlaceHolder: PropTypes.string,
|
||||
sectionNames: PropTypes.array,
|
||||
openLink: PropTypes.func,
|
||||
cropLimit: PropTypes.number
|
||||
},
|
||||
|
||||
getDefaultProps() {
|
||||
static get defaultProps() {
|
||||
return {
|
||||
enableInput: true,
|
||||
enableFilter: true,
|
||||
|
@ -62,17 +62,26 @@ const PropertiesView = createClass({
|
|||
sectionNames: [],
|
||||
cropLimit: 1024
|
||||
};
|
||||
},
|
||||
}
|
||||
|
||||
getInitialState() {
|
||||
return {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
filterText: "",
|
||||
};
|
||||
},
|
||||
|
||||
this.getRowClass = this.getRowClass.bind(this);
|
||||
this.onFilter = this.onFilter.bind(this);
|
||||
this.renderRowWithEditor = this.renderRowWithEditor.bind(this);
|
||||
this.renderValueWithRep = this.renderValueWithRep.bind(this);
|
||||
this.shouldRenderSearchBox = this.shouldRenderSearchBox.bind(this);
|
||||
this.updateFilterText = this.updateFilterText.bind(this);
|
||||
}
|
||||
|
||||
getRowClass(object, sectionNames) {
|
||||
return sectionNames.includes(object.name) ? "tree-section" : "";
|
||||
},
|
||||
}
|
||||
|
||||
onFilter(object, whiteList) {
|
||||
let { name, value } = object;
|
||||
|
@ -84,7 +93,7 @@ const PropertiesView = createClass({
|
|||
|
||||
let jsonString = JSON.stringify({ [name]: value }).toLowerCase();
|
||||
return jsonString.includes(filterText.toLowerCase());
|
||||
},
|
||||
}
|
||||
|
||||
renderRowWithEditor(props) {
|
||||
const { level, name, value, path } = props.member;
|
||||
|
@ -106,7 +115,7 @@ const PropertiesView = createClass({
|
|||
}
|
||||
|
||||
return TreeRow(props);
|
||||
},
|
||||
}
|
||||
|
||||
renderValueWithRep(props) {
|
||||
const { member } = props;
|
||||
|
@ -128,18 +137,18 @@ const PropertiesView = createClass({
|
|||
mode: MODE.TINY,
|
||||
cropLimit: this.props.cropLimit,
|
||||
}));
|
||||
},
|
||||
}
|
||||
|
||||
shouldRenderSearchBox(object) {
|
||||
return this.props.enableFilter && object && Object.keys(object)
|
||||
.filter((section) => !object[section][EDITOR_CONFIG_ID]).length > 0;
|
||||
},
|
||||
}
|
||||
|
||||
updateFilterText(filterText) {
|
||||
this.setState({
|
||||
filterText,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
|
@ -191,6 +200,6 @@ const PropertiesView = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = PropertiesView;
|
||||
|
|
|
@ -5,24 +5,24 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnCause = createClass({
|
||||
displayName: "RequestListColumnCause",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
},
|
||||
class RequestListColumnCause extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.cause !== nextProps.item.cause;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -49,6 +49,6 @@ const RequestListColumnCause = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnCause;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,16 +13,16 @@ const { getFormattedSize } = require("../utils/format-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnContentSize = createClass({
|
||||
displayName: "RequestListColumnContentSize",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnContentSize extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.contentSize !== nextProps.item.contentSize;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { contentSize } = this.props.item;
|
||||
|
@ -31,6 +31,6 @@ const RequestListColumnContentSize = createClass({
|
|||
div({ className: "requests-list-column requests-list-size", title: size }, size)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnContentSize;
|
||||
|
|
|
@ -5,19 +5,19 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnCookies = createClass({
|
||||
displayName: "RequestListColumnCookies",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnCookies extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
let { requestCookies: currRequestCookies = { cookies: [] } } = this.props.item;
|
||||
|
@ -25,7 +25,7 @@ const RequestListColumnCookies = createClass({
|
|||
currRequestCookies = currRequestCookies.cookies || currRequestCookies;
|
||||
nextRequestCookies = nextRequestCookies.cookies || nextRequestCookies;
|
||||
return currRequestCookies !== nextRequestCookies;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { requestCookies = { cookies: [] } } = this.props.item;
|
||||
|
@ -38,6 +38,6 @@ const RequestListColumnCookies = createClass({
|
|||
}, requestCookiesLength)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnCookies;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -21,17 +21,17 @@ const UPDATED_DOMAIN_PROPS = [
|
|||
"urlDetails",
|
||||
];
|
||||
|
||||
const RequestListColumnDomain = createClass({
|
||||
displayName: "RequestListColumnDomain",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
},
|
||||
class RequestListColumnDomain extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_DOMAIN_PROPS, this.props.item, nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { item, onSecurityIconMouseDown } = this.props;
|
||||
|
@ -61,6 +61,6 @@ const RequestListColumnDomain = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnDomain;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,16 +13,16 @@ const { getFormattedTime } = require("../utils/format-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnDuration = createClass({
|
||||
displayName: "RequestListColumnDuration",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnDuration extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.totalTime !== nextProps.item.totalTime;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { totalTime } = this.props.item;
|
||||
|
@ -36,6 +36,6 @@ const RequestListColumnDuration = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnDuration;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -14,17 +14,17 @@ const { getEndTime } = require("../utils/request-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnEndTime = createClass({
|
||||
displayName: "RequestListColumnEndTime",
|
||||
|
||||
propTypes: {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnEndTime extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return getEndTime(this.props.item) !== getEndTime(nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { firstRequestStartedMillis, item } = this.props;
|
||||
|
@ -39,6 +39,6 @@ const RequestListColumnEndTime = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnEndTime;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -18,17 +18,17 @@ const UPDATED_FILE_PROPS = [
|
|||
"urlDetails",
|
||||
];
|
||||
|
||||
const RequestListColumnFile = createClass({
|
||||
displayName: "RequestListColumnFile",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
},
|
||||
class RequestListColumnFile extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_FILE_PROPS, this.props.item, nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -50,6 +50,6 @@ const RequestListColumnFile = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnFile;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,18 +13,18 @@ const { getFormattedTime } = require("../utils/format-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnLatency = createClass({
|
||||
displayName: "RequestListColumnLatency",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnLatency extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
let { eventTimings: currEventTimings = { timings: {} } } = this.props.item;
|
||||
let { eventTimings: nextEventTimings = { timings: {} } } = nextProps.item;
|
||||
return currEventTimings.timings.wait !== nextEventTimings.timings.wait;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { eventTimings = { timings: {} } } = this.props.item;
|
||||
|
@ -39,6 +39,6 @@ const RequestListColumnLatency = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnLatency;
|
||||
|
|
|
@ -5,28 +5,28 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnMethod = createClass({
|
||||
displayName: "RequestListColumnMethod",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnMethod extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.method !== nextProps.item.method;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { method } = this.props.item;
|
||||
return div({ className: "requests-list-column requests-list-method" }, method);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnMethod;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,17 +13,17 @@ const { getFormattedProtocol } = require("../utils/request-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnProtocol = createClass({
|
||||
displayName: "RequestListColumnProtocol",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnProtocol extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return getFormattedProtocol(this.props.item) !==
|
||||
getFormattedProtocol(nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let protocol = getFormattedProtocol(this.props.item);
|
||||
|
@ -37,6 +37,6 @@ const RequestListColumnProtocol = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnProtocol;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,16 +13,16 @@ const { getFormattedIPAndPort } = require("../utils/format-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnRemoteIP = createClass({
|
||||
displayName: "RequestListColumnRemoteIP",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnRemoteIP extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.remoteAddress !== nextProps.item.remoteAddress;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { remoteAddress, remotePort } = this.props.item;
|
||||
|
@ -35,6 +35,6 @@ const RequestListColumnRemoteIP = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnRemoteIP;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -17,19 +17,19 @@ const { div } = DOM;
|
|||
* Renders a response header column in the requests list. The actual
|
||||
* header to show is passed as a prop.
|
||||
*/
|
||||
const RequestListColumnResponseHeader = createClass({
|
||||
displayName: "RequestListColumnResponseHeader",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
header: PropTypes.string.isRequired,
|
||||
},
|
||||
class RequestListColumnResponseHeader extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
header: PropTypes.string.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
const currHeader = getResponseHeader(this.props.item, this.props.header);
|
||||
const nextHeader = getResponseHeader(nextProps.item, nextProps.header);
|
||||
return currHeader !== nextHeader;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let header = getResponseHeader(this.props.item, this.props.header);
|
||||
|
@ -42,6 +42,6 @@ const RequestListColumnResponseHeader = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnResponseHeader;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -14,17 +14,17 @@ const { getResponseTime } = require("../utils/request-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnResponseTime = createClass({
|
||||
displayName: "RequestListColumnResponseTime",
|
||||
|
||||
propTypes: {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnResponseTime extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return getResponseTime(this.props.item) !== getResponseTime(nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { firstRequestStartedMillis, item } = this.props;
|
||||
|
@ -40,6 +40,6 @@ const RequestListColumnResponseTime = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnResponseTime;
|
||||
|
|
|
@ -5,23 +5,23 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnScheme = createClass({
|
||||
displayName: "RequestListColumnScheme",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnScheme extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.urlDetails.scheme !== nextProps.item.urlDetails.scheme;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
const { urlDetails } = this.props.item;
|
||||
|
@ -34,6 +34,6 @@ const RequestListColumnScheme = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnScheme;
|
||||
|
|
|
@ -5,19 +5,19 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnSetCookies = createClass({
|
||||
displayName: "RequestListColumnSetCookies",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnSetCookies extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
let { responseCookies: currResponseCookies = { cookies: [] } } = this.props.item;
|
||||
|
@ -25,7 +25,7 @@ const RequestListColumnSetCookies = createClass({
|
|||
currResponseCookies = currResponseCookies.cookies || currResponseCookies;
|
||||
nextResponseCookies = nextResponseCookies.cookies || nextResponseCookies;
|
||||
return currResponseCookies !== nextResponseCookies;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { responseCookies = { cookies: [] } } = this.props.item;
|
||||
|
@ -38,6 +38,6 @@ const RequestListColumnSetCookies = createClass({
|
|||
}, responseCookiesLength)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnSetCookies;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -14,18 +14,18 @@ const { getStartTime } = require("../utils/request-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnStartTime = createClass({
|
||||
displayName: "RequestListColumnStartTime",
|
||||
|
||||
propTypes: {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnStartTime extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return getStartTime(this.props.item, this.props.firstRequestStartedMillis)
|
||||
!== getStartTime(nextProps.item, nextProps.firstRequestStartedMillis);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { firstRequestStartedMillis, item } = this.props;
|
||||
|
@ -40,6 +40,6 @@ const RequestListColumnStartTime = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnStartTime;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -21,16 +21,16 @@ const UPDATED_STATUS_PROPS = [
|
|||
"statusText",
|
||||
];
|
||||
|
||||
const RequestListColumnStatus = createClass({
|
||||
displayName: "RequestListColumnStatus",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnStatus extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_STATUS_PROPS, this.props.item, nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { fromCache, fromServiceWorker, status, statusText } = this.props.item;
|
||||
|
@ -69,6 +69,6 @@ const RequestListColumnStatus = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnStatus;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -21,16 +21,16 @@ const UPDATED_TRANSFERRED_PROPS = [
|
|||
"fromServiceWorker",
|
||||
];
|
||||
|
||||
const RequestListColumnTransferredSize = createClass({
|
||||
displayName: "RequestListColumnTransferredSize",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnTransferredSize extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_TRANSFERRED_PROPS, this.props.item, nextProps.item);
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { fromCache, fromServiceWorker, status, transferredSize } = this.props.item;
|
||||
|
@ -52,6 +52,6 @@ const RequestListColumnTransferredSize = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnTransferredSize;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -13,16 +13,16 @@ const { getAbbreviatedMimeType } = require("../utils/request-utils");
|
|||
|
||||
const { div } = DOM;
|
||||
|
||||
const RequestListColumnType = createClass({
|
||||
displayName: "RequestListColumnType",
|
||||
|
||||
propTypes: {
|
||||
item: PropTypes.object.isRequired,
|
||||
},
|
||||
class RequestListColumnType extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
item: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return this.props.item.mimeType !== nextProps.item.mimeType;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { mimeType } = this.props.item;
|
||||
|
@ -41,6 +41,6 @@ const RequestListColumnType = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListColumnType;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -23,19 +23,19 @@ const UPDATED_WATERFALL_PROPS = [
|
|||
// List of properties of the timing info we want to create boxes for
|
||||
const TIMING_KEYS = ["blocked", "dns", "connect", "ssl", "send", "wait", "receive"];
|
||||
|
||||
const RequestListColumnWaterfall = createClass({
|
||||
displayName: "RequestListColumnWaterfall",
|
||||
|
||||
propTypes: {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
},
|
||||
class RequestListColumnWaterfall extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_WATERFALL_PROPS, this.props.item, nextProps.item) ||
|
||||
this.props.firstRequestStartedMillis !== nextProps.firstRequestStartedMillis;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { firstRequestStartedMillis, item, onWaterfallMouseDown } = this.props;
|
||||
|
@ -62,7 +62,7 @@ const RequestListColumnWaterfall = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function timingTooltip(item) {
|
||||
let { eventTimings, fromCache, fromServiceWorker, totalTime } = item;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -31,25 +31,36 @@ const REQUESTS_TOOLTIP_TOGGLE_DELAY = 500;
|
|||
/**
|
||||
* Renders the actual contents of the request list.
|
||||
*/
|
||||
const RequestListContent = createClass({
|
||||
displayName: "RequestListContent",
|
||||
class RequestListContent extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
connector: PropTypes.object.isRequired,
|
||||
columns: PropTypes.object.isRequired,
|
||||
dispatch: PropTypes.func.isRequired,
|
||||
displayedRequests: PropTypes.object.isRequired,
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
fromCache: PropTypes.bool,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
onItemMouseDown: PropTypes.func.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
onSelectDelta: PropTypes.func.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
scale: PropTypes.number,
|
||||
selectedRequestId: PropTypes.string,
|
||||
};
|
||||
}
|
||||
|
||||
propTypes: {
|
||||
connector: PropTypes.object.isRequired,
|
||||
columns: PropTypes.object.isRequired,
|
||||
dispatch: PropTypes.func.isRequired,
|
||||
displayedRequests: PropTypes.object.isRequired,
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
fromCache: PropTypes.bool,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
onItemMouseDown: PropTypes.func.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
onSelectDelta: PropTypes.func.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
scale: PropTypes.number,
|
||||
selectedRequestId: PropTypes.string,
|
||||
},
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.setScalingStyles = this.setScalingStyles.bind(this);
|
||||
this.isScrolledToBottom = this.isScrolledToBottom.bind(this);
|
||||
this.onHover = this.onHover.bind(this);
|
||||
this.onScroll = this.onScroll.bind(this);
|
||||
this.onKeyDown = this.onKeyDown.bind(this);
|
||||
this.onContextMenu = this.onContextMenu.bind(this);
|
||||
this.onFocusedNodeChange = this.onFocusedNodeChange.bind(this);
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
const { dispatch, connector } = this.props;
|
||||
|
@ -60,7 +71,7 @@ const RequestListContent = createClass({
|
|||
openStatistics: (open) => dispatch(Actions.openStatistics(connector, open)),
|
||||
});
|
||||
this.tooltip = new HTMLTooltip(window.parent.document, { type: "arrow" });
|
||||
},
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Set the CSS variables for waterfall scaling
|
||||
|
@ -74,14 +85,14 @@ const RequestListContent = createClass({
|
|||
|
||||
// Install event handler to hide the tooltip on scroll
|
||||
this.refs.contentEl.addEventListener("scroll", this.onScroll, true);
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUpdate(nextProps) {
|
||||
// Check if the list is scrolled to bottom before the UI update.
|
||||
// The scroll is ever needed only if new rows are added to the list.
|
||||
const delta = nextProps.displayedRequests.size - this.props.displayedRequests.size;
|
||||
this.shouldScrollBottom = delta > 0 && this.isScrolledToBottom();
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
// Update the CSS variables for waterfall scaling after props change
|
||||
|
@ -92,14 +103,14 @@ const RequestListContent = createClass({
|
|||
let node = this.refs.contentEl;
|
||||
node.scrollTop = node.scrollHeight;
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this.refs.contentEl.removeEventListener("scroll", this.onScroll, true);
|
||||
|
||||
// Uninstall the tooltip event handler
|
||||
this.tooltip.stopTogglingOnHover();
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the CSS variables for waterfall scaling. If React supported setting CSS
|
||||
|
@ -119,7 +130,7 @@ const RequestListContent = createClass({
|
|||
style.removeProperty("--timings-rev-scale");
|
||||
style.setProperty("--timings-scale", scale);
|
||||
style.setProperty("--timings-rev-scale", 1 / scale);
|
||||
},
|
||||
}
|
||||
|
||||
isScrolledToBottom() {
|
||||
const { contentEl } = this.refs;
|
||||
|
@ -133,7 +144,7 @@ const RequestListContent = createClass({
|
|||
let contentRect = contentEl.getBoundingClientRect();
|
||||
|
||||
return (lastChildRect.height + lastChildRect.top) <= contentRect.bottom;
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* The predicate used when deciding whether a popup should be shown
|
||||
|
@ -165,14 +176,14 @@ const RequestListContent = createClass({
|
|||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* Scroll listener for the requests menu view.
|
||||
*/
|
||||
onScroll() {
|
||||
this.tooltip.hide();
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* Handler for keyboard events. For arrow up/down, page up/down, home/end,
|
||||
|
@ -210,12 +221,12 @@ const RequestListContent = createClass({
|
|||
evt.stopPropagation();
|
||||
this.props.onSelectDelta(delta);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
onContextMenu(evt) {
|
||||
evt.preventDefault();
|
||||
this.contextMenu.open(evt);
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* If selection has just changed (by keyboard navigation), don't keep the list
|
||||
|
@ -223,7 +234,7 @@ const RequestListContent = createClass({
|
|||
*/
|
||||
onFocusedNodeChange() {
|
||||
this.shouldScrollBottom = false;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
|
@ -267,8 +278,8 @@ const RequestListContent = createClass({
|
|||
)
|
||||
)
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = connect(
|
||||
(state) => ({
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -32,14 +32,14 @@ const PERFORMANCE_NOTICE_3 = L10N.getStr("netmonitor.perfNotice3");
|
|||
* UI displayed when the request list is empty. Contains instructions on reloading
|
||||
* the page and on triggering performance analysis of the page.
|
||||
*/
|
||||
const RequestListEmptyNotice = createClass({
|
||||
displayName: "RequestListEmptyNotice",
|
||||
|
||||
propTypes: {
|
||||
connector: PropTypes.object.isRequired,
|
||||
onReloadClick: PropTypes.func.isRequired,
|
||||
onPerfClick: PropTypes.func.isRequired,
|
||||
},
|
||||
class RequestListEmptyNotice extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
connector: PropTypes.object.isRequired,
|
||||
onReloadClick: PropTypes.func.isRequired,
|
||||
onPerfClick: PropTypes.func.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return div(
|
||||
|
@ -71,7 +71,7 @@ const RequestListEmptyNotice = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = connect(
|
||||
undefined,
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
PropTypes,
|
||||
DOM,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -27,19 +27,26 @@ const { div, button } = DOM;
|
|||
* Displays tick marks in the waterfall column header.
|
||||
* Also draws the waterfall background canvas and updates it when needed.
|
||||
*/
|
||||
const RequestListHeader = createClass({
|
||||
displayName: "RequestListHeader",
|
||||
class RequestListHeader extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
columns: PropTypes.object.isRequired,
|
||||
resetColumns: PropTypes.func.isRequired,
|
||||
resizeWaterfall: PropTypes.func.isRequired,
|
||||
scale: PropTypes.number,
|
||||
sort: PropTypes.object,
|
||||
sortBy: PropTypes.func.isRequired,
|
||||
toggleColumn: PropTypes.func.isRequired,
|
||||
waterfallWidth: PropTypes.number,
|
||||
};
|
||||
}
|
||||
|
||||
propTypes: {
|
||||
columns: PropTypes.object.isRequired,
|
||||
resetColumns: PropTypes.func.isRequired,
|
||||
resizeWaterfall: PropTypes.func.isRequired,
|
||||
scale: PropTypes.number,
|
||||
sort: PropTypes.object,
|
||||
sortBy: PropTypes.func.isRequired,
|
||||
toggleColumn: PropTypes.func.isRequired,
|
||||
waterfallWidth: PropTypes.number,
|
||||
},
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.onContextMenu = this.onContextMenu.bind(this);
|
||||
this.drawBackground = this.drawBackground.bind(this);
|
||||
this.resizeWaterfall = this.resizeWaterfall.bind(this);
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
const { resetColumns, toggleColumn } = this.props;
|
||||
|
@ -47,7 +54,7 @@ const RequestListHeader = createClass({
|
|||
resetColumns,
|
||||
toggleColumn,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// Create the object that takes care of drawing the waterfall canvas background
|
||||
|
@ -56,23 +63,23 @@ const RequestListHeader = createClass({
|
|||
this.resizeWaterfall();
|
||||
window.addEventListener("resize", this.resizeWaterfall);
|
||||
addThemeObserver(this.drawBackground);
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate() {
|
||||
this.drawBackground();
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this.background.destroy();
|
||||
this.background = null;
|
||||
window.removeEventListener("resize", this.resizeWaterfall);
|
||||
removeThemeObserver(this.drawBackground);
|
||||
},
|
||||
}
|
||||
|
||||
onContextMenu(evt) {
|
||||
evt.preventDefault();
|
||||
this.contextMenu.open(evt);
|
||||
},
|
||||
}
|
||||
|
||||
drawBackground() {
|
||||
// The background component is theme dependent, so add the current theme to the props.
|
||||
|
@ -80,7 +87,7 @@ const RequestListHeader = createClass({
|
|||
theme: getTheme()
|
||||
});
|
||||
this.background.draw(props);
|
||||
},
|
||||
}
|
||||
|
||||
resizeWaterfall() {
|
||||
let waterfallHeader = this.refs.waterfallHeader;
|
||||
|
@ -91,7 +98,7 @@ const RequestListHeader = createClass({
|
|||
this._resizeTimerId = window.requestIdleCallback(() =>
|
||||
this.props.resizeWaterfall(waterfallHeader.getBoundingClientRect().width));
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { columns, scale, sort, sortBy, waterfallWidth } = this.props;
|
||||
|
@ -141,7 +148,7 @@ const RequestListHeader = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Build the waterfall header - timing tick marks with the right spacing
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -73,37 +73,37 @@ const UPDATED_REQ_PROPS = [
|
|||
/**
|
||||
* Render one row in the request list.
|
||||
*/
|
||||
const RequestListItem = createClass({
|
||||
displayName: "RequestListItem",
|
||||
|
||||
propTypes: {
|
||||
columns: PropTypes.object.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
index: PropTypes.number.isRequired,
|
||||
isSelected: PropTypes.bool.isRequired,
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
fromCache: PropTypes.bool,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
onContextMenu: PropTypes.func.isRequired,
|
||||
onFocusedNodeChange: PropTypes.func,
|
||||
onMouseDown: PropTypes.func.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
waterfallWidth: PropTypes.number,
|
||||
},
|
||||
class RequestListItem extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
columns: PropTypes.object.isRequired,
|
||||
item: PropTypes.object.isRequired,
|
||||
index: PropTypes.number.isRequired,
|
||||
isSelected: PropTypes.bool.isRequired,
|
||||
firstRequestStartedMillis: PropTypes.number.isRequired,
|
||||
fromCache: PropTypes.bool,
|
||||
onCauseBadgeMouseDown: PropTypes.func.isRequired,
|
||||
onContextMenu: PropTypes.func.isRequired,
|
||||
onFocusedNodeChange: PropTypes.func,
|
||||
onMouseDown: PropTypes.func.isRequired,
|
||||
onSecurityIconMouseDown: PropTypes.func.isRequired,
|
||||
onThumbnailMouseDown: PropTypes.func.isRequired,
|
||||
onWaterfallMouseDown: PropTypes.func.isRequired,
|
||||
waterfallWidth: PropTypes.number,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
if (this.props.isSelected) {
|
||||
this.refs.listItem.focus();
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
return !propertiesEqual(UPDATED_REQ_ITEM_PROPS, this.props.item, nextProps.item) ||
|
||||
!propertiesEqual(UPDATED_REQ_PROPS, this.props, nextProps) ||
|
||||
!I.is(this.props.columns, nextProps.columns);
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
if (!prevProps.isSelected && this.props.isSelected) {
|
||||
|
@ -112,7 +112,7 @@ const RequestListItem = createClass({
|
|||
this.props.onFocusedNodeChange();
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -174,6 +174,6 @@ const RequestListItem = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = RequestListItem;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -34,22 +34,27 @@ const JSON_VIEW_MIME_TYPE = "application/vnd.mozilla.json.view";
|
|||
* Response panel component
|
||||
* Displays the GET parameters and POST data of a request
|
||||
*/
|
||||
const ResponsePanel = createClass({
|
||||
displayName: "ResponsePanel",
|
||||
|
||||
propTypes: {
|
||||
request: PropTypes.object.isRequired,
|
||||
openLink: PropTypes.func,
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
class ResponsePanel extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
request: PropTypes.object.isRequired,
|
||||
openLink: PropTypes.func,
|
||||
};
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
imageDimensions: {
|
||||
width: 0,
|
||||
height: 0,
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
this.updateImageDimemsions = this.updateImageDimemsions.bind(this);
|
||||
this.isJSON = this.isJSON.bind(this);
|
||||
}
|
||||
|
||||
updateImageDimemsions({ target }) {
|
||||
this.setState({
|
||||
|
@ -58,7 +63,7 @@ const ResponsePanel = createClass({
|
|||
height: target.naturalHeight,
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
// Handle json, which we tentatively identify by checking the MIME type
|
||||
// for "json" after any word boundary. This works for the standard
|
||||
|
@ -114,7 +119,7 @@ const ResponsePanel = createClass({
|
|||
}
|
||||
|
||||
return null;
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let { openLink, request } = this.props;
|
||||
|
@ -193,6 +198,6 @@ const ResponsePanel = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = ResponsePanel;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
"use strict";
|
||||
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
DOM,
|
||||
PropTypes,
|
||||
} = require("devtools/client/shared/vendor/react");
|
||||
|
@ -17,15 +17,15 @@ const { div } = DOM;
|
|||
/**
|
||||
* CodeMirror editor as a React component
|
||||
*/
|
||||
const SourceEditor = createClass({
|
||||
displayName: "SourceEditor",
|
||||
|
||||
propTypes: {
|
||||
// Source editor syntax hightligh mode, which is a mime type defined in CodeMirror
|
||||
mode: PropTypes.string,
|
||||
// Source editor content
|
||||
text: PropTypes.string,
|
||||
},
|
||||
class SourceEditor extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
// Source editor syntax hightligh mode, which is a mime type defined in CodeMirror
|
||||
mode: PropTypes.string,
|
||||
// Source editor content
|
||||
text: PropTypes.string,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const { mode, text } = this.props;
|
||||
|
@ -43,7 +43,7 @@ const SourceEditor = createClass({
|
|||
this.editorTimeout = setTimeout(() => {
|
||||
this.editor.appendToLocalElement(this.refs.editorElement);
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { mode, text } = this.props;
|
||||
|
@ -56,12 +56,12 @@ const SourceEditor = createClass({
|
|||
if (prevProps.text !== text) {
|
||||
this.editor.setText(text);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
clearTimeout(this.editorTimeout);
|
||||
this.editor.destroy();
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
|
@ -71,6 +71,6 @@ const SourceEditor = createClass({
|
|||
})
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = SourceEditor;
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
const ReactDOM = require("devtools/client/shared/vendor/react-dom");
|
||||
const { FILTER_TAGS } = require("../constants");
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -40,25 +40,34 @@ const CHARTS_CACHE_DISABLED = L10N.getStr("charts.cacheDisabled");
|
|||
* Performance analysis tool which shows you how long the browser takes to
|
||||
* download the different parts of your site.
|
||||
*/
|
||||
const StatisticsPanel = createClass({
|
||||
displayName: "StatisticsPanel",
|
||||
|
||||
propTypes: {
|
||||
connector: PropTypes.object.isRequired,
|
||||
closeStatistics: PropTypes.func.isRequired,
|
||||
enableRequestFilterTypeOnly: PropTypes.func.isRequired,
|
||||
requests: PropTypes.object,
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
class StatisticsPanel extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
connector: PropTypes.object.isRequired,
|
||||
closeStatistics: PropTypes.func.isRequired,
|
||||
enableRequestFilterTypeOnly: PropTypes.func.isRequired,
|
||||
requests: PropTypes.object,
|
||||
};
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
isVerticalSpliter: MediaQueryList.matches,
|
||||
};
|
||||
},
|
||||
|
||||
this.createMDNLink = this.createMDNLink.bind(this);
|
||||
this.unmountMDNLinkContainers = this.unmountMDNLinkContainers.bind(this);
|
||||
this.createChart = this.createChart.bind(this);
|
||||
this.sanitizeChartDataSource = this.sanitizeChartDataSource.bind(this);
|
||||
this.responseIsFresh = this.responseIsFresh.bind(this);
|
||||
this.onLayoutChange = this.onLayoutChange.bind(this);
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
this.mdnLinkContainerNodes = new Map();
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
MediaQueryList.addListener(this.onLayoutChange);
|
||||
|
@ -83,12 +92,12 @@ const StatisticsPanel = createClass({
|
|||
|
||||
this.createMDNLink("primedCacheChart", getPerformanceAnalysisURL());
|
||||
this.createMDNLink("emptyCacheChart", getPerformanceAnalysisURL());
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
MediaQueryList.removeListener(this.onLayoutChange);
|
||||
this.unmountMDNLinkContainers();
|
||||
},
|
||||
}
|
||||
|
||||
createMDNLink(chartId, url) {
|
||||
if (this.mdnLinkContainerNodes.has(chartId)) {
|
||||
|
@ -103,13 +112,13 @@ const StatisticsPanel = createClass({
|
|||
title.appendChild(containerNode);
|
||||
ReactDOM.render(MDNLink({ url }), containerNode);
|
||||
this.mdnLinkContainerNodes.set(chartId, containerNode);
|
||||
},
|
||||
}
|
||||
|
||||
unmountMDNLinkContainers() {
|
||||
for (let [, node] of this.mdnLinkContainerNodes) {
|
||||
ReactDOM.unmountComponentAtNode(node);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
createChart({ id, title, data }) {
|
||||
// Create a new chart.
|
||||
|
@ -166,7 +175,7 @@ const StatisticsPanel = createClass({
|
|||
}
|
||||
|
||||
container.appendChild(chart.node);
|
||||
},
|
||||
}
|
||||
|
||||
sanitizeChartDataSource(requests, emptyCache) {
|
||||
const data = FILTER_TAGS.map((type) => ({
|
||||
|
@ -225,7 +234,7 @@ const StatisticsPanel = createClass({
|
|||
}
|
||||
|
||||
return data.filter(e => e.count > 0);
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if the "Expiration Calculations" defined in section 13.2.4 of the
|
||||
|
@ -263,13 +272,13 @@ const StatisticsPanel = createClass({
|
|||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
}
|
||||
|
||||
onLayoutChange() {
|
||||
this.setState({
|
||||
isVerticalSpliter: MediaQueryList.matches,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
const { closeStatistics } = this.props;
|
||||
|
@ -297,7 +306,7 @@ const StatisticsPanel = createClass({
|
|||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = connect(
|
||||
(state) => ({
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
const Services = require("Services");
|
||||
const {
|
||||
createClass,
|
||||
Component,
|
||||
createFactory,
|
||||
DOM,
|
||||
PropTypes,
|
||||
|
@ -56,58 +56,65 @@ const DISABLE_CACHE_LABEL = L10N.getStr("netmonitor.toolbar.disableCache.label")
|
|||
* Toolbar contains a set of useful tools to control network requests
|
||||
* as well as set of filters for filtering the content.
|
||||
*/
|
||||
const Toolbar = createClass({
|
||||
displayName: "Toolbar",
|
||||
class Toolbar extends Component {
|
||||
static get propTypes() {
|
||||
return {
|
||||
toggleRecording: PropTypes.func.isRequired,
|
||||
recording: PropTypes.bool.isRequired,
|
||||
clearRequests: PropTypes.func.isRequired,
|
||||
requestFilterTypes: PropTypes.array.isRequired,
|
||||
setRequestFilterText: PropTypes.func.isRequired,
|
||||
networkDetailsToggleDisabled: PropTypes.bool.isRequired,
|
||||
networkDetailsOpen: PropTypes.bool.isRequired,
|
||||
toggleNetworkDetails: PropTypes.func.isRequired,
|
||||
enablePersistentLogs: PropTypes.func.isRequired,
|
||||
togglePersistentLogs: PropTypes.func.isRequired,
|
||||
persistentLogsEnabled: PropTypes.bool.isRequired,
|
||||
disableBrowserCache: PropTypes.func.isRequired,
|
||||
toggleBrowserCache: PropTypes.func.isRequired,
|
||||
browserCacheDisabled: PropTypes.bool.isRequired,
|
||||
toggleRequestFilterType: PropTypes.func.isRequired,
|
||||
filteredRequests: PropTypes.object.isRequired,
|
||||
};
|
||||
}
|
||||
|
||||
propTypes: {
|
||||
toggleRecording: PropTypes.func.isRequired,
|
||||
recording: PropTypes.bool.isRequired,
|
||||
clearRequests: PropTypes.func.isRequired,
|
||||
requestFilterTypes: PropTypes.array.isRequired,
|
||||
setRequestFilterText: PropTypes.func.isRequired,
|
||||
networkDetailsToggleDisabled: PropTypes.bool.isRequired,
|
||||
networkDetailsOpen: PropTypes.bool.isRequired,
|
||||
toggleNetworkDetails: PropTypes.func.isRequired,
|
||||
enablePersistentLogs: PropTypes.func.isRequired,
|
||||
togglePersistentLogs: PropTypes.func.isRequired,
|
||||
persistentLogsEnabled: PropTypes.bool.isRequired,
|
||||
disableBrowserCache: PropTypes.func.isRequired,
|
||||
toggleBrowserCache: PropTypes.func.isRequired,
|
||||
browserCacheDisabled: PropTypes.bool.isRequired,
|
||||
toggleRequestFilterType: PropTypes.func.isRequired,
|
||||
filteredRequests: PropTypes.object.isRequired,
|
||||
},
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.toggleRequestFilterType = this.toggleRequestFilterType.bind(this);
|
||||
this.updatePersistentLogsEnabled = this.updatePersistentLogsEnabled.bind(this);
|
||||
this.updateBrowserCacheDisabled = this.updateBrowserCacheDisabled.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
Services.prefs.addObserver(DEVTOOLS_ENABLE_PERSISTENT_LOG_PREF,
|
||||
this.updatePersistentLogsEnabled);
|
||||
Services.prefs.addObserver(DEVTOOLS_DISABLE_CACHE_PREF,
|
||||
this.updateBrowserCacheDisabled);
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
Services.prefs.removeObserver(DEVTOOLS_ENABLE_PERSISTENT_LOG_PREF,
|
||||
this.updatePersistentLogsEnabled);
|
||||
Services.prefs.removeObserver(DEVTOOLS_DISABLE_CACHE_PREF,
|
||||
this.updateBrowserCacheDisabled);
|
||||
},
|
||||
}
|
||||
|
||||
toggleRequestFilterType(evt) {
|
||||
if (evt.type === "keydown" && (evt.key !== "" || evt.key !== "Enter")) {
|
||||
return;
|
||||
}
|
||||
this.props.toggleRequestFilterType(evt.target.dataset.key);
|
||||
},
|
||||
}
|
||||
|
||||
updatePersistentLogsEnabled() {
|
||||
this.props.enablePersistentLogs(
|
||||
Services.prefs.getBoolPref(DEVTOOLS_ENABLE_PERSISTENT_LOG_PREF));
|
||||
},
|
||||
}
|
||||
|
||||
updateBrowserCacheDisabled() {
|
||||
this.props.disableBrowserCache(
|
||||
Services.prefs.getBoolPref(DEVTOOLS_DISABLE_CACHE_PREF));
|
||||
},
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
|
@ -226,8 +233,8 @@ const Toolbar = createClass({
|
|||
)
|
||||
)
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = connect(
|
||||
(state) => ({
|
||||
|
|
Загрузка…
Ссылка в новой задаче