Merge pull request #5026 from matrix-org/t3chguy/room-list/14440

Put low priority xor toggle back in the room list context menu

res/css/views/rooms/_RoomTile.scss

@@ -221,10 +221,6 @@ limitations under the License.
         mask-image: url('$(res)/img/element-icons/roomlist/favorite.svg');
     }
 
-    .mx_RoomTile_iconFavorite::before {
-        mask-image: url('$(res)/img/feather-customised/favourites.svg');
-    }
-
     .mx_RoomTile_iconArrowDown::before {
         mask-image: url('$(res)/img/element-icons/roomlist/low-priority.svg');
     }

src/components/views/rooms/RoomTile.tsx

@@ -231,11 +231,11 @@ export default class RoomTile extends React.Component<IProps, IState> {
         ev.preventDefault();
         ev.stopPropagation();
 
-        if (tagId === DefaultTagID.Favourite) {
+        if (tagId === DefaultTagID.Favourite || tagId === DefaultTagID.LowPriority) {
-            const roomTags = RoomListStore.instance.getTagsForRoom(this.props.room);
+            const inverseTag = tagId === DefaultTagID.Favourite ? DefaultTagID.LowPriority : DefaultTagID.Favourite;
-            const isFavourite = roomTags.includes(DefaultTagID.Favourite);
+            const isApplied = RoomListStore.instance.getTagsForRoom(this.props.room).includes(tagId);
-            const removeTag = isFavourite ? DefaultTagID.Favourite : DefaultTagID.LowPriority;
+            const removeTag = isApplied ? tagId : inverseTag;
-            const addTag = isFavourite ? null : DefaultTagID.Favourite;
+            const addTag = isApplied ? null : tagId;
             dis.dispatch(RoomListActions.tagRoom(
                 MatrixClientPeg.get(),
                 this.props.room,
@@ -387,13 +387,6 @@ export default class RoomTile extends React.Component<IProps, IState> {
     private renderGeneralMenu(): React.ReactElement {
         if (!this.showContextMenu) return null; // no menu to show
 
-        const roomTags = RoomListStore.instance.getTagsForRoom(this.props.room);
-
-        const isFavorite = roomTags.includes(DefaultTagID.Favourite);
-        const favouriteIconClassName = isFavorite ? "mx_RoomTile_iconFavorite" : "mx_RoomTile_iconStar";
-        const favouriteLabelClassName = isFavorite ? "mx_RoomTile_contextMenu_activeRow" : "";
-        const favouriteLabel = isFavorite ? _t("Favourited") : _t("Favourite");
-
         let contextMenu = null;
         if (this.state.generalMenuPosition && this.props.tag === DefaultTagID.Archived) {
             contextMenu = (
@@ -409,19 +402,36 @@ export default class RoomTile extends React.Component<IProps, IState> {
                 </ContextMenu>
             );
         } else if (this.state.generalMenuPosition) {
+            const roomTags = RoomListStore.instance.getTagsForRoom(this.props.room);
+
+            const isFavorite = roomTags.includes(DefaultTagID.Favourite);
+            const favouriteLabel = isFavorite ? _t("Favourited") : _t("Favourite");
+
+            const isLowPriority = roomTags.includes(DefaultTagID.LowPriority);
+            const lowPriorityLabel = _t("Low Priority");
+
             contextMenu = (
                 <ContextMenu {...contextMenuBelow(this.state.generalMenuPosition)} onFinished={this.onCloseGeneralMenu}>
                     <div className="mx_IconizedContextMenu mx_IconizedContextMenu_compact mx_RoomTile_contextMenu">
                         <div className="mx_IconizedContextMenu_optionList">
                             <MenuItemCheckbox
-                                className={favouriteLabelClassName}
+                                className={isFavorite ? "mx_RoomTile_contextMenu_activeRow" : ""}
                                 onClick={(e) => this.onTagRoom(e, DefaultTagID.Favourite)}
                                 active={isFavorite}
                                 label={favouriteLabel}
                             >
-                                <span className={classNames("mx_IconizedContextMenu_icon", favouriteIconClassName)} />
+                                <span className="mx_IconizedContextMenu_icon mx_RoomTile_iconStar" />
                                 <span className="mx_IconizedContextMenu_label">{favouriteLabel}</span>
                             </MenuItemCheckbox>
+                            <MenuItemCheckbox
+                                className={isLowPriority ? "mx_RoomTile_contextMenu_activeRow" : ""}
+                                onClick={(e) => this.onTagRoom(e, DefaultTagID.LowPriority)}
+                                active={isLowPriority}
+                                label={lowPriorityLabel}
+                            >
+                                <span className="mx_IconizedContextMenu_icon mx_RoomTile_iconArrowDown" />
+                                <span className="mx_IconizedContextMenu_label">{lowPriorityLabel}</span>
+                            </MenuItemCheckbox>
                             <MenuItem onClick={this.onOpenRoomSettings} label={_t("Settings")}>
                                 <span className="mx_IconizedContextMenu_icon mx_RoomTile_iconSettings" />
                                 <span className="mx_IconizedContextMenu_label">{_t("Settings")}</span>

src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js

@@ -22,10 +22,6 @@ import * as sdk from "../../../../..";
 import AccessibleButton from "../../../elements/AccessibleButton";
 import Modal from "../../../../../Modal";
 import dis from "../../../../../dispatcher/dispatcher";
-import RoomListStore from "../../../../../stores/room-list/RoomListStore";
-import RoomListActions from "../../../../../actions/RoomListActions";
-import { DefaultTagID } from '../../../../../stores/room-list/models';
-import LabelledToggleSwitch from '../../../elements/LabelledToggleSwitch';
 
 export default class AdvancedRoomSettingsTab extends React.Component {
     static propTypes = {
@@ -36,13 +32,9 @@ export default class AdvancedRoomSettingsTab extends React.Component {
     constructor(props) {
         super(props);
 
-        const room = MatrixClientPeg.get().getRoom(props.roomId);
-        const roomTags = RoomListStore.instance.getTagsForRoom(room);
-
         this.state = {
             // This is eventually set to the value of room.getRecommendedVersion()
             upgradeRecommendation: null,
-            isLowPriorityRoom: roomTags.includes(DefaultTagID.LowPriority),
         };
     }
 
@@ -94,25 +86,6 @@ export default class AdvancedRoomSettingsTab extends React.Component {
         this.props.closeSettingsFn();
     };
 
-    _onToggleLowPriorityTag = (e) => {
-        this.setState({
-            isLowPriorityRoom: !this.state.isLowPriorityRoom,
-        });
-
-        const removeTag = this.state.isLowPriorityRoom ? DefaultTagID.LowPriority : DefaultTagID.Favourite;
-        const addTag = this.state.isLowPriorityRoom ? null : DefaultTagID.LowPriority;
-        const client = MatrixClientPeg.get();
-
-        dis.dispatch(RoomListActions.tagRoom(
-            client,
-            client.getRoom(this.props.roomId),
-            removeTag,
-            addTag,
-            undefined,
-            0,
-        ));
-    }
-
     render() {
         const client = MatrixClientPeg.get();
         const room = client.getRoom(this.props.roomId);
@@ -183,17 +156,6 @@ export default class AdvancedRoomSettingsTab extends React.Component {
                         {_t("Open Devtools")}
                     </AccessibleButton>
                 </div>
-                <div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
-                    <span className='mx_SettingsTab_subheading'>{_t('Make this room low priority')}</span>
-                    <LabelledToggleSwitch
-                        value={this.state.isLowPriorityRoom}
-                        onChange={this._onToggleLowPriorityTag}
-                        label={_t(
-                            "Low priority rooms show up at the bottom of your room list" +
-                            " in a dedicated section at the bottom of your room list",
-                        )}
-                    />
-                </div>
             </div>
         );
     }

src/i18n/strings/en_EN.json

@@ -927,8 +927,6 @@
     "Room version:": "Room version:",
     "Developer options": "Developer options",
     "Open Devtools": "Open Devtools",
-    "Make this room low priority": "Make this room low priority",
-    "Low priority rooms show up at the bottom of your room list in a dedicated section at the bottom of your room list": "Low priority rooms show up at the bottom of your room list in a dedicated section at the bottom of your room list",
     "This room is bridging messages to the following platforms. <a>Learn more.</a>": "This room is bridging messages to the following platforms. <a>Learn more.</a>",
     "This room isn’t bridging messages to any platforms. <a>Learn more.</a>": "This room isn’t bridging messages to any platforms. <a>Learn more.</a>",
     "Bridges": "Bridges",
@@ -1176,10 +1174,11 @@
     "All messages": "All messages",
     "Mentions & Keywords": "Mentions & Keywords",
     "Notification options": "Notification options",
-    "Favourited": "Favourited",
-    "Favourite": "Favourite",
     "Leave Room": "Leave Room",
     "Forget Room": "Forget Room",
+    "Favourited": "Favourited",
+    "Favourite": "Favourite",
+    "Low Priority": "Low Priority",
     "Room options": "Room options",
     "%(count)s unread messages including mentions.|other": "%(count)s unread messages including mentions.",
     "%(count)s unread messages including mentions.|one": "1 unread mention.",
@@ -1872,7 +1871,6 @@
     "Mentions only": "Mentions only",
     "Leave": "Leave",
     "Forget": "Forget",
-    "Low Priority": "Low Priority",
     "Direct Chat": "Direct Chat",
     "Clear status": "Clear status",
     "Update status": "Update status",