From b6fd2a0691ce92f82fc9ee810f80e0295afdfefb Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Tue, 20 Oct 2020 15:05:22 +0100
Subject: [PATCH] Iterate the Modal Widget Dialog paddings and phishing warning

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 res/css/views/dialogs/_ModalWidgetDialog.scss | 14 ++++++++++++++
 res/img/element-icons/warning-badge.svg       |  5 +++++
 .../views/dialogs/ModalWidgetDialog.tsx       | 19 +++++++++++++++----
 src/i18n/strings/en_EN.json                   |  1 +
 4 files changed, 35 insertions(+), 4 deletions(-)
 create mode 100644 res/img/element-icons/warning-badge.svg

diff --git a/res/css/views/dialogs/_ModalWidgetDialog.scss b/res/css/views/dialogs/_ModalWidgetDialog.scss
index 919a98723e..aa2dd0d395 100644
--- a/res/css/views/dialogs/_ModalWidgetDialog.scss
+++ b/res/css/views/dialogs/_ModalWidgetDialog.scss
@@ -15,7 +15,19 @@ limitations under the License.
 */
 
 .mx_ModalWidgetDialog {
+    .mx_ModalWidgetDialog_warning {
+        margin-bottom: 24px;
+
+        > img {
+            vertical-align: middle;
+            margin-right: 8px;
+        }
+    }
+
     .mx_ModalWidgetDialog_buttons {
+        float: right;
+        margin-top: 24px;
+
         .mx_AccessibleButton + .mx_AccessibleButton {
             margin-left: 8px;
         }
@@ -24,5 +36,7 @@ limitations under the License.
     iframe {
         width: 100%;
         height: 450px;
+        border: 0;
+        border-radius: 8px;
     }
 }
diff --git a/res/img/element-icons/warning-badge.svg b/res/img/element-icons/warning-badge.svg
new file mode 100644
index 0000000000..ac5991f221
--- /dev/null
+++ b/res/img/element-icons/warning-badge.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="8" cy="8" r="8" fill="#737D8C" style="mix-blend-mode:multiply"/>
+<rect x="7" y="3" width="2" height="6" rx="1" fill="white"/>
+<rect x="7" y="11" width="2" height="2" rx="1" fill="white"/>
+</svg>
diff --git a/src/components/views/dialogs/ModalWidgetDialog.tsx b/src/components/views/dialogs/ModalWidgetDialog.tsx
index e9fd30c1c3..d7f6e96394 100644
--- a/src/components/views/dialogs/ModalWidgetDialog.tsx
+++ b/src/components/views/dialogs/ModalWidgetDialog.tsx
@@ -87,7 +87,7 @@ export default class ModalWidgetDialog extends React.PureComponent<IProps, IStat
 
     public render() {
         // TODO: Don't violate every single security principle
-        // TODO copied from SGWidget
+        // TODO: DRY - copied from SGWidget
         const templated = this.widget.getCompleteUrl({
             currentRoomId: RoomViewStore.getRoomId(),
             currentUserId: MatrixClientPeg.get().getUserId(),
@@ -140,15 +140,26 @@ export default class ModalWidgetDialog extends React.PureComponent<IProps, IStat
             contentId="mx_Dialog_content"
             onFinished={this.props.onFinished}
         >
+            <div className="mx_ModalWidgetDialog_warning">
+                <img
+                    src={require("../../../../res/img/element-icons/warning-badge.svg")}
+                    height="16"
+                    width="16"
+                    alt=""
+                />
+                {_t("Data on this screen is shared with %(widgetDomain)s", {
+                    widgetDomain: parsed.hostname,
+                })}
+            </div>
             <div>
                 <iframe
                     ref={this.appFrame}
-                    // sandbox="allow-forms allow-scripts" TODO
-                    src={widgetUrl.toString()}
+                    sandbox="allow-forms allow-scripts"
+                    src={widgetUrl}
                     onLoad={this.onLoad}
                 />
             </div>
-            <div className="mx_ModalWidgetDialog_buttons" style={{float: "right"}}>
+            <div className="mx_ModalWidgetDialog_buttons">
                 { buttons }
             </div>
         </BaseDialog>;
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index c984c27dba..1786fb20b3 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -1769,6 +1769,7 @@
     "Your homeserver doesn't seem to support this feature.": "Your homeserver doesn't seem to support this feature.",
     "Message edits": "Message edits",
     "Modal Widget": "Modal Widget",
+    "Data on this screen is shared with %(widgetDomain)s": "Data on this screen is shared with %(widgetDomain)s",
     "Your account is not secure": "Your account is not secure",
     "Your password": "Your password",
     "This session, or the other session": "This session, or the other session",