Merge pull request #1815 from matrix-org/luke/feature-group-join

Join this community button

src/components/structures/GroupView.js

@@ -670,6 +670,20 @@ export default React.createClass({
         });
     },
 
+    _onJoinClick: function() {
+        this.setState({membershipBusy: true});
+        this._matrixClient.joinGroup(this.props.groupId).then(() => {
+            // don't reset membershipBusy here: wait for the membership change to come down the sync
+        }).catch((e) => {
+            this.setState({membershipBusy: false});
+            const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
+            Modal.createTrackedDialog('Error joining room', '', ErrorDialog, {
+                title: _t("Error"),
+                description: _t("Unable to join community"),
+            });
+        });
+    },
+
     _onLeaveClick: function() {
         const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
         Modal.createTrackedDialog('Leave Group', '', QuestionDialog, {
@@ -686,9 +700,9 @@ export default React.createClass({
                 }).catch((e) => {
                     this.setState({membershipBusy: false});
                     const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
-                    Modal.createTrackedDialog('Error leaving room', '', ErrorDialog, {
+                    Modal.createTrackedDialog('Error leaving community', '', ErrorDialog, {
                         title: _t("Error"),
-                        description: _t("Unable to leave room"),
+                        description: _t("Unable to leave community"),
                     });
                 });
             },
@@ -859,9 +873,8 @@ export default React.createClass({
         const BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
 
         const group = this._matrixClient.getGroup(this.props.groupId);
-        if (!group) return null;
 
-        if (group.myMembership === 'invite') {
+        if (group && group.myMembership === 'invite') {
             if (this.state.membershipBusy || this.state.inviterProfileBusy) {
                 return <div className="mx_GroupView_membershipSection">
                     <Spinner />
@@ -902,33 +915,72 @@ export default React.createClass({
                     </div>
                 </div>
             </div>;
-        } else if (group.myMembership === 'join' && this.state.editing) {
+        }
-            const leaveButtonTooltip = this.state.isUserPrivileged ?
+
+        let membershipContainerExtraClasses;
+        let membershipButtonExtraClasses;
+        let membershipButtonTooltip;
+        let membershipButtonText;
+        let membershipButtonOnClick;
+
+        // User is not in the group
+        if ((!group || group.myMembership === 'leave') &&
+            this.state.summary &&
+            this.state.summary.profile &&
+            Boolean(this.state.summary.profile.is_joinable)
+        ) {
+            membershipButtonText = _t("Join this community");
+            membershipButtonOnClick = this._onJoinClick;
+
+            membershipButtonExtraClasses = 'mx_GroupView_joinButton';
+            membershipContainerExtraClasses = 'mx_GroupView_membershipSection_leave';
+        } else if (
+            group &&
+            group.myMembership === 'join' &&
+            this.state.editing
+        ) {
+            membershipButtonText = _t("Leave this community");
+            membershipButtonOnClick = this._onLeaveClick;
+            membershipButtonTooltip = this.state.isUserPrivileged ?
                 _t("You are an administrator of this community") :
                 _t("You are a member of this community");
-            const leaveButtonClasses = classnames({
+
-                "mx_RoomHeader_textButton": true,
+            membershipButtonExtraClasses = {
-                "mx_GroupView_textButton": true,
+                'mx_GroupView_leaveButton': true,
-                "mx_GroupView_leaveButton": true,
+                'mx_RoomHeader_textButton_danger': this.state.isUserPrivileged,
-                "mx_RoomHeader_textButton_danger": this.state.isUserPrivileged,
+            };
-            });
+            membershipContainerExtraClasses = 'mx_GroupView_membershipSection_joined';
-            return <div className="mx_GroupView_membershipSection mx_GroupView_membershipSection_joined">
+        } else {
-                <div className="mx_GroupView_membershipSubSection">
+            return null;
-                    { /* Empty div for flex alignment */ }
-                    <div />
-                    <div className="mx_GroupView_membership_buttonContainer">
-                        <AccessibleButton
-                            className={leaveButtonClasses}
-                            onClick={this._onLeaveClick}
-                            title={leaveButtonTooltip}
-                        >
-                            { _t("Leave") }
-                        </AccessibleButton>
-                    </div>
-                </div>
-            </div>;
         }
-        return null;
+
+        const membershipButtonClasses = classnames([
+            'mx_RoomHeader_textButton',
+            'mx_GroupView_textButton',
+        ],
+            membershipButtonExtraClasses,
+        );
+
+        const membershipContainerClasses = classnames(
+            'mx_GroupView_membershipSection',
+            membershipContainerExtraClasses,
+        );
+
+        return <div className={membershipContainerClasses}>
+            <div className="mx_GroupView_membershipSubSection">
+                { /* Empty div for flex alignment */ }
+                <div />
+                <div className="mx_GroupView_membership_buttonContainer">
+                    <AccessibleButton
+                        className={membershipButtonClasses}
+                        onClick={membershipButtonOnClick}
+                        title={membershipButtonTooltip}
+                    >
+                        { membershipButtonText }
+                    </AccessibleButton>
+                </div>
+            </div>
+        </div>;
     },
 
     _getLongDescriptionNode: function() {

src/i18n/strings/en_EN.json

@@ -38,10 +38,6 @@
     "The file '%(fileName)s' failed to upload": "The file '%(fileName)s' failed to upload",
     "The file '%(fileName)s' exceeds this home server's size limit for uploads": "The file '%(fileName)s' exceeds this home server's size limit for uploads",
     "Upload Failed": "Upload Failed",
-    "Failure to create room": "Failure to create room",
-    "Server may be unavailable, overloaded, or you hit a bug.": "Server may be unavailable, overloaded, or you hit a bug.",
-    "Send anyway": "Send anyway",
-    "Send": "Send",
     "Sun": "Sun",
     "Mon": "Mon",
     "Tue": "Tue",
@@ -81,7 +77,6 @@
     "Failed to invite users to community": "Failed to invite users to community",
     "Failed to invite users to %(groupId)s": "Failed to invite users to %(groupId)s",
     "Failed to add the following rooms to %(groupId)s:": "Failed to add the following rooms to %(groupId)s:",
-    "Unnamed Room": "Unnamed Room",
     "Riot does not have permission to send you notifications - please check your browser settings": "Riot does not have permission to send you notifications - please check your browser settings",
     "Riot was not given permission to send notifications - please try again": "Riot was not given permission to send notifications - please try again",
     "Unable to enable Notifications": "Unable to enable Notifications",
@@ -179,6 +174,11 @@
     "%(names)s and %(count)s others are typing|other": "%(names)s and %(count)s others are typing",
     "%(names)s and %(count)s others are typing|one": "%(names)s and one other is typing",
     "%(names)s and %(lastPerson)s are typing": "%(names)s and %(lastPerson)s are typing",
+    "Failure to create room": "Failure to create room",
+    "Server may be unavailable, overloaded, or you hit a bug.": "Server may be unavailable, overloaded, or you hit a bug.",
+    "Send anyway": "Send anyway",
+    "Send": "Send",
+    "Unnamed Room": "Unnamed Room",
     "Your browser does not support the required cryptography extensions": "Your browser does not support the required cryptography extensions",
     "Not a valid Riot keyfile": "Not a valid Riot keyfile",
     "Authentication check failed: incorrect password?": "Authentication check failed: incorrect password?",
@@ -186,7 +186,6 @@
     "Message Replies": "Message Replies",
     "Message Pinning": "Message Pinning",
     "Presence Management": "Presence Management",
-    "Tag Panel": "Tag Panel",
     "Disable Emoji suggestions while typing": "Disable Emoji suggestions while typing",
     "Use compact timeline layout": "Use compact timeline layout",
     "Hide removed messages": "Hide removed messages",
@@ -253,29 +252,6 @@
     "Failed to set display name": "Failed to set display name",
     "Disable Notifications": "Disable Notifications",
     "Enable Notifications": "Enable Notifications",
-    "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 <a>enabled</a> URL previews by default.": "You have <a>enabled</a> URL previews by default.",
-    "You have <a>disabled</a> URL previews by default.": "You have <a>disabled</a> 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.",
-    "URL Previews": "URL Previews",
     "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",
@@ -371,11 +347,11 @@
     "numbullet": "numbullet",
     "Markdown is disabled": "Markdown is disabled",
     "Markdown is enabled": "Markdown is enabled",
+    "Unpin Message": "Unpin Message",
+    "Jump to message": "Jump to message",
     "No pinned messages.": "No pinned messages.",
     "Loading...": "Loading...",
     "Pinned Messages": "Pinned Messages",
-    "Unpin Message": "Unpin Message",
-    "Jump to message": "Jump to message",
     "%(duration)ss": "%(duration)ss",
     "%(duration)sm": "%(duration)sm",
     "%(duration)sh": "%(duration)sh",
@@ -498,6 +474,29 @@
     "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 <a>enabled</a> URL previews by default.": "You have <a>enabled</a> URL previews by default.",
+    "You have <a>disabled</a> URL previews by default.": "You have <a>disabled</a> 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.",
+    "URL Previews": "URL Previews",
     "Error decrypting audio": "Error decrypting audio",
     "Error decrypting attachment": "Error decrypting attachment",
     "Decrypt %(text)s": "Decrypt %(text)s",
@@ -763,10 +762,11 @@
     "Failed to update community": "Failed to update community",
     "Unable to accept invite": "Unable to accept invite",
     "Unable to reject invite": "Unable to reject invite",
+    "Unable to join community": "Unable to join community",
     "Leave Community": "Leave Community",
     "Leave %(groupName)s?": "Leave %(groupName)s?",
     "Leave": "Leave",
-    "Unable to leave room": "Unable to leave room",
+    "Unable to leave community": "Unable to leave community",
     "Community Settings": "Community Settings",
     "Changes made to your community <bold1>name</bold1> and <bold2>avatar</bold2> might not be seen by other users for up to 30 minutes.": "Changes made to your community <bold1>name</bold1> and <bold2>avatar</bold2> might not be seen by other users for up to 30 minutes.",
     "These rooms are displayed to community members on the community page. Community members can join the rooms by clicking on them.": "These rooms are displayed to community members on the community page. Community members can join the rooms by clicking on them.",
@@ -774,8 +774,10 @@
     "Featured Rooms:": "Featured Rooms:",
     "Featured Users:": "Featured Users:",
     "%(inviter)s has invited you to join this community": "%(inviter)s has invited you to join this community",
+    "Join this community": "Join this community",
     "You are an administrator of this community": "You are an administrator of this community",
     "You are a member of this community": "You are a member of this community",
+    "Leave this community": "Leave this community",
     "Your community hasn't got a Long Description, a HTML page to show to community members.<br />Click here to open settings and give it one!": "Your community hasn't got a Long Description, a HTML page to show to community members.<br />Click here to open settings and give it one!",
     "Long Description (HTML)": "Long Description (HTML)",
     "Description": "Description",