From 7b75dbbd15d621df14fb292716d0c499b8ac198e Mon Sep 17 00:00:00 2001 From: Richard Lewis Date: Wed, 7 Feb 2018 14:44:01 +0000 Subject: [PATCH] Use default AppTile menu bar. --- src/components/views/elements/AppTile.js | 109 ++++++++++++++-------- src/components/views/rooms/Stickerpack.js | 31 ++---- 2 files changed, 79 insertions(+), 61 deletions(-) diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index 582cc01a57..c96ce9f775 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -274,12 +274,16 @@ export default class AppTile extends React.Component { _onEditClick(e) { console.log("Edit widget ID ", this.props.id); - const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager"); - const src = this._scalarClient.getScalarInterfaceUrlForRoom( - this.props.room.roomId, 'type_' + this.props.type, this.props.id); - Modal.createTrackedDialog('Integrations Manager', '', IntegrationsManager, { - src: src, - }, "mx_IntegrationsManager"); + if (this.props.onEditClick) { + this.props.onEditClick(); + } else { + const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager"); + const src = this._scalarClient.getScalarInterfaceUrlForRoom( + this.props.room.roomId, 'type_' + this.props.type, this.props.id); + Modal.createTrackedDialog('Integrations Manager', '', IntegrationsManager, { + src: src, + }, "mx_IntegrationsManager"); + } } _onSnapshotClick(e) { @@ -298,34 +302,38 @@ export default class AppTile extends React.Component { * otherwise revoke access for the widget to load in the user's browser */ _onDeleteClick() { - if (this._canUserModify()) { - // Show delete confirmation dialog - const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog"); - Modal.createTrackedDialog('Delete Widget', '', QuestionDialog, { - title: _t("Delete Widget"), - description: _t( - "Deleting a widget removes it for all users in this room." + - " Are you sure you want to delete this widget?"), - button: _t("Delete widget"), - onFinished: (confirmed) => { - if (!confirmed) { - return; - } - this.setState({deleting: true}); - MatrixClientPeg.get().sendStateEvent( - this.props.room.roomId, - 'im.vector.modular.widgets', - {}, // empty content - this.props.id, - ).catch((e) => { - console.error('Failed to delete widget', e); - this.setState({deleting: false}); - }); - }, - }); + if (this.props.onDeleteClick) { + this.props.onDeleteClick(); } else { - console.log("Revoke widget permissions - %s", this.props.id); - this._revokeWidgetPermission(); + if (this._canUserModify()) { + // Show delete confirmation dialog + const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog"); + Modal.createTrackedDialog('Delete Widget', '', QuestionDialog, { + title: _t("Delete Widget"), + description: _t( + "Deleting a widget removes it for all users in this room." + + " Are you sure you want to delete this widget?"), + button: _t("Delete widget"), + onFinished: (confirmed) => { + if (!confirmed) { + return; + } + this.setState({deleting: true}); + MatrixClientPeg.get().sendStateEvent( + this.props.room.roomId, + 'im.vector.modular.widgets', + {}, // empty content + this.props.id, + ).catch((e) => { + console.error('Failed to delete widget', e); + this.setState({deleting: false}); + }); + }, + }); + } else { + console.log("Revoke widget permissions - %s", this.props.id); + this._revokeWidgetPermission(); + } } } @@ -429,6 +437,22 @@ export default class AppTile extends React.Component { return safeWidgetUrl; } + _getTileTitle() { + const name = this.formatAppTileName(); + const titleSpacer =  - ; + let title = ''; + if (this.state.widgetPageTitle && this.state.widgetPageTitle != this.formatAppTileName()) { + title = this.state.widgetPageTitle; + } + + return ( + + { name } + { title ? titleSpacer : '' }{ title } + + ); + } + render() { let appTileBody; @@ -508,17 +532,14 @@ export default class AppTile extends React.Component { { this.props.showMenubar &&
- - { this.formatAppTileName() } - { this.state.widgetPageTitle && this.state.widgetPageTitle != this.formatAppTileName() && ( -  - { this.state.widgetPageTitle } - ) } + /> } + { this.props.showTitle && this._getTileTitle() } { /* Snapshot widget */ } @@ -575,10 +596,20 @@ AppTile.propTypes = { showMenubar: React.PropTypes.bool, // Should the AppTile render itself show: React.PropTypes.bool, + // Optional onEditClickHandler (overrides default behaviour) + onEditClick: React.PropTypes.func, + // Optional onDeleteClickHandler (overrides default behaviour) + onDeleteClick: React.PropTypes.func, + // Optionally hide the tile title + showTitle: React.PropTypes.bool, + // Optionally hide the tile minimise icon + showMinimise: React.PropTypes.bool, }; AppTile.defaultProps = { url: "", waitForIframeLoad: true, showMenubar: true, + showTitle: true, + showMinimise: true, }; diff --git a/src/components/views/rooms/Stickerpack.js b/src/components/views/rooms/Stickerpack.js index 3722818bf6..6a61618b2c 100644 --- a/src/components/views/rooms/Stickerpack.js +++ b/src/components/views/rooms/Stickerpack.js @@ -25,6 +25,8 @@ import sdk from '../../../index'; import SdkConfig from '../../../SdkConfig'; import ScalarAuthClient from '../../../ScalarAuthClient'; import dis from '../../../dispatcher'; +import TintableSvgButton from '../elements/TintableSvgButton'; + export default class Stickerpack extends React.Component { constructor(props) { @@ -103,6 +105,7 @@ export default class Stickerpack extends React.Component { stickerpackWidget.content.name = stickerpackWidget.name || "Stickerpack"; console.warn('Stickerpack widget', stickerpackWidget); this.widgetId = stickerpackWidget.id; + stickersContent = (
-
X
-
- { _t("Manage sticker packs") } -
); } else {