From 1b07c6ae4f0d06e25b124bba2f088d3a02f78ecc Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Wed, 20 Mar 2019 12:20:31 -0400
Subject: add processing state and close modal after api request is completed

---
 src/components/user_reporting_modal/user_reporting_modal.js  | 12 ++++++++++--
 src/components/user_reporting_modal/user_reporting_modal.vue |  2 +-
 2 files changed, 11 insertions(+), 3 deletions(-)

(limited to 'src/components/user_reporting_modal')

diff --git a/src/components/user_reporting_modal/user_reporting_modal.js b/src/components/user_reporting_modal/user_reporting_modal.js
index ed7e74f0..ac5b5192 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.js
+++ b/src/components/user_reporting_modal/user_reporting_modal.js
@@ -11,7 +11,8 @@ const UserReportingModal = {
     return {
       comment: '',
       forward: false,
-      statusIdsToReport: []
+      statusIdsToReport: [],
+      processing: false
     }
   },
   computed: {
@@ -40,6 +41,7 @@ const UserReportingModal = {
       this.comment = ''
       this.forward = false
       this.statusIdsToReport = []
+      this.processing = false
     }
   },
   methods: {
@@ -47,12 +49,18 @@ const UserReportingModal = {
       this.$store.dispatch('closeUserReportingModal')
     },
     reportUser () {
+      this.processing = true
       const params = {
+        userId: this.userId,
         comment: this.comment,
         forward: this.forward,
         statusIds: this.statusIdsToReport
       }
-      this.$store.dispatch('reportUser', params)
+      this.$store.state.api.backendInteractor.reportUser(params)
+        .then(() => {
+          this.processing = false
+          this.closeModal()
+        })
     },
     isChecked (statusId) {
       return this.statusIdsToReport.indexOf(statusId) !== -1
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 49839da3..30d3ab19 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -19,7 +19,7 @@
           <Checkbox v-model="forward">Forward to {{remoteInstance}}</Checkbox>
         </div>
         <div>
-          <button class="btn btn-default" @click="reportUser">Submit</button>
+          <button class="btn btn-default" @click="reportUser" :disabled="processing">Submit</button>
         </div>
       </div>
       <div class="user-reporting-panel-right">
-- 
cgit v1.2.3-70-g09d2