Merge pull request #1432 from matrix-org/luke/groups-add-rooms-by-id

Implement adding rooms to a group (or group summary) by room ID

src/GroupAddressPicker.js

@@ -27,7 +27,7 @@ export function showGroupInviteDialog(groupId) {
         description: _t("Who would you like to add to this group?"),
         placeholder: _t("Name or matrix ID"),
         button: _t("Invite to Group"),
-        validAddressTypes: ['mx'],
+        validAddressTypes: ['mx-user-id'],
         onFinished: (success, addrs) => {
             if (!success) return;
 
@@ -45,7 +45,7 @@ export function showGroupAddRoomDialog(groupId) {
             placeholder: _t("Room name or alias"),
             button: _t("Add to group"),
             pickerType: 'room',
-            validAddressTypes: ['mx'],
+            validAddressTypes: ['mx-room-id'],
             onFinished: (success, addrs) => {
                 if (!success) return;
 

src/UserAddress.js

@@ -16,11 +16,12 @@ limitations under the License.
 
 const emailRegex = /^\S+@\S+\.\S+$/;
 
-const mxidRegex = /^@\S+:\S+$/;
+const mxUserIdRegex = /^@\S+:\S+$/;
+const mxRoomIdRegex = /^!\S+:\S+$/;
 
 import PropTypes from 'prop-types';
 export const addressTypes = [
-    'mx', 'email',
+    'mx-user-id', 'mx-room-id', 'email',
 ];
 
 // PropType definition for an object describing
@@ -41,13 +42,16 @@ export const UserAddressType = PropTypes.shape({
 
 export function getAddressType(inputText) {
     const isEmailAddress = emailRegex.test(inputText);
-    const isMatrixId = mxidRegex.test(inputText);
+    const isUserId = mxUserIdRegex.test(inputText);
+    const isRoomId = mxRoomIdRegex.test(inputText);
 
     // sanity check the input for user IDs
     if (isEmailAddress) {
         return 'email';
-    } else if (isMatrixId) {
+    } else if (isUserId) {
-        return 'mx';
+        return 'mx-user-id';
+    } else if (isRoomId) {
+        return 'mx-room-id';
     } else {
         return null;
     }

src/components/structures/GroupView.js

@@ -72,7 +72,7 @@ const CategoryRoomList = React.createClass({
             placeholder: _t("Room name or alias"),
             button: _t("Add to summary"),
             pickerType: 'room',
-            validAddressTypes: ['mx'],
+            validAddressTypes: ['mx-room-id'],
             groupId: this.props.groupId,
             onFinished: (success, addrs) => {
                 if (!success) return;
@@ -237,7 +237,7 @@ const RoleUserList = React.createClass({
             description: _t("Who would you like to add to this summary?"),
             placeholder: _t("Name or matrix ID"),
             button: _t("Add to summary"),
-            validAddressTypes: ['mx'],
+            validAddressTypes: ['mx-user-id'],
             groupId: this.props.groupId,
             shouldOmitSelf: false,
             onFinished: (success, addrs) => {

src/components/views/dialogs/AddressPickerDialog.js

@@ -363,7 +363,7 @@ module.exports = React.createClass({
         results.forEach((result) => {
             if (result.room_id) {
                 queryList.push({
-                    addressType: 'mx',
+                    addressType: 'mx-room-id',
                     address: result.room_id,
                     displayName: result.name,
                     avatarMxc: result.avatar_url,
@@ -380,7 +380,7 @@ module.exports = React.createClass({
             // Return objects, structure of which is defined
             // by UserAddressType
             queryList.push({
-                addressType: 'mx',
+                addressType: 'mx-user-id',
                 address: result.user_id,
                 displayName: result.display_name,
                 avatarMxc: result.avatar_url,
@@ -422,13 +422,20 @@ module.exports = React.createClass({
         if (addrType == null) {
             this.setState({ error: true });
             return null;
-        } else if (addrType == 'mx') {
+        } else if (addrType == 'mx-user-id') {
             const user = MatrixClientPeg.get().getUser(addrObj.address);
             if (user) {
                 addrObj.displayName = user.displayName;
                 addrObj.avatarMxc = user.avatarUrl;
                 addrObj.isKnown = true;
             }
+        } else if (addrType == 'mx-room-id') {
+            const room = MatrixClientPeg.get().getRoom(addrObj.address);
+            if (room) {
+                addrObj.displayName = room.name;
+                addrObj.avatarMxc = room.avatarUrl;
+                addrObj.isKnown = true;
+            }
         }
 
         const userList = this.state.userList.slice();

src/components/views/elements/AddressTile.js

@@ -45,11 +45,12 @@ export default React.createClass({
         const address = this.props.address;
         const name = address.displayName || address.address;
 
-        let imgUrls = [];
+        const imgUrls = [];
+        const isMatrixAddress = ['mx-user-id', 'mx-room-id'].includes(address.addressType);
 
-        if (address.addressType === "mx" && address.avatarMxc) {
+        if (isMatrixAddress && address.avatarMxc) {
             imgUrls.push(MatrixClientPeg.get().mxcUrlToHttp(
-                address.avatarMxc, 25, 25, 'crop'
+                address.avatarMxc, 25, 25, 'crop',
             ));
         } else if (address.addressType === 'email') {
             imgUrls.push('img/icon-email-user.svg');
@@ -77,7 +78,7 @@ export default React.createClass({
 
         let info;
         let error = false;
-        if (address.addressType === "mx" && address.isKnown) {
+        if (isMatrixAddress && address.isKnown) {
             const idClasses = classNames({
                 "mx_AddressTile_id": true,
                 "mx_AddressTile_justified": this.props.justified,
@@ -89,7 +90,7 @@ export default React.createClass({
                     <div className={idClasses}>{ address.address }</div>
                 </div>
             );
-        } else if (address.addressType === "mx") {
+        } else if (isMatrixAddress) {
             const unknownMxClasses = classNames({
                 "mx_AddressTile_unknownMx": true,
                 "mx_AddressTile_justified": this.props.justified,