summaryrefslogtreecommitdiffstats
path: root/devtools/client/netmonitor/src/components/NetworkActionBar.js
diff options
context:
space:
mode:
Diffstat (limited to 'devtools/client/netmonitor/src/components/NetworkActionBar.js')
-rw-r--r--devtools/client/netmonitor/src/components/NetworkActionBar.js136
1 files changed, 136 insertions, 0 deletions
diff --git a/devtools/client/netmonitor/src/components/NetworkActionBar.js b/devtools/client/netmonitor/src/components/NetworkActionBar.js
new file mode 100644
index 0000000000..92110e9ec5
--- /dev/null
+++ b/devtools/client/netmonitor/src/components/NetworkActionBar.js
@@ -0,0 +1,136 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const {
+ Component,
+ createFactory,
+} = require("resource://devtools/client/shared/vendor/react.js");
+const {
+ connect,
+} = require("resource://devtools/client/shared/redux/visibility-handler-connect.js");
+const {
+ div,
+} = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
+const {
+ L10N,
+} = require("resource://devtools/client/netmonitor/src/utils/l10n.js");
+const Actions = require("resource://devtools/client/netmonitor/src/actions/index.js");
+const {
+ PANELS,
+} = require("resource://devtools/client/netmonitor/src/constants.js");
+
+const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.js");
+
+const Tabbar = createFactory(
+ require("resource://devtools/client/shared/components/tabs/TabBar.js")
+);
+const TabPanel = createFactory(
+ require("resource://devtools/client/shared/components/tabs/Tabs.js").TabPanel
+);
+
+loader.lazyGetter(this, "SearchPanel", function () {
+ return createFactory(
+ require("resource://devtools/client/netmonitor/src/components/search/SearchPanel.js")
+ );
+});
+
+loader.lazyGetter(this, "RequestBlockingPanel", function () {
+ return createFactory(
+ require("resource://devtools/client/netmonitor/src/components/request-blocking/RequestBlockingPanel.js")
+ );
+});
+
+loader.lazyGetter(this, "HTTPCustomRequestPanel", function () {
+ return createFactory(
+ require("resource://devtools/client/netmonitor/src/components/new-request/HTTPCustomRequestPanel.js")
+ );
+});
+
+class NetworkActionBar extends Component {
+ static get propTypes() {
+ return {
+ connector: PropTypes.object.isRequired,
+ selectedActionBarTabId: PropTypes.string,
+ selectActionBarTab: PropTypes.func.isRequired,
+ toggleNetworkActionBar: PropTypes.func.isRequired,
+ };
+ }
+
+ render() {
+ const {
+ connector,
+ selectedActionBarTabId,
+ selectActionBarTab,
+ toggleNetworkActionBar,
+ } = this.props;
+
+ // The request blocking and search panels are available behind a pref
+ const showBlockingPanel = Services.prefs.getBoolPref(
+ "devtools.netmonitor.features.requestBlocking"
+ );
+ const showSearchPanel = Services.prefs.getBoolPref(
+ "devtools.netmonitor.features.search"
+ );
+ const showNewCustomRequestPanel = Services.prefs.getBoolPref(
+ "devtools.netmonitor.features.newEditAndResend"
+ );
+
+ return div(
+ { className: "network-action-bar" },
+ Tabbar(
+ {
+ activeTabId: selectedActionBarTabId,
+ onSelect: id => selectActionBarTab(id),
+ sidebarToggleButton: {
+ collapsed: false,
+ collapsePaneTitle: L10N.getStr("collapseActionPane"),
+ expandPaneTitle: "",
+ onClick: toggleNetworkActionBar,
+ alignRight: true,
+ canVerticalSplit: false,
+ },
+ },
+ showNewCustomRequestPanel &&
+ TabPanel(
+ {
+ id: PANELS.HTTP_CUSTOM_REQUEST,
+ title: L10N.getStr("netmonitor.actionbar.HTTPCustomRequest"),
+ className: "network-action-bar-HTTP-custom-request",
+ },
+ HTTPCustomRequestPanel({ connector })
+ ),
+ showSearchPanel &&
+ TabPanel(
+ {
+ id: PANELS.SEARCH,
+ title: L10N.getStr("netmonitor.actionbar.search"),
+ className: "network-action-bar-search",
+ },
+ SearchPanel({ connector })
+ ),
+ showBlockingPanel &&
+ TabPanel(
+ {
+ id: PANELS.BLOCKING,
+ title: L10N.getStr("netmonitor.actionbar.requestBlocking2"),
+ className: "network-action-bar-blocked",
+ },
+ RequestBlockingPanel()
+ )
+ )
+ );
+ }
+}
+
+module.exports = connect(
+ state => ({
+ selectedActionBarTabId: state.ui.selectedActionBarTabId,
+ }),
+ dispatch => ({
+ selectActionBarTab: id => dispatch(Actions.selectActionBarTab(id)),
+ toggleNetworkActionBar: () => dispatch(Actions.toggleNetworkActionBar()),
+ })
+)(NetworkActionBar);