diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 0c78043a42..d798070659 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -27,6 +27,7 @@ import * as RoomNotifs from '../../RoomNotifs'; import * as FormattingUtils from '../../utils/FormattingUtils'; import { KeyCode } from '../../Keyboard'; import { Group } from 'matrix-js-sdk'; +import PropTypes from 'prop-types'; // turn this on for drop & drag console debugging galore @@ -40,27 +41,28 @@ const RoomSubList = React.createClass({ debug: debug, propTypes: { - list: React.PropTypes.arrayOf(React.PropTypes.object).isRequired, - label: React.PropTypes.string.isRequired, - tagName: React.PropTypes.string, - editable: React.PropTypes.bool, + list: PropTypes.arrayOf(PropTypes.object).isRequired, + label: PropTypes.string.isRequired, + tagName: PropTypes.string, + editable: PropTypes.bool, - order: React.PropTypes.string.isRequired, + order: PropTypes.string.isRequired, // passed through to RoomTile and used to highlight room with `!` regardless of notifications count - isInvite: React.PropTypes.bool, + isInvite: PropTypes.bool, - startAsHidden: React.PropTypes.bool, - showSpinner: React.PropTypes.bool, // true to show a spinner if 0 elements when expanded - collapsed: React.PropTypes.bool.isRequired, // is LeftPanel collapsed? - onHeaderClick: React.PropTypes.func, - alwaysShowHeader: React.PropTypes.bool, - incomingCall: React.PropTypes.object, - onShowMoreRooms: React.PropTypes.func, - searchFilter: React.PropTypes.string, - emptyContent: React.PropTypes.node, // content shown if the list is empty - headerItems: React.PropTypes.node, // content shown in the sublist header - extraTiles: React.PropTypes.arrayOf(React.PropTypes.node), // extra elements added beneath tiles + startAsHidden: PropTypes.bool, + showSpinner: PropTypes.bool, // true to show a spinner if 0 elements when expanded + collapsed: PropTypes.bool.isRequired, // is LeftPanel collapsed? + onHeaderClick: PropTypes.func, + alwaysShowHeader: PropTypes.bool, + incomingCall: PropTypes.object, + onShowMoreRooms: PropTypes.func, + searchFilter: PropTypes.string, + emptyContent: PropTypes.node, // content shown if the list is empty + headerItems: PropTypes.node, // content shown in the sublist header + extraTiles: PropTypes.arrayOf(PropTypes.node), // extra elements added beneath tiles + showEmpty: PropTypes.bool, }, getInitialState: function() { @@ -79,6 +81,7 @@ const RoomSubList = React.createClass({ }, // NOP extraTiles: [], isInvite: false, + showEmpty: true, }; }, @@ -392,17 +395,29 @@ const RoomSubList = React.createClass({ const TruncatedList = sdk.getComponent('elements.TruncatedList'); let content; - if (this.state.sortedList.length === 0 && this.props.extraTiles.length === 0) { - // if no search filter is applied and there is a placeholder defined then show it, otherwise show nothing - if (!this.props.searchFilter && this.props.emptyContent) { + + if (this.props.showEmpty) { + // this is new behaviour with still controversial UX in that in hiding RoomSubLists the drop zones for DnD + // are also gone so when filtering users can't DnD rooms to some tags but is a lot cleaner otherwise. + if (this.state.sortedList.length === 0 && !this.props.searchFilter && this.props.extraTiles.length === 0) { content = this.props.emptyContent; } else { - // don't show an empty sublist - return null; + content = this.makeRoomTiles(); + content.push(...this.props.extraTiles); } } else { - content = this.makeRoomTiles(); - content.push(...this.props.extraTiles); + if (this.state.sortedList.length === 0 && this.props.extraTiles.length === 0) { + // if no search filter is applied and there is a placeholder defined then show it, otherwise show nothing + if (!this.props.searchFilter && this.props.emptyContent) { + content = this.props.emptyContent; + } else { + // don't show an empty sublist + return null; + } + } else { + content = this.makeRoomTiles(); + content.push(...this.props.extraTiles); + } } if (this.state.sortedList.length > 0 || this.props.extraTiles.length > 0 || this.props.editable) { diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js index 6397e73434..d02d8b23e5 100644 --- a/src/components/structures/UserSettings.js +++ b/src/components/structures/UserSettings.js @@ -81,6 +81,7 @@ const SIMPLE_SETTINGS = [ { id: "VideoView.flipVideoHorizontally" }, { id: "TagPanel.disableTagPanel" }, { id: "enableWidgetScreenshots" }, + { id: "RoomSubList.showEmpty" }, ]; // These settings must be defined in SettingsStore diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 62ae96f47f..8533e3f61a 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -16,6 +16,8 @@ limitations under the License. */ 'use strict'; +import SettingsStore from "../../../settings/SettingsStore"; + const React = require("react"); const ReactDOM = require("react-dom"); import PropTypes from 'prop-types'; @@ -608,6 +610,10 @@ module.exports = React.createClass({ const RoomSubList = sdk.getComponent('structures.RoomSubList'); const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper"); + // XXX: we can't detect device-level (localStorage) settings onChange as the SettingsStore does not notify + // so checking on every render is the sanest thing at this time. + const showEmpty = SettingsStore.getValue('RoomSubList.showEmpty'); + const self = this; return ( + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} /> + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} /> + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} /> { Object.keys(self.state.lists).map((tagName) => { if (!tagName.match(STANDARD_TAGS_REGEX)) { @@ -688,7 +699,8 @@ module.exports = React.createClass({ collapsed={self.props.collapsed} searchFilter={self.props.searchFilter} onHeaderClick={self.onSubListHeaderClick} - onShowMoreRooms={self.onShowMoreRooms} />; + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} />; } }) } @@ -702,7 +714,8 @@ module.exports = React.createClass({ collapsed={self.props.collapsed} searchFilter={self.props.searchFilter} onHeaderClick={self.onSubListHeaderClick} - onShowMoreRooms={self.onShowMoreRooms} /> + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} /> + onShowMoreRooms={self.onShowMoreRooms} + showEmpty={showEmpty} /> ); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index d697fbc7bd..486ecdf114 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -234,6 +234,7 @@ "Enable URL previews by default for participants in this room": "Enable URL previews by default for participants in this room", "Room Colour": "Room Colour", "Enable widget screenshots on supported widgets": "Enable widget screenshots on supported widgets", + "Show empty room list headings": "Show empty room list headings", "Collecting app version information": "Collecting app version information", "Collecting logs": "Collecting logs", "Uploading report": "Uploading report", @@ -335,7 +336,9 @@ "You have disabled URL previews by default.": "You have disabled URL previews by default.", "URL previews are enabled by default for participants in this room.": "URL previews are enabled by default for participants in this room.", "URL previews are disabled by default for participants in this room.": "URL previews are disabled by default for participants in this room.", + "In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.": "In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.", "URL Previews": "URL Previews", + "When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.": "When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.", "Cannot add any more widgets": "Cannot add any more widgets", "The maximum permitted number of widgets have already been added to this room.": "The maximum permitted number of widgets have already been added to this room.", "Add a widget": "Add a widget", @@ -575,31 +578,6 @@ "Scroll to unread messages": "Scroll to unread messages", "Jump to first unread message.": "Jump to first unread message.", "Close": "Close", - "Invalid alias format": "Invalid alias format", - "'%(alias)s' is not a valid format for an alias": "'%(alias)s' is not a valid format for an alias", - "Invalid address format": "Invalid address format", - "'%(alias)s' is not a valid format for an address": "'%(alias)s' is not a valid format for an address", - "not specified": "not specified", - "not set": "not set", - "Remote addresses for this room:": "Remote addresses for this room:", - "Addresses": "Addresses", - "The main address for this room is": "The main address for this room is", - "Local addresses for this room:": "Local addresses for this room:", - "This room has no local addresses": "This room has no local addresses", - "New address (e.g. #foo:%(localDomain)s)": "New address (e.g. #foo:%(localDomain)s)", - "Invalid community ID": "Invalid community ID", - "'%(groupId)s' is not a valid community ID": "'%(groupId)s' is not a valid community ID", - "Flair": "Flair", - "Showing flair for these communities:": "Showing flair for these communities:", - "This room is not showing flair for any communities": "This room is not showing flair for any communities", - "New community ID (e.g. +foo:%(localDomain)s)": "New community ID (e.g. +foo:%(localDomain)s)", - "You have enabled URL previews by default.": "You have enabled URL previews by default.", - "You have disabled URL previews by default.": "You have disabled URL previews by default.", - "URL previews are enabled by default for participants in this room.": "URL previews are enabled by default for participants in this room.", - "URL previews are disabled by default for participants in this room.": "URL previews are disabled by default for participants in this room.", - "In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.": "In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.", - "URL Previews": "URL Previews", - "When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.": "When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.", "Sunday": "Sunday", "Monday": "Monday", "Tuesday": "Tuesday", diff --git a/src/settings/Settings.js b/src/settings/Settings.js index 84178e2673..022fabc739 100644 --- a/src/settings/Settings.js +++ b/src/settings/Settings.js @@ -284,4 +284,9 @@ export const SETTINGS = { supportedLevels: ['room-device'], default: false, }, + "RoomSubList.showEmpty": { + supportedLevels: LEVELS_ACCOUNT_SETTINGS, + displayName: _td('Show empty room list headings'), + default: true, + }, };