diff --git a/res/css/structures/_TagPanelButtons.scss b/res/css/structures/_TagPanelButtons.scss
index 309c50fb3e..f7cb189e25 100644
--- a/res/css/structures/_TagPanelButtons.scss
+++ b/res/css/structures/_TagPanelButtons.scss
@@ -1,5 +1,5 @@
/*
-Copyright 2017 New Vector Ltd.
+Copyright 2019 New Vector Ltd.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
diff --git a/src/components/structures/CustomRoomTagPanel.js b/src/components/structures/CustomRoomTagPanel.js
index a957c9c4ca..4e33f0a22d 100644
--- a/src/components/structures/CustomRoomTagPanel.js
+++ b/src/components/structures/CustomRoomTagPanel.js
@@ -1,5 +1,5 @@
/*
-Copyright 2017, 2018 New Vector Ltd.
+Copyright 2019 New Vector Ltd.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -22,34 +22,27 @@ import dis from '../../dispatcher';
import classNames from 'classnames';
import * as FormattingUtils from '../../utils/FormattingUtils';
-
-const CustomRoomTagPanel = React.createClass({
- displayName: 'CustomRoomTagPanel',
-
- getInitialState() {
- return {
+class CustomRoomTagPanel extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
tags: CustomRoomTagStore.getSortedTags(),
};
- },
+ }
- componentWillMount: function() {
+ componentWillMount() {
this._tagStoreToken = CustomRoomTagStore.addListener(() => {
this.setState({tags: CustomRoomTagStore.getSortedTags()});
});
- },
+ }
componentWillUnmount() {
if (this._tagStoreToken) {
this._tagStoreToken.remove();
}
- },
-
- onClearFilterClick(ev) {
- dis.dispatch({action: 'deselect_custom_room_tags'});
- },
+ }
render() {
- console.log("CustomRoomTagPanel", this.state.tags);
const tags = this.state.tags.map((tag) => {
return ();
});
@@ -58,19 +51,14 @@ const CustomRoomTagPanel = React.createClass({
mx_CustomRoomTagPanel_empty: this.state.tags.length === 0,
});
- const clearButton = undefined;
-
- return
-
- { clearButton }
-
+ return (
;
- },
-});
+
);
+ }
+}
class CustomRoomTagTile extends React.Component {
constructor(props) {
@@ -94,7 +82,6 @@ class CustomRoomTagTile extends React.Component {
}
render() {
- console.log("rendering CustomRoomTagTile", this.props.tag.name);
const BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const RoomTooltip = sdk.getComponent('rooms.RoomTooltip');
@@ -118,18 +105,20 @@ class CustomRoomTagTile extends React.Component {
const tip = (this.state.hover ?
:
);
- return (
-
-
- { badgeElement }
- { tip }
-
- );
+ return (
+
+
+
+ { badgeElement }
+ { tip }
+
+
+ );
}
}
diff --git a/src/components/structures/TagPanelButtons.js b/src/components/structures/TagPanelButtons.js
index 54f1733d7a..e976fdd436 100644
--- a/src/components/structures/TagPanelButtons.js
+++ b/src/components/structures/TagPanelButtons.js
@@ -1,5 +1,5 @@
/*
-Copyright 2017, 2018 New Vector Ltd.
+Copyright 2019 New Vector Ltd.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
diff --git a/src/stores/CustomRoomTagStore.js b/src/stores/CustomRoomTagStore.js
index 721fdfd3e0..0670ed0e6c 100644
--- a/src/stores/CustomRoomTagStore.js
+++ b/src/stores/CustomRoomTagStore.js
@@ -1,5 +1,5 @@
/*
-Copyright 2017 New Vector Ltd
+Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -13,10 +13,11 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
-import {Store} from 'flux/utils';
import dis from '../dispatcher';
import * as RoomNotifs from '../RoomNotifs';
import RoomListStore from './RoomListStore';
+import EventEmitter from 'events';
+
const STANDARD_TAGS_REGEX = /^(m\.(favourite|lowpriority|server_notice)|im\.vector\.fake\.(invite|recent|direct|archived))$/;
function commonPrefix(a, b) {
@@ -43,26 +44,36 @@ function commonPrefix(a, b) {
/**
* A class for storing application state for ordering tags in the TagPanel.
*/
-class CustomRoomTagStore extends Store {
+class CustomRoomTagStore extends EventEmitter {
constructor() {
- super(dis);
-
+ super();
// Initialise state
- this._state = Object.assign({}, {tags: this._getUpdatedTags()});
+ this._state = {tags: this._getUpdatedTags()};
this._roomListStoreToken = RoomListStore.addListener(() => {
- // UGLY: FluxStore doens't emit changes that
- // didn't come from a dispatcher action
- // so emit the change ourselves for now ...
- this._state.tags = this._getUpdatedTags();
- this.__emitter.emit("change");
+ this._setState({tags: this._getUpdatedTags()});
});
+ dis.register(payload => this._onDispatch(payload));
}
getTags() {
return this._state.tags;
}
+ _setState(newState) {
+ this._state = Object.assign(this._state, newState);
+ this.emit("change");
+ }
+
+ addListener(callback) {
+ this.on("change", callback);
+ return {
+ remove() {
+ this.removeListener("change", callback);
+ },
+ };
+ }
+
getSortedTags() {
const roomLists = RoomListStore.getRoomLists();
@@ -88,12 +99,8 @@ class CustomRoomTagStore extends Store {
});
}
- _setState(newState) {
- this._state = Object.assign(this._state, newState);
- this.__emitChange();
- }
- __onDispatch(payload) {
+ _onDispatch(payload) {
switch (payload.action) {
case 'select_custom_room_tag': {
const oldTags = this._state.tags;
@@ -105,15 +112,6 @@ class CustomRoomTagStore extends Store {
}
}
break;
- case 'deselect_custom_room_tags': {
- const tags = Object.keys(this._state.tags)
- .reduce((tags, tagName) => {
- tags[tagName] = false;
- return tags;
- }, {});
- this._setState({tags});
- }
- break;
case 'on_logged_out': {
this._state = {};
if (this._roomListStoreToken) {