From 992c4771f4d78ee349e05a2e1d05ca9d88b19b1c Mon Sep 17 00:00:00 2001
From: Richard Lewis <richard@smetco.co.uk>
Date: Mon, 5 Feb 2018 11:49:44 +0000
Subject: [PATCH] Add button to remove all stickerpacks

---
 src/components/views/rooms/Stickerpack.js | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/components/views/rooms/Stickerpack.js b/src/components/views/rooms/Stickerpack.js
index cb2a19eae7..77e188198a 100644
--- a/src/components/views/rooms/Stickerpack.js
+++ b/src/components/views/rooms/Stickerpack.js
@@ -33,12 +33,13 @@ export default class Stickerpack extends React.Component {
         this.onHideStickersClick = this.onHideStickersClick.bind(this);
         this.onFinished = this.onFinished.bind(this);
         this._launchManageIntegrations = this._launchManageIntegrations.bind(this);
+        this._removeStickerpackWidgets = this._removeStickerpackWidgets.bind(this);
 
         this.defaultStickersContent = (
             <div className='mx_Stickers_contentPlaceholder'>
-                <p>You don't currently have any stickerpacks enabled</p>
-                <p>Click <a href=''>here</a> to add some!</p>
-                <img src='img/stickerpack-placeholder.png' alt='Add a stickerpack' />
+                <p>{_t("You don't currently have any stickerpacks enabled")}</p>
+                <p>{_t("Click")} <span className='mx_Stickers_addLink' onClick={this._launchManageIntegrations} > { _t("here") } </span>{_t("to add some!")}</p>
+                <img src='img/stickerpack-placeholder.png' alt={_t('Add a stickerpack')} />
             </div>
         );
         this.popoverWidth = 300;
@@ -50,6 +51,11 @@ export default class Stickerpack extends React.Component {
         };
     }
 
+    _removeStickerpackWidgets() {
+        console.warn('Removing stickerpack widgets');
+        Widgets.removeStickerpackWidgets()
+    }
+
     componentDidMount() {
         this.scalarClient = null;
         if (SdkConfig.get().integrations_ui_url && SdkConfig.get().integrations_rest_url) {
@@ -91,6 +97,14 @@ export default class Stickerpack extends React.Component {
                             width: this.popoverWidth,
                         }}
                     >
+                        <div
+                            style={{
+                                'float': 'right',
+                                'fontSize': 'smaller',
+                                'cursor': 'pointer',
+                            }}
+                            onClick={this._removeStickerpackWidgets()}
+                        >X</div>
                         <AppTile
                             id={stickerpackWidget.id}
                             url={stickerpackWidget.content.url}
@@ -121,7 +135,7 @@ export default class Stickerpack extends React.Component {
             );
         } else {
             // Default content to show if stickerpack widget not added
-            stickersContent = <p>Click here to add your first sitckerpack</p>;
+            stickersContent = this.defaultStickersContent;
         }
         this.setState({stickersContent});
     }