mirror of
https://github.com/element-hq/element-web
synced 2024-11-27 03:36:07 +03:00
Add function to determine if a user can modify widgets and style UI components as a result.
This commit is contained in:
parent
27923e300c
commit
ab7fcbb5e7
1 changed files with 68 additions and 16 deletions
|
@ -98,6 +98,29 @@ export default React.createClass({
|
|||
});
|
||||
},
|
||||
|
||||
_canUserModify: function() {
|
||||
let canModify = false;
|
||||
const client = MatrixClientPeg.get();
|
||||
// const warningMsg = 'User can not modify widgets:';
|
||||
if (client) {
|
||||
const room = client.getRoom(this.props.room.roomId);
|
||||
const me = client.credentials.userId;
|
||||
if(room && me) {
|
||||
const member = room.getMember(me);
|
||||
if (member && member.membership === "join") {
|
||||
canModify = room.currentState.maySendStateEvent('set_widget', me);
|
||||
// } else {
|
||||
// console.warn(warningMsg, 'Not room member');
|
||||
}
|
||||
// } else {
|
||||
// console.warn(warningMsg, 'No roomId or userId');
|
||||
}
|
||||
// } else {
|
||||
// console.warn(warningMsg, 'No Matrix client');
|
||||
}
|
||||
return canModify;
|
||||
},
|
||||
|
||||
_onEditClick: function(e) {
|
||||
console.log("Edit widget ID ", this.props.id);
|
||||
const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager");
|
||||
|
@ -107,20 +130,34 @@ export default React.createClass({
|
|||
}, "mx_IntegrationsManager");
|
||||
},
|
||||
|
||||
/* If user has permission to modify widgets, delete the widget, otherwise revoke access for the widget to load in the user's browser
|
||||
*/
|
||||
_onDeleteClick: function() {
|
||||
console.log("Delete widget %s", this.props.id);
|
||||
this.setState({deleting: true});
|
||||
MatrixClientPeg.get().sendStateEvent(
|
||||
this.props.room.roomId,
|
||||
'im.vector.modular.widgets',
|
||||
{}, // empty content
|
||||
this.props.id,
|
||||
).then(() => {
|
||||
console.log('Deleted widget');
|
||||
}, (e) => {
|
||||
console.error('Failed to delete widget', e);
|
||||
this.setState({deleting: false});
|
||||
});
|
||||
if (this._canUserModify()) {
|
||||
console.log("Delete widget %s", this.props.id);
|
||||
this.setState({deleting: true});
|
||||
MatrixClientPeg.get().sendStateEvent(
|
||||
this.props.room.roomId,
|
||||
'im.vector.modular.widgets',
|
||||
{}, // empty content
|
||||
this.props.id,
|
||||
).then(() => {
|
||||
console.log('Deleted widget');
|
||||
}, (e) => {
|
||||
console.error('Failed to delete widget', e);
|
||||
this.setState({deleting: false});
|
||||
});
|
||||
} else {
|
||||
console.log("Revoke widget permissions - %s", this.props.id);
|
||||
this._revokeWidgetPermission();
|
||||
}
|
||||
},
|
||||
|
||||
_deleteWidgetLabel() {
|
||||
if (this._canUserModify()) {
|
||||
return 'Delete widget';
|
||||
}
|
||||
return 'Revoke widget access';
|
||||
},
|
||||
|
||||
_grantWidgetPermission() {
|
||||
|
@ -129,6 +166,12 @@ export default React.createClass({
|
|||
this.setState({hasPermissionToLoad: true});
|
||||
},
|
||||
|
||||
_revokeWidgetPermission() {
|
||||
console.warn('Revoking permission to load widget - ', this.state.widgetUrl);
|
||||
localStorage.removeItem(this.state.widgetPermissionId);
|
||||
this.setState({hasPermissionToLoad: false});
|
||||
},
|
||||
|
||||
formatAppTileName: function() {
|
||||
let appTileName = "No name";
|
||||
if(this.props.name && this.props.name.trim()) {
|
||||
|
@ -189,6 +232,13 @@ export default React.createClass({
|
|||
|
||||
// editing is done in scalar
|
||||
const showEditButton = Boolean(this._scalarClient);
|
||||
const deleteWidgetLabel = this._deleteWidgetLabel();
|
||||
let deleteIcon = 'img/cancel.svg';
|
||||
let deleteClasses = 'mx_filterFlipColor mx_AppTileMenuBarWidget';
|
||||
if(this._canUserModify()) {
|
||||
deleteIcon = 'img/cancel-red.svg';
|
||||
deleteClasses += ' mx_AppTileMenuBarWidgetDelete';
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={this.props.fullWidth ? "mx_AppTileFullWidth" : "mx_AppTile"} id={this.props.id}>
|
||||
|
@ -205,9 +255,11 @@ export default React.createClass({
|
|||
/>}
|
||||
|
||||
{/* Delete widget */}
|
||||
<img src="img/cancel.svg"
|
||||
className="mx_filterFlipColor mx_AppTileMenuBarWidget"
|
||||
width="8" height="8" alt={_t("Cancel")}
|
||||
<img src={deleteIcon}
|
||||
className={deleteClasses}
|
||||
width="8" height="8"
|
||||
alt={_t(deleteWidgetLabel)}
|
||||
title={_t(deleteWidgetLabel)}
|
||||
onClick={this._onDeleteClick}
|
||||
/>
|
||||
</span>
|
||||
|
|
Loading…
Reference in a new issue