From 9f52c13bea3f706ba004a61b673427d2bc292156 Mon Sep 17 00:00:00 2001
From: Richard Lewis <rick@matrix.org>
Date: Wed, 26 Jul 2017 16:47:58 +0100
Subject: [PATCH] Grant permission to load app widget.

---
 .../views/elements/AppPermission.js           | 29 +++++++++++++------
 src/components/views/elements/AppTile.js      |  1 +
 2 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/src/components/views/elements/AppPermission.js b/src/components/views/elements/AppPermission.js
index a6ecd7b5f7..ad697e2df0 100644
--- a/src/components/views/elements/AppPermission.js
+++ b/src/components/views/elements/AppPermission.js
@@ -1,30 +1,41 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { URL, URLSearchParams } from 'url';
+import url from 'url';
 
 export default class AppPermission extends React.Component {
     constructor(props) {
         super(props);
 
+        const curl = this.getCurl();
         this.state = {
-            curl: this.getCurl(),
+            curl: curl,
         };
+        console.log('curl', curl);
     }
 
     getCurl() {
-        let wurl = URL.parse(this.props.url);
-        console.log('wurl', wurl);
-        if(wurl.searchParams.get('url')) {
-            let curl = wurl.searchParams.get('url');
-            console.log('curl', curl);
+        const wurl = url.parse(this.props.url);
+        let curl;
+
+        const searchParams = new URLSearchParams(wurl.search);
+        if(searchParams && searchParams.get('url')) {
+            curl = searchParams.get('url');
         }
+        curl = curl || wurl;
+        return curl;
     }
 
     render() {
         return (
-            <div>
-                Load widget with URL : {this.state.cUrl}
+            <div className='mx_AppPermissionWarning'>
+                <div className='mx_AppPermissionWarningImage'>
+                    <img src='img/warning.svg' alt='Warning'/>
+                </div>
+                <div className='mx_AppPermissionWarningText'>
+                    <span className='mx_AppPermissionWarningTextLabel'>Do you want to load widget from URL?:</span> <span className='mx_AppPermissionWarningTextURL'>{this.state.curl}</span>
+                </div>
                 <input
+                    className='mx_AppPermissionButton'
                     type='button'
                     value='Allow'
                     onClick={this.props.onPermissionGranted}
diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js
index 994b613b41..522db7399e 100644
--- a/src/components/views/elements/AppTile.js
+++ b/src/components/views/elements/AppTile.js
@@ -174,6 +174,7 @@ export default React.createClass({
             appTileBody = (
                 <AppPermission
                     url={this.state.widgetUrl}
+                    onPermissionGranted={this._grantWidgetPermission}
                 />
             );
         }