Bug 1289258 - Part 1: Get dispatch via props in filter components. r=bgrins
--- a/devtools/client/webconsole/new-console-output/components/filter-bar.js
+++ b/devtools/client/webconsole/new-console-output/components/filter-bar.js
@@ -9,49 +9,48 @@ const {
DOM: dom,
PropTypes
} = require("devtools/client/shared/vendor/react");
const { connect } = require("devtools/client/shared/vendor/react-redux");
const { getAllFilters } = require("devtools/client/webconsole/new-console-output/selectors/filters");
const { getAllUi } = require("devtools/client/webconsole/new-console-output/selectors/ui");
const messagesActions = require("devtools/client/webconsole/new-console-output/actions/messages");
const uiActions = require("devtools/client/webconsole/new-console-output/actions/ui");
-const { store } = require("devtools/client/webconsole/new-console-output/store");
const {
SEVERITY_FILTER
} = require("../constants");
const FilterToggleButton = createFactory(require("devtools/client/webconsole/new-console-output/components/filter-toggle-button").FilterToggleButton);
const FilterBar = createClass({
displayName: "FilterBar",
propTypes: {
filter: PropTypes.object.isRequired,
ui: PropTypes.object.isRequired
},
onClearOutputButtonClick: function () {
- store.dispatch(messagesActions.messagesClear());
+ this.props.dispatch(messagesActions.messagesClear());
},
onToggleFilterConfigBarButtonClick: function () {
- store.dispatch(uiActions.filterBarToggle());
+ this.props.dispatch(uiActions.filterBarToggle());
},
onClearFiltersButtonClick: function () {
- store.dispatch(messagesActions.filtersClear());
+ this.props.dispatch(messagesActions.filtersClear());
},
onSearchInput: function (e) {
- store.dispatch(messagesActions.messagesSearch(e.target.value));
+ this.props.dispatch(messagesActions.messagesSearch(e.target.value));
},
render() {
- const {filter, ui} = this.props;
+ const {dispatch, filter, ui} = this.props;
let configFilterBarVisible = ui.configFilterBarVisible;
let children = [];
children.push(dom.div({className: "devtools-toolbar webconsole-filterbar-primary"},
dom.button({
className: "devtools-button devtools-clear-icon",
title: "Clear output",
onClick: this.onClearOutputButtonClick
@@ -73,32 +72,40 @@ const FilterBar = createClass({
if (configFilterBarVisible) {
children.push(
dom.div({className: "devtools-toolbar"},
FilterToggleButton({
active: filter.error,
label: "Errors",
filterType: SEVERITY_FILTER,
- filterKey: "error"}),
+ filterKey: "error",
+ dispatch
+ }),
FilterToggleButton({
active: filter.warn,
label: "Warnings",
filterType: SEVERITY_FILTER,
- filterKey: "warn"}),
+ filterKey: "warn",
+ dispatch
+ }),
FilterToggleButton({
active: filter.log,
label: "Logs",
filterType: SEVERITY_FILTER,
- filterKey: "log"}),
+ filterKey: "log",
+ dispatch
+ }),
FilterToggleButton({
active: filter.info,
label: "Info",
filterType: SEVERITY_FILTER,
- filterKey: "info"})
+ filterKey: "info",
+ dispatch
+ })
)
);
}
if (ui.filteredMessageVisible) {
children.push(
dom.div({className: "devtools-toolbar"},
dom.span({
--- a/devtools/client/webconsole/new-console-output/components/filter-toggle-button.js
+++ b/devtools/client/webconsole/new-console-output/components/filter-toggle-button.js
@@ -3,36 +3,36 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const {
createClass,
DOM: dom,
PropTypes
} = require("devtools/client/shared/vendor/react");
-const { store } = require("devtools/client/webconsole/new-console-output/store");
const actions = require("devtools/client/webconsole/new-console-output/actions/messages");
const {
SEVERITY_FILTER
} = require("../constants");
const FilterToggleButton = createClass({
displayName: "FilterToggleButton",
propTypes: {
label: PropTypes.string.isRequired,
filterType: PropTypes.string.isRequired,
filterKey: PropTypes.string.isRequired,
active: PropTypes.bool.isRequired,
+ dispatch: PropTypes.func.isRequired,
},
onClick: function () {
if (this.props.filterType === SEVERITY_FILTER) {
- store.dispatch(actions.severityFilter(
+ this.props.dispatch(actions.severityFilter(
this.props.filterKey, !this.props.active));
}
},
render() {
const {label, active} = this.props;
let classList = ["menu-filter-button"];