From 558f3d649d290319443a576189ce7b02af6bb676 Mon Sep 17 00:00:00 2001
From: orangemug <info@orangemug.co.uk>
Date: Mon, 18 Jun 2018 18:17:33 +0100
Subject: [PATCH] Added dialog styling.

---
 src/components/modals/OpenModal.jsx | 19 ++++++++++++-------
 src/styles/_components.scss         |  6 ++++++
 2 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/components/modals/OpenModal.jsx b/src/components/modals/OpenModal.jsx
index f46f86f1..a7659e3d 100644
--- a/src/components/modals/OpenModal.jsx
+++ b/src/components/modals/OpenModal.jsx
@@ -67,7 +67,8 @@ class OpenModal extends React.Component {
     if(this.state.activeRequest) {
       this.state.activeRequest.abort();
       this.setState({
-        activeRequest: null
+        activeRequest: null,
+        activeRequestUrl: null
       });
     }
   }
@@ -75,12 +76,15 @@ class OpenModal extends React.Component {
   onStyleSelect(styleUrl) {
     this.clearError();
 
-    const activeRequest = request({
+    const reqOpts = {
       url: styleUrl,
       withCredentials: false,
-    }, (error, response, body) => {
+    }
+
+    const activeRequest = request(reqOpts, (error, response, body) => {
       this.setState({
-        activeRequest: null
+        activeRequest: null,
+        activeRequestUrl: null
       });
 
         if (!error && response.statusCode == 200) {
@@ -94,7 +98,8 @@ class OpenModal extends React.Component {
     })
 
     this.setState({
-      activeRequest: activeRequest
+      activeRequest: activeRequest,
+      activeRequestUrl: reqOpts.url
     })
   }
 
@@ -198,9 +203,9 @@ class OpenModal extends React.Component {
         onOpenToggle={() => this.onCancelActiveRequest()}
       >
         <p>
-          Loading...
+          Loading: {this.state.activeRequestUrl}
         </p>
-        <p>
+        <p className="maputnik-dialog__buttons">
           <Button onClick={(e) => this.onCancelActiveRequest(e)}>
             Cancel
           </Button>
diff --git a/src/styles/_components.scss b/src/styles/_components.scss
index 048307de..170d855d 100644
--- a/src/styles/_components.scss
+++ b/src/styles/_components.scss
@@ -135,3 +135,9 @@
     color: $color-red;
   }
 }
+
+.maputnik-dialog {
+  &__buttons {
+    text-align: right;
+  }
+}