From e8e0d0d1739dea53dcba4267a3488d3906acdd95 Mon Sep 17 00:00:00 2001
From: Edie Lemoine <edie@myparcel.nl>
Date: Fri, 20 Sep 2019 15:45:40 +0200
Subject: [PATCH] change <Errors> to use <Modal> component and fix positioning
 of modal

---
 src/App.vue                 | 16 +++++++++-------
 src/assets/scss/_modal.scss |  5 -----
 src/components/Errors.vue   |  3 +++
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index f7f6766e..54863152 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,8 +17,6 @@
         v-if="loading"
         v-test="'loader'" />
 
-      <Errors v-else-if="!hasValidAddress" />
-
       <recursive-form
         v-for="option in form.options"
         v-else
@@ -248,11 +246,18 @@ export default {
 
       if (!this.hasValidAddress) {
         this.loading = false;
+        this.$configBus.showModal = true;
+        this.$configBus.modalData = {
+          component: Errors,
+        };
         return;
       }
 
-      this.loading = true;
-      await fetchAllCarriers();
+      if (!this.$configBus.carrierData.length) {
+        this.loading = true;
+        await fetchAllCarriers();
+      }
+
       this.createForm();
       this.loading = false;
     },
@@ -261,9 +266,6 @@ export default {
      * Hide the checkout completely.
      */
     hideSelf() {
-      // This has to stay here until after testing
-      // eslint-disable-next-line no-console
-      console.trace('hiding delivery options');
       this.showDeliveryOptions = false;
     },
 
diff --git a/src/assets/scss/_modal.scss b/src/assets/scss/_modal.scss
index 89c23953..f5c9673d 100644
--- a/src/assets/scss/_modal.scss
+++ b/src/assets/scss/_modal.scss
@@ -1,10 +1,5 @@
 .#{$classBase} {
   &__modal {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
     padding: $modal-content-padding;
     background-color: white;
 
diff --git a/src/components/Errors.vue b/src/components/Errors.vue
index 279083a9..a2f6286e 100644
--- a/src/components/Errors.vue
+++ b/src/components/Errors.vue
@@ -60,6 +60,9 @@ export default {
 
       // Send the new values in an event. It's up to the external platform to do handle this event or not.
       document.dispatchEvent(new CustomEvent(EVENTS.UPDATED_ADDRESS, { detail: this.values }));
+
+      // Hide the modal
+      this.$configBus.showModal = false;
     },
   },
 };