From c0ba7e6fd07c35c74cbea8515e6db621a3421b98 Mon Sep 17 00:00:00 2001
From: Jonathan Niles <jonathanwniles@imaworldhealth.org>
Date: Thu, 25 Aug 2016 11:11:20 +0100
Subject: [PATCH] feat(location): modal uses loading indicator

This commit makes the bhLocationModal use a loading indicator while an
HTTP request is in progress.
---
 client/src/js/components/bhLocationSelect.js       |  2 +-
 .../partials/templates/modals/location.modal.html  | 14 ++++++--------
 .../partials/templates/modals/location.modal.js    |  4 ++--
 test/end-to-end/patient/registration.spec.js       |  1 -
 4 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/client/src/js/components/bhLocationSelect.js b/client/src/js/components/bhLocationSelect.js
index 33ac1734da..6645dff0cc 100644
--- a/client/src/js/components/bhLocationSelect.js
+++ b/client/src/js/components/bhLocationSelect.js
@@ -78,7 +78,7 @@ function LocationSelectController(Locations, $scope, $timeout) {
    * variable.
    *
    * This is a convenience method as the controller is available to the $scope
-   * thorugh the $ctrl variable. It translates the template from:
+   * through the $ctrl variable. It translates the template from:
    *
    * `this[$ctrl.name].formVariable`
    *
diff --git a/client/src/partials/templates/modals/location.modal.html b/client/src/partials/templates/modals/location.modal.html
index f8b8c1cc3d..46d2b8f561 100644
--- a/client/src/partials/templates/modals/location.modal.html
+++ b/client/src/partials/templates/modals/location.modal.html
@@ -1,4 +1,4 @@
-<ng-form name="LocationModalForm" data-location-modal bh-form-defaults novalidate>
+<form name="LocationModalForm" bh-submit="LocationModalCtrl.submit(LocationModalForm.$invalid)" data-location-modal bh-form-defaults novalidate>
   <div class="modal-header">
     <h4>{{ "FORM.LABELS.CONFIRMATION" | translate }}</h4>
   </div>
@@ -114,7 +114,7 @@ <h4>{{ "FORM.LABELS.CONFIRMATION" | translate }}</h4>
     </div>
 
     <p class="text-danger" ng-show="LocationModalForm.$submitted && LocationModalForm.$invalid">
-      <span class="glyphicon glyphicon-exclamation-sign"></span>
+      <span class="fa fa-warning"></span>
       {{ "FORM.ERRORS.GENERIC" | translate }}
     </p>
   </div>
@@ -122,14 +122,12 @@ <h4>{{ "FORM.LABELS.CONFIRMATION" | translate }}</h4>
 
   <div class="modal-footer">
     <!-- @todo - why does this not set the submitted state automatically? -->
-    <button
-      type="submit"
-      class="btn btn-primary"
-      ng-click="LocationModalCtrl.submit(LocationModalForm.$invalid); LocationModalForm.$setSubmitted();">
+    <bh-loading-button
+      loading-state="LocationModalForm.$loading">
       {{ "FORM.BUTTONS.SUBMIT" | translate }}
-    </button>
+    </bh-loading-button>
     <button type="button" ng-click="LocationModalCtrl.dismiss()" class="btn btn-default">
       {{ "FORM.BUTTONS.CANCEL" | translate }}
     </button>
   </div>
-</ng-form>
+</form>
diff --git a/client/src/partials/templates/modals/location.modal.js b/client/src/partials/templates/modals/location.modal.js
index 27a32f5cff..57c6510dab 100644
--- a/client/src/partials/templates/modals/location.modal.js
+++ b/client/src/partials/templates/modals/location.modal.js
@@ -199,8 +199,8 @@ function LocationModalController(Locations, Instance, AppCache) {
         return;
     }
 
-    promise.then(function (data) {
-      Instance.close(data);
+    return promise.then(function (data) {
+      return Instance.close(data);
     })
     .catch(function (error) {
       vm.error = error;
diff --git a/test/end-to-end/patient/registration.spec.js b/test/end-to-end/patient/registration.spec.js
index 2b511b6192..cb9bd8a4e8 100644
--- a/test/end-to-end/patient/registration.spec.js
+++ b/test/end-to-end/patient/registration.spec.js
@@ -84,7 +84,6 @@ describe('Patient Registration', function () {
       FU.validation.error('PatientRegCtrl.medical.dob');
 
       // first name and title are optional
-      FU.validation.ok('PatientRegCtrl.medical.first_name');
       FU.validation.ok('PatientRegCtrl.medical.title');
 
       components.notification.hasDanger();