OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Hide remove target buttons when busy 

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
pull/21833/head
Michael Telatynski 2020-03-18 21:16:41 +00:00
parent dd9ead0166
commit 963c0a7b3f
1 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/views/dialogs/InviteDialog.js
View File

@ -126,7 +126,7 @@ class ThreepidMember extends Member {
class DMUserTile extends React.PureComponent { class DMUserTile extends React.PureComponent {
static propTypes = { static propTypes = {
member: PropTypes.object.isRequired, // Should be a Member (see interface above) member: PropTypes.object.isRequired, // Should be a Member (see interface above)
onRemove: PropTypes.func.isRequired, // takes 1 argument, the member being removed onRemove: PropTypes.func, // takes 1 argument, the member being removed
}; };
_onRemove = (e) => { _onRemove = (e) => {
@ -157,18 +157,25 @@ class DMUserTile extends React.PureComponent {
width={avatarSize} width={avatarSize}
height={avatarSize} />; height={avatarSize} />;
return ( let closeButton;
<span className='mx_InviteDialog_userTile'> if (this.props.onRemove) {
<span className='mx_InviteDialog_userTile_pill'> closeButton = (
{avatar}
<span className='mx_InviteDialog_userTile_name'>{this.props.member.name}</span>
</span>
<AccessibleButton <AccessibleButton
className='mx_InviteDialog_userTile_remove' className='mx_InviteDialog_userTile_remove'
onClick={this._onRemove} onClick={this._onRemove}
> >
<img src={require("../../../../res/img/icon-pill-remove.svg")} alt={_t('Remove')} width={8} height={8} /> <img src={require("../../../../res/img/icon-pill-remove.svg")} alt={_t('Remove')} width={8} height={8} />
</AccessibleButton> </AccessibleButton>
);
}
return (
<span className='mx_InviteDialog_userTile'>
<span className='mx_InviteDialog_userTile_pill'>
{avatar}
<span className='mx_InviteDialog_userTile_name'>{this.props.member.name}</span>
</span>
{ closeButton }
</span> </span>
); );
} }
@ -650,7 +657,9 @@ export default class InviteDialog extends React.PureComponent {
_onKeyDown = (e) => { _onKeyDown = (e) => {
// when the field is empty and the user hits backspace remove the right-most target // when the field is empty and the user hits backspace remove the right-most target
if (!e.target.value && this.state.targets.length > 0 && e.key === Key.BACKSPACE && !e.ctrlKey && !e.shiftKey) { if (!e.target.value && !this.state.busy && this.state.targets.length > 0 && e.key === Key.BACKSPACE &&
!e.ctrlKey && !e.shiftKey && !e.metaKey
) {
e.preventDefault(); e.preventDefault();
this._removeMember(this.state.targets[this.state.targets.length - 1]); this._removeMember(this.state.targets[this.state.targets.length - 1]);
} }
@ -993,7 +1002,7 @@ export default class InviteDialog extends React.PureComponent {
_renderEditor() { _renderEditor() {
const targets = this.state.targets.map(t => ( const targets = this.state.targets.map(t => (
<DMUserTile member={t} onRemove={this._removeMember} key={t.userId} /> <DMUserTile member={t} onRemove={!this.state.busy && this._removeMember} key={t.userId} />
)); ));
const input = ( const input = (
<textarea <textarea