imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Only show "Add" button when editing the group

Browse source
This commit is contained in:
Luke Barnard 2017-09-21 12:44:17 +01:00
parent 4d9c43b3c8
commit 3f0e596e97
1 changed files with 34 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/components/structures/GroupView.js
View file

@ -55,6 +55,9 @@ const CategoryRoomList = React.createClass({
name: PropTypes.string, name: PropTypes.string,
}).isRequired, }).isRequired,
}), }),
// Whether the list should be editable
editing: PropTypes.bool.isRequired,
}, },
render: function() { render: function() {
@ -136,6 +139,9 @@ const RoleUserList = React.createClass({
}).isRequired, }).isRequired,
}), }),
groupId: PropTypes.string.isRequired, groupId: PropTypes.string.isRequired,
// Whether the list should be editable
editing: PropTypes.bool.isRequired,
}, },
onAddUsersClicked: function(ev) { onAddUsersClicked: function(ev) {
@ -178,6 +184,13 @@ const RoleUserList = React.createClass({
render: function() { render: function() {
const TintableSvg = sdk.getComponent("elements.TintableSvg"); const TintableSvg = sdk.getComponent("elements.TintableSvg");
const addButton = this.props.editing ?
(<AccessibleButton className="mx_GroupView_featuredThings_addButton" onClick={this.onAddUsersClicked}>
<TintableSvg src="img/icons-create-room.svg" width="64" height="64"/>
<div className="mx_GroupView_featuredThings_addButton_label">
{_t('Add a User')}
</div>
</AccessibleButton>) : null;
const userNodes = this.props.users.map((u) => { const userNodes = this.props.users.map((u) => {
return <FeaturedUser key={u.user_id} summaryInfo={u} />; return <FeaturedUser key={u.user_id} summaryInfo={u} />;
}); });
@ -188,12 +201,7 @@ const RoleUserList = React.createClass({
return <div className="mx_GroupView_featuredThings_container"> return <div className="mx_GroupView_featuredThings_container">
{roleHeader} {roleHeader}
{userNodes} {userNodes}
<AccessibleButton className="mx_GroupView_featuredThings_addButton" onClick={this.onAddUsersClicked}> {addButton}
<TintableSvg src="img/icons-create-room.svg" width="64" height="64"/>
<div className="mx_GroupView_featuredThings_addButton_label">
{_t('Add a User')}
</div>
</AccessibleButton>
</div>; </div>;
}, },
}); });
@ -446,10 +454,16 @@ export default React.createClass({
} }
}); });
const defaultCategoryNode = <CategoryRoomList rooms={defaultCategoryRooms} />; const defaultCategoryNode = <CategoryRoomList
rooms={defaultCategoryRooms}
editing={this.state.editing}/>;
const categoryRoomNodes = Object.keys(categoryRooms).map((catId) => { const categoryRoomNodes = Object.keys(categoryRooms).map((catId) => {
const cat = summary.rooms_section.categories[catId]; const cat = summary.rooms_section.categories[catId];
return <CategoryRoomList key={catId} rooms={categoryRooms[catId]} category={cat} />; return <CategoryRoomList
key={catId}
rooms={categoryRooms[catId]}
category={cat}
editing={this.state.editing}/>;
}); });
return <div className="mx_GroupView_featuredThings"> return <div className="mx_GroupView_featuredThings">
@ -479,10 +493,18 @@ export default React.createClass({
} }
}); });
const noRoleNode = <RoleUserList users={noRoleUsers} groupId={this.props.groupId}/>; const noRoleNode = <RoleUserList
users={noRoleUsers}
groupId={this.props.groupId}
editing={this.state.editing}/>;
const roleUserNodes = Object.keys(roleUsers).map((roleId) => { const roleUserNodes = Object.keys(roleUsers).map((roleId) => {
const role = summary.users_section.roles[roleId]; const role = summary.users_section.roles[roleId];
return <RoleUserList key={roleId} users={roleUsers[roleId]} role={role} groupId={this.props.groupId}/>; return <RoleUserList
key={roleId}
users={roleUsers[roleId]}
role={role}
groupId={this.props.groupId}
editing={this.state.editing}/>;
}); });
return <div className="mx_GroupView_featuredThings"> return <div className="mx_GroupView_featuredThings">
@ -613,6 +635,8 @@ export default React.createClass({
onChange={this._onLongDescChange} onChange={this._onLongDescChange}
tabIndex="3" tabIndex="3"
/> />
{this._getFeaturedRoomsNode()}
{this._getFeaturedUsersNode()}
</div>; </div>;
} else { } else {
const groupAvatarUrl = summary.profile ? summary.profile.avatar_url : null; const groupAvatarUrl = summary.profile ? summary.profile.avatar_url : null;