Skip to content

Commit

Permalink
Merge pull request #1534 from matrix-org/t3chguy/invite_in_memberinfo
Browse files Browse the repository at this point in the history 
Add invite button to MemberInfo if user has left or wasn't in room
  • Loading branch information
@dbkr
dbkr committed Oct 26, 2017
2 parents bf42896 + fd7e057 commit 5871a74
Show file tree
Hide file tree
Showing 2 changed files with 55 additions and 16 deletions.
70 changes: 54 additions & 16 deletions src/components/views/rooms/MemberInfo.js
View file
Expand Up @@ -39,6 +39,7 @@ import { findReadReceiptFromUserId } from '../../../utils/Receipt';
import withMatrixClient from '../../../wrappers/withMatrixClient';
import AccessibleButton from '../elements/AccessibleButton';
import GeminiScrollbar from 'react-gemini-scrollbar';
import RoomViewStore from '../../../stores/RoomViewStore';


module.exports = withMatrixClient(React.createClass({
Expand Down Expand Up @@ -81,6 +82,7 @@ module.exports = withMatrixClient(React.createClass({
cli.on("Room.receipt", this.onRoomReceipt);
cli.on("RoomState.events", this.onRoomStateEvents);
cli.on("RoomMember.name", this.onRoomMemberName);
cli.on("RoomMember.membership", this.onRoomMemberMembership);
cli.on("accountData", this.onAccountData);

this._checkIgnoreState();
Expand All @@ -107,6 +109,7 @@ module.exports = withMatrixClient(React.createClass({
client.removeListener("Room.receipt", this.onRoomReceipt);
client.removeListener("RoomState.events", this.onRoomStateEvents);
client.removeListener("RoomMember.name", this.onRoomMemberName);
client.removeListener("RoomMember.membership", this.onRoomMemberMembership);
client.removeListener("accountData", this.onAccountData);
}
if (this._cancelDeviceList) {
Expand Down Expand Up @@ -186,6 +189,10 @@ module.exports = withMatrixClient(React.createClass({
this.forceUpdate();
},

onRoomMemberMembership: function(ev, member) {
if (this.props.member.userId === member.userId) this.forceUpdate();
},

onAccountData: function(ev) {
if (ev.getType() === 'm.direct') {
this.forceUpdate();
Expand Down Expand Up @@ -614,6 +621,7 @@ module.exports = withMatrixClient(React.createClass({
const member = this.props.member;

let ignoreButton = null;
let inviteUserButton = null;
let readReceiptButton = null;

// Only allow the user to ignore the user if its not ourselves
Expand Down Expand Up @@ -644,16 +652,38 @@ module.exports = withMatrixClient(React.createClass({
</AccessibleButton>
);
}

if (!member || !member.membership || member.membership === 'leave') {
const roomId = member && member.roomId ? member.roomId : RoomViewStore.getRoomId();
const onInviteUserButton = async () => {
try {
await cli.invite(roomId, member.userId);
} catch (err) {
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
Modal.createTrackedDialog('Failed to invite', '', ErrorDialog, {
title: _t('Failed to invite'),
description: ((err && err.message) ? err.message : "Operation failed"),
});
}
};

inviteUserButton = (
<AccessibleButton onClick={onInviteUserButton} className="mx_MemberInfo_field">
{ _t('Invite') }
</AccessibleButton>
);
}
}

if (!ignoreButton && !readReceiptButton) return null;
if (!ignoreButton && !readReceiptButton && !inviteUserButton) return null;

return (
<div>
<h3>{ _t("User Options") }</h3>
<div className="mx_MemberInfo_buttons">
{ readReceiptButton }
{ ignoreButton }
{ inviteUserButton }
</div>
</div>
);
Expand Down Expand Up @@ -759,9 +789,6 @@ module.exports = withMatrixClient(React.createClass({
</AccessibleButton>;
}

// TODO: we should have an invite button if this MemberInfo is showing a user who isn't actually in the current room yet
// e.g. clicking on a linkified userid in a room

let adminTools;
if (kickButton || banButton || muteButton || giveModButton) {
adminTools =
Expand Down Expand Up @@ -789,9 +816,29 @@ module.exports = withMatrixClient(React.createClass({
presenceCurrentlyActive = this.props.member.user.currentlyActive;
}

let roomMemberDetails = null;

if (this.props.member.roomId) { // is in room
const PowerSelector = sdk.getComponent('elements.PowerSelector');
const PresenceLabel = sdk.getComponent('rooms.PresenceLabel');
roomMemberDetails = <div>
<div className="mx_MemberInfo_profileField">
{ _t("Level:") } <b>
<PowerSelector controlled={true}
value={parseInt(this.props.member.powerLevel)}
disabled={!this.state.can.modifyLevel}
onChange={this.onPowerChange} />
</b>
</div>
<div className="mx_MemberInfo_profileField">
<PresenceLabel activeAgo={presenceLastActiveAgo}
currentlyActive={presenceCurrentlyActive}
presenceState={presenceState} />
</div>
</div>;
}

const MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
const PowerSelector = sdk.getComponent('elements.PowerSelector');
const PresenceLabel = sdk.getComponent('rooms.PresenceLabel');
const EmojiText = sdk.getComponent('elements.EmojiText');
return (
<div className="mx_MemberInfo">
Expand All @@ -807,16 +854,7 @@ module.exports = withMatrixClient(React.createClass({
<div className="mx_MemberInfo_profileField">
{ this.props.member.userId }
</div>
<div className="mx_MemberInfo_profileField">
{ _t("Level:") } <b>
<PowerSelector controlled={true} value={parseInt(this.props.member.powerLevel)} disabled={!this.state.can.modifyLevel} onChange={this.onPowerChange} />
</b>
</div>
<div className="mx_MemberInfo_profileField">
<PresenceLabel activeAgo={presenceLastActiveAgo}
currentlyActive={presenceCurrentlyActive}
presenceState={presenceState} />
</div>
{ roomMemberDetails }
</div>

{ this._renderUserOptions() }
Expand Down
1 change: 1 addition & 0 deletions src/i18n/strings/en_EN.json
View file
Expand Up @@ -249,6 +249,7 @@
"Level:": "Level:",
"and %(count)s others...|other": "and %(count)s others...",
"and %(count)s others...|one": "and one other...",
"Invite": "Invite",
"Invited": "Invited",
"Filter room members": "Filter room members",
"%(userName)s (power %(powerLevelNumber)s)": "%(userName)s (power %(powerLevelNumber)s)",
Expand Down

0 comments on commit 5871a74

Please sign in to comment.