Fix merge conflict

Signed-off-by: Stefan Parviainen <pafcu@iki.fi>

src/components/views/groups/GroupInviteTile.js

@@ -38,19 +38,17 @@ export default React.createClass({
         const BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
         const EmojiText = sdk.getComponent('elements.EmojiText');
 
-        const av = (
-            <BaseAvatar name={this.props.group.name} width={24} height={24}
-                url={this.props.group.avatarUrl}
-            />
-        );
+        const groupName = this.props.group.name || this.props.group.groupId;
+
+        const av = <BaseAvatar name={groupName} width={24} height={24} url={this.props.group.avatarUrl} />;
 
         const label = <EmojiText
             element="div"
-            title={this.props.group.name}
+            title={groupName}
             className="mx_GroupInviteTile_name"
             dir="auto"
         >
-            { this.props.group.name }
+            { groupName }
         </EmojiText>;
 
         const badge = <div className="mx_GroupInviteTile_badge">!</div>;

src/components/views/groups/GroupMemberInfo.js

@@ -68,8 +68,8 @@ module.exports = withMatrixClient(React.createClass({
         const ConfirmUserActionDialog = sdk.getComponent("dialogs.ConfirmUserActionDialog");
         Modal.createDialog(ConfirmUserActionDialog, {
             groupMember: this.props.groupMember,
-            action: _t('Remove from group'),
-            title: _t('Remove this user from group?'),
+            action: _t('Remove from community'),
+            title: _t('Remove this user from community?'),
             danger: true,
             onFinished: (proceed) => {
                 if (!proceed) return;
@@ -87,7 +87,7 @@ module.exports = withMatrixClient(React.createClass({
                     const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                     Modal.createTrackedDialog('Failed to remove user from group', '', ErrorDialog, {
                         title: _t('Error'),
-                        description: _t('Failed to remove user from group'),
+                        description: _t('Failed to remove user from community'),
                     });
                 }).finally(() => {
                     this.setState({removingUser: false});
@@ -129,7 +129,7 @@ module.exports = withMatrixClient(React.createClass({
             kickButton = (
                 <AccessibleButton className="mx_MemberInfo_field"
                         onClick={this._onKick}>
-                    { _t('Remove from group') }
+                    { _t('Remove from community') }
                 </AccessibleButton>
             );
 

src/components/views/groups/GroupMemberList.js

@@ -17,7 +17,7 @@ limitations under the License.
 import React from 'react';
 import { _t } from '../../../languageHandler';
 import sdk from '../../../index';
-import { groupMemberFromApiObject } from '../../../groups';
+import GroupStoreCache from '../../../stores/GroupStoreCache';
 import GeminiScrollbar from 'react-gemini-scrollbar';
 import PropTypes from 'prop-types';
 import withMatrixClient from '../../../wrappers/withMatrixClient';
@@ -27,36 +27,41 @@ const INITIAL_LOAD_NUM_MEMBERS = 30;
 export default withMatrixClient(React.createClass({
     displayName: 'GroupMemberList',
 
-    propTypes: {
+    contextTypes: {
         matrixClient: PropTypes.object.isRequired,
+    },
+
+    propTypes: {
         groupId: PropTypes.string.isRequired,
     },
 
     getInitialState: function() {
         return {
-            fetching: false,
             members: null,
+            invitedMembers: null,
             truncateAt: INITIAL_LOAD_NUM_MEMBERS,
         };
     },
 
     componentWillMount: function() {
         this._unmounted = false;
-        this._fetchMembers();
+        this._initGroupStore(this.props.groupId);
+    },
+
+    _initGroupStore: function(groupId) {
+        this._groupStore = GroupStoreCache.getGroupStore(this.context.matrixClient, groupId);
+        this._groupStore.on('update', () => {
+            this._fetchMembers();
+        });
+        this._groupStore.on('error', (err) => {
+            console.error(err);
+        });
     },
 
     _fetchMembers: function() {
-        this.setState({fetching: true});
-        this.props.matrixClient.getGroupUsers(this.props.groupId).then((result) => {
-            this.setState({
-                members: result.chunk.map((apiMember) => {
-                    return groupMemberFromApiObject(apiMember);
-                }),
-                fetching: false,
-            });
-        }).catch((e) => {
-            this.setState({fetching: false});
-            console.error("Failed to get group member list: " + e);
+        this.setState({
+            members: this._groupStore.getGroupMembers(),
+            invitedMembers: this._groupStore.getGroupInvitedMembers(),
         });
     },
 
@@ -83,11 +88,10 @@ export default withMatrixClient(React.createClass({
         this.setState({ searchQuery: ev.target.value });
     },
 
-    makeGroupMemberTiles: function(query) {
+    makeGroupMemberTiles: function(query, memberList) {
         const GroupMemberTile = sdk.getComponent("groups.GroupMemberTile");
+        const TruncatedList = sdk.getComponent("elements.TruncatedList");
         query = (query || "").toLowerCase();
-
-        let memberList = this.state.members;
         if (query) {
             memberList = memberList.filter((m) => {
                 const matchesName = m.displayname.toLowerCase().indexOf(query) !== -1;
@@ -118,36 +122,45 @@ export default withMatrixClient(React.createClass({
             }
         });
 
-        return memberList;
+        return <TruncatedList className="mx_MemberList_wrapper" truncateAt={this.state.truncateAt}
+            createOverflowElement={this._createOverflowTile}
+        >
+            { memberList }
+        </TruncatedList>;
     },
 
     render: function() {
-        if (this.state.fetching) {
+        if (this.state.fetching || this.state.fetchingInvitedMembers) {
             const Spinner = sdk.getComponent("elements.Spinner");
             return (<div className="mx_MemberList">
                 <Spinner />
             </div>);
-        } else if (this.state.members === null) {
-            return null;
         }
 
         const inputBox = (
             <form autoComplete="off">
                 <input className="mx_GroupMemberList_query" id="mx_GroupMemberList_query" type="text"
                         onChange={this.onSearchQueryChanged} value={this.state.searchQuery}
-                        placeholder={_t('Filter group members')} />
+                        placeholder={_t('Filter community members')} />
             </form>
         );
 
-        const TruncatedList = sdk.getComponent("elements.TruncatedList");
+        const joined = this.state.members ? <div className="mx_MemberList_joined">
+            { this.makeGroupMemberTiles(this.state.searchQuery, this.state.members) }
+        </div> : <div />;
+
+        const invited = (this.state.invitedMembers && this.state.invitedMembers.length > 0) ?
+            <div className="mx_MemberList_invited">
+                <h2>{ _t("Invited") }</h2>
+                { this.makeGroupMemberTiles(this.state.searchQuery, this.state.invitedMembers) }
+            </div> : <div />;
+
         return (
             <div className="mx_MemberList">
                 { inputBox }
-                <GeminiScrollbar autoshow={true} className="mx_MemberList_joined mx_MemberList_outerWrapper">
-                    <TruncatedList className="mx_MemberList_wrapper" truncateAt={this.state.truncateAt}
-                            createOverflowElement={this._createOverflowTile}>
-                        { this.makeGroupMemberTiles(this.state.searchQuery) }
-                    </TruncatedList>
+                <GeminiScrollbar autoshow={true} className="mx_MemberList_outerWrapper">
+                    { joined }
+                    { invited }
                 </GeminiScrollbar>
             </div>
         );

src/components/views/groups/GroupRoomList.js

@@ -16,7 +16,6 @@ limitations under the License.
 import React from 'react';
 import { _t } from '../../../languageHandler';
 import sdk from '../../../index';
-import { groupRoomFromApiObject } from '../../../groups';
 import GroupStoreCache from '../../../stores/GroupStoreCache';
 import GeminiScrollbar from 'react-gemini-scrollbar';
 import PropTypes from 'prop-types';
@@ -63,9 +62,7 @@ export default React.createClass({
     _fetchRooms: function() {
         if (this._unmounted) return;
         this.setState({
-            rooms: this._groupStore.getGroupRooms().map((apiRoom) => {
-                return groupRoomFromApiObject(apiRoom);
-            }),
+            rooms: this._groupStore.getGroupRooms(),
         });
     },
 
@@ -126,7 +123,7 @@ export default React.createClass({
             <form autoComplete="off">
                 <input className="mx_GroupRoomList_query" id="mx_GroupRoomList_query" type="text"
                         onChange={this.onSearchQueryChanged} value={this.state.searchQuery}
-                        placeholder={_t('Filter group rooms')} />
+                        placeholder={_t('Filter community rooms')} />
             </form>
         );
 

src/components/views/groups/GroupRoomTile.js

@@ -58,7 +58,7 @@ const GroupRoomTile = React.createClass({
                 console.error(`Error whilst removing ${roomId} from ${groupId}`, err);
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createTrackedDialog('Failed to remove room from group', '', ErrorDialog, {
-                    title: _t("Failed to remove room from group"),
+                    title: _t("Failed to remove room from community"),
                     description: _t("Failed to remove '%(roomName)s' from %(groupId)s", {groupId, roomName}),
                 });
             });
@@ -87,7 +87,7 @@ const GroupRoomTile = React.createClass({
         const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
         Modal.createTrackedDialog('Confirm removal of group from room', '', QuestionDialog, {
             title: _t("Are you sure you want to remove '%(roomName)s' from %(groupId)s?", {roomName, groupId}),
-            description: _t("Removing a room from the group will also remove it from the group page."),
+            description: _t("Removing a room from the community will also remove it from the community page."),
             button: _t("Remove"),
             onFinished: (success) => {
                 if (success) {