PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Implement removal function of features users/rooms

Browse source 
With the appeareance of a "X" in the top right of each featured item when editing.

NB: No reloading of summary is done after adding/removing a user/room. The plan is to better than threading a callback all the way down.
This commit is contained in:
Luke Barnard 2017-09-22 15:55:42 +01:00
parent b5f141456c
commit 3f9d20de97
2 changed files with 89 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -111,7 +111,11 @@ const CategoryRoomList = React.createClass({
</AccessibleButton>) : <div />;
const roomNodes = this.props.rooms.map((r) => {
return <FeaturedRoom key={r.room_id} summaryInfo={r} />;
return <FeaturedRoom
key={r.room_id}
groupId={this.props.groupId}
editing={this.props.editing}
summaryInfo={r}/>;
});
let catHeader = <div />;
@ -131,6 +135,8 @@ const FeaturedRoom = React.createClass({
props: {
summaryInfo: RoomSummaryType.isRequired,
editing: PropTypes.bool.isRequired,
groupId: PropTypes.string.isRequired,
},
onClick: function(e) {
@ -144,6 +150,31 @@ const FeaturedRoom = React.createClass({
});
},
onDeleteClicked: function(e) {
e.preventDefault();
e.stopPropagation();
MatrixClientPeg.get().removeRoomFromGroupSummary(
this.props.groupId,
this.props.summaryInfo.room_id,
).catch((err) => {
console.error('Error whilst removing room from group summary', err);
const roomName = this.props.summaryInfo.name ||
this.props.summaryInfo.canonical_alias ||
this.props.summaryInfo.room_id;
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createTrackedDialog(
'Failed to remove room from group summary',
'', ErrorDialog,
{
title: _t(
"Failed to remove the room from the summary of %(groupId)s",
{groupId: this.props.groupId},
),
description: _t("The room '%(roomName)s' could not be removed from the summary.", {roomName}),
});
});
},
render: function() {
const RoomAvatar = sdk.getComponent("avatars.RoomAvatar");
@ -163,9 +194,20 @@ const FeaturedRoom = React.createClass({
roomNameNode = <span>{this.props.summaryInfo.profile.name}</span>;
}
const deleteButton = this.props.editing ?
<img
className="mx_GroupView_featuredThing_deleteButton"
src="img/cancel-small.svg"
width="14"
height="14"
alt="Delete"
onClick={this.onDeleteClicked}/>
: <div />;
return <AccessibleButton className="mx_GroupView_featuredThing" onClick={this.onClick}>
<RoomAvatar oobData={oobData} width={64} height={64} />
<div className="mx_GroupView_featuredThing_name">{roomNameNode}</div>
{deleteButton}
</AccessibleButton>;
},
});
@ -234,7 +276,11 @@ const RoleUserList = React.createClass({
</div>
</AccessibleButton>) : <div />;
const userNodes = this.props.users.map((u) => {
return <FeaturedUser key={u.user_id} summaryInfo={u} />;
return <FeaturedUser
key={u.user_id}
summaryInfo={u}
editing={this.props.editing}
groupId={this.props.groupId}/>;
});
let roleHeader = <div />;
if (this.props.role && this.props.role.profile) {
@ -253,6 +299,8 @@ const FeaturedUser = React.createClass({
props: {
summaryInfo: UserSummaryType.isRequired,
editing: PropTypes.bool.isRequired,
groupId: PropTypes.string.isRequired,
},
onClick: function(e) {
@ -266,6 +314,29 @@ const FeaturedUser = React.createClass({
});
},
onDeleteClicked: function(e) {
e.preventDefault();
e.stopPropagation();
MatrixClientPeg.get().removeUserFromGroupSummary(
this.props.groupId,
this.props.summaryInfo.user_id,
).catch((err) => {
console.error('Error whilst removing user from group summary', err);
const displayName = this.props.summaryInfo.displayname || this.props.summaryInfo.user_id;
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createTrackedDialog(
'Failed to remove user from group summary',
'', ErrorDialog,
{
title: _t(
"Failed to remove a user from the summary of %(groupId)s",
{groupId: this.props.groupId},
),
description: _t("The user '%(displayName)s' could not be removed from the summary.", {displayName}),
});
});
},
render: function() {
const BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
const name = this.props.summaryInfo.displayname || this.props.summaryInfo.user_id;
@ -275,9 +346,20 @@ const FeaturedUser = React.createClass({
const httpUrl = MatrixClientPeg.get()
.mxcUrlToHttp(this.props.summaryInfo.avatar_url, 64, 64);
const deleteButton = this.props.editing ?
<img
className="mx_GroupView_featuredThing_deleteButton"
src="img/cancel-small.svg"
width="14"
height="14"
alt="Delete"
onClick={this.onDeleteClicked}/>
: <div />;
return <AccessibleButton className="mx_GroupView_featuredThing" onClick={this.onClick}>
<BaseAvatar name={name} url={httpUrl} width={64} height={64} />
<div className="mx_GroupView_featuredThing_name">{userNameNode}</div>
{deleteButton}
</AccessibleButton>;
},
});

6
src/i18n/strings/en_EN.json
View file

@ -896,5 +896,9 @@
"Add rooms to the group summary": "Add rooms to the group summary",
"Which rooms would you like to add to this summary?": "Which rooms would you like to add to this summary?",
"Room name or alias": "Room name or alias",
"You are an administrator of this group": "You are an administrator of this group"
"You are an administrator of this group": "You are an administrator of this group",
"Failed to remove the room from the summary of %(groupId)s": "Failed to remove the room from the summary of %(groupId)s",
"The room '%(roomName)' could not be removed from the summary.": "The room '%(roomName)' could not be removed from the summary."
"Failed to remove a user from the summary of %(groupId)s": "Failed to remove a user from the summary of %(groupId)s",
"The user '%(displayName)s' could not be removed from the summary.": "The user '%(displayName)s' could not be removed from the summary."
}