Show invited members separately.

May not be the final look.

Fixes #6
This commit is contained in:
David Baker 2015-10-06 15:09:42 +01:00
parent 807e947146
commit fca65a8cdb
1 changed files with 24 additions and 6 deletions

View File

@ -33,11 +33,14 @@ module.exports = React.createClass({
return { editing: false }; return { editing: false };
}, },
makeMemberTiles: function() { makeMemberTiles: function(membership) {
var MemberTile = sdk.getComponent("molecules.MemberTile"); var MemberTile = sdk.getComponent("molecules.MemberTile");
var self = this; var self = this;
return Object.keys(self.state.memberDict).map(function(userId) { return Object.keys(self.state.memberDict).filter(function(userId) {
var m = self.state.memberDict[userId];
return m.membership == membership;
}).map(function(userId) {
var m = self.state.memberDict[userId]; var m = self.state.memberDict[userId];
return ( return (
<MemberTile key={userId} member={m} ref={userId} /> <MemberTile key={userId} member={m} ref={userId} />
@ -87,17 +90,32 @@ module.exports = React.createClass({
}, },
render: function() { render: function() {
var invitedSection = null;
var invitedMemberTiles = this.makeMemberTiles('invite');
if (invitedMemberTiles.length > 0) {
invitedSection = (
<div>
<h2>Invited</h2>
<div className="mx_MemberList_wrapper">
{invitedMemberTiles}
</div>
</div>
);
}
return ( return (
<div className="mx_MemberList"> <div className="mx_MemberList">
<div className="mx_MemberList_chevron"> <div className="mx_MemberList_chevron">
<img src="img/chevron.png" width="24" height="13"/> <img src="img/chevron.png" width="24" height="13"/>
</div> </div>
<div className="mx_MemberList_border"> <div className="mx_MemberList_border">
<h2>Members</h2> <div>
<div className="mx_MemberList_wrapper"> <h2>Members</h2>
{this.makeMemberTiles()} <div className="mx_MemberList_wrapper">
{this.inviteTile()} {this.makeMemberTiles('join')}
</div>
</div> </div>
{invitedSection}
{this.inviteTile()}
</div> </div>
</div> </div>
); );