Disable removal of items if the user doesn't have permission

This commit is contained in:
Travis Ralston 2019-02-21 17:15:25 -07:00
parent 003d0eb0bf
commit 1e6594ceba
3 changed files with 25 additions and 16 deletions

View file

@ -58,28 +58,29 @@ export class EditableItem extends React.Component {
this.setState({verifyRemove: false}); this.setState({verifyRemove: false});
}; };
render() {if (this.state.verifyRemove) { render() {
return ( if (this.state.verifyRemove) {
<div className="mx_EditableItem"> return (
<div className="mx_EditableItem">
<span className="mx_EditableItem_promptText"> <span className="mx_EditableItem_promptText">
{_t("Are you sure?")} {_t("Are you sure?")}
</span> </span>
<AccessibleButton onClick={this._onActuallyRemove} kind="primary_sm" <AccessibleButton onClick={this._onActuallyRemove} kind="primary_sm"
className="mx_EditableItem_confirmBtn"> className="mx_EditableItem_confirmBtn">
{_t("Yes")} {_t("Yes")}
</AccessibleButton> </AccessibleButton>
<AccessibleButton onClick={this._onDontRemove} kind="danger_sm" <AccessibleButton onClick={this._onDontRemove} kind="danger_sm"
className="mx_EditableItem_confirmBtn"> className="mx_EditableItem_confirmBtn">
{_t("No")} {_t("No")}
</AccessibleButton> </AccessibleButton>
</div> </div>
); );
} }
return ( return (
<div className="mx_EditableItem"> <div className="mx_EditableItem">
<img src={require("../../../../res/img/feather-icons/cancel.svg")} width={14} height={14} <img src={require("../../../../res/img/feather-icons/cancel.svg")} width={14} height={14}
onClick={this._onRemove} className="mx_EditableItem_delete" alt={_t("Remove")} /> onClick={this._onRemove} className="mx_EditableItem_delete" alt={_t("Remove")}/>
<span className="mx_EditableItem_item">{this.props.value}</span> <span className="mx_EditableItem_item">{this.props.value}</span>
</div> </div>
); );
@ -99,6 +100,7 @@ export default class EditableItemList extends React.Component{
onNewItemChanged: PropTypes.func, onNewItemChanged: PropTypes.func,
canEdit: PropTypes.bool, canEdit: PropTypes.bool,
canRemove: PropTypes.bool,
}; };
_onItemAdded = (e) => { _onItemAdded = (e) => {
@ -133,6 +135,10 @@ export default class EditableItemList extends React.Component{
render() { render() {
const editableItems = this.props.items.map((item, index) => { const editableItems = this.props.items.map((item, index) => {
if (!this.props.canRemove) {
return <li>{item}</li>
}
return <EditableItem return <EditableItem
key={index} key={index}
index={index} index={index}
@ -141,13 +147,14 @@ export default class EditableItemList extends React.Component{
/>; />;
}); });
const editableItemsSection = this.props.canRemove ? editableItems : <ul>{editableItems}</ul>;
const label = this.props.items.length > 0 ? this.props.itemsLabel : this.props.noItemsLabel; const label = this.props.items.length > 0 ? this.props.itemsLabel : this.props.noItemsLabel;
return (<div className="mx_EditableItemList"> return (<div className="mx_EditableItemList">
<div className="mx_EditableItemList_label"> <div className="mx_EditableItemList_label">
{ label } { label }
</div> </div>
{ editableItems } { editableItemsSection }
{ this.props.canEdit ? this._renderNewItemField() : <div /> } { this.props.canEdit ? this._renderNewItemField() : <div /> }
</div>); </div>);
} }

View file

@ -240,6 +240,7 @@ export default class AliasSettings extends React.Component {
items={this.state.domainToAliases[localDomain] || []} items={this.state.domainToAliases[localDomain] || []}
newItem={this.state.newAlias} newItem={this.state.newAlias}
onNewItemChanged={this.onNewAliasChanged} onNewItemChanged={this.onNewAliasChanged}
canRemove={this.props.canSetAliases}
canEdit={this.props.canSetAliases} canEdit={this.props.canSetAliases}
onItemAdded={this.onLocalAliasAdded} onItemAdded={this.onLocalAliasAdded}
onItemRemoved={this.onLocalAliasDeleted} onItemRemoved={this.onLocalAliasDeleted}

View file

@ -107,6 +107,7 @@ export default class RelatedGroupSettings extends React.Component {
items={this.state.newGroupsList} items={this.state.newGroupsList}
className={"mx_RelatedGroupSettings"} className={"mx_RelatedGroupSettings"}
newItem={this.state.newGroupId} newItem={this.state.newGroupId}
canRemove={this.props.canSetRelatedGroups}
canEdit={this.props.canSetRelatedGroups} canEdit={this.props.canSetRelatedGroups}
onNewItemChanged={this.onNewGroupChanged} onNewItemChanged={this.onNewGroupChanged}
onItemAdded={this.onGroupAdded} onItemAdded={this.onGroupAdded}