Disable all input when subscribing and updating

client/app/components/subscription-form.js

@@ -11,8 +11,6 @@ export default class SubscriptionFormComponent extends Component {
 
     isCommunityDistrict = false;
 
-    isSubmitting = false;
-
     showSubscriptionUpdateConfirmationModal = false;
 
     updateStatus = 'none';
@@ -93,7 +91,7 @@ export default class SubscriptionFormComponent extends Component {
     async subscribe() {
       if (!this.canBeSubmitted) { return; }
 
-      set(this, 'isSubmitting', true);
+      this.args.setIsSubmitting(true);
 
       const requestBody = { email: this.args.email, subscriptions: {} };
       if (this.isCommunityDistrict) {
@@ -143,7 +141,7 @@ export default class SubscriptionFormComponent extends Component {
 
       if (!this.args.isUpdate) window.location.pathname = '/subscribed';
 
-      set(this, 'isSubmitting', false);
+      this.args.setIsSubmitting(false);
 
       if (this.args.isUpdate) {
         set(this, 'showSubscriptionUpdateConfirmationModal', true);

client/app/controllers/subscribe.js

@@ -5,6 +5,8 @@ import ENV from 'labs-zap-search/config/environment';
 import { validateEmail } from '../helpers/validate-email';
 
 export default class SubscribeController extends Controller {
+  isSubmitting = false;
+
   lastEmailChecked = '';
 
   emailAlreadyExists = false;
@@ -20,6 +22,11 @@ export default class SubscribeController extends Controller {
     return (this.emailAlreadyExists || this.emailNeedsConfirmation);
   }
 
+  @action
+  setIsSubmitting(isSubmittingValue) {
+    this.set('isSubmitting', isSubmittingValue);
+  }
+
   @action
   async checkExistingEmail(event) {
     const email = event.target.value;

client/app/controllers/subscription-update.js

@@ -0,0 +1,11 @@
+import Controller from '@ember/controller';
+import { action } from '@ember/object';
+
+export default class SubscriptionUpdateController extends Controller {
+    isSubmitting = false;
+
+    @action
+    setIsSubmitting(isSubmittingValue) {
+      this.set('isSubmitting', isSubmittingValue);
+    }
+}

client/app/templates/components/subscription-form.hbs

@@ -9,7 +9,7 @@
         <ul>
             <li>
                 <div class="update-type-item">               
-                    <Input @id="city-wide-checkbox" @type="checkbox" @checked={{isCityWide}} {{on "change" this.toggleCitywide}}/>
+                    <Input @id="city-wide-checkbox" @type="checkbox" @checked={{isCityWide}} {{on "change" this.toggleCitywide}} @disabled={{this.args.isSubmitting}}/>
                     <div class="update-type-label">
                         <label for="city-wide-checkbox">Citywide Updates</label>
                         <span class="text-small">You'll receive an email for all citywide projects, which are projects that aren’t
@@ -20,7 +20,7 @@
             <li>
                 <div class="update-type-item">
                     <Input @id="community-district-checkbox" @type="checkbox" @checked={{isCommunityDistrict}}
-                        {{on "change" this.closeAllAccordions}}/>
+                        {{on "change" this.closeAllAccordions}} @disabled={{this.args.isSubmitting}}/>
                     <div class="update-type-label">
                         <label for="community-district-checkbox">Community District (CD) Updates</label>
                         <span class="text-small">You'll receive an email for projects from all CDs you have selected.</span>
@@ -46,12 +46,12 @@
                     <div class="accordion-content" data-tab-content>
                         <div>
                         <div>
-                        <Input id="all-{{borough}}" type="checkbox" @value={{borough}} {{on "change" this.checkWholeBorough}} /><label
+                        <Input id="all-{{borough}}" type="checkbox" @value={{borough}} {{on "change" this.checkWholeBorough}} @disabled={{this.args.isSubmitting}}/><label
                             for="all-{{borough}}">Select all</label>
                         </div>
                         {{#each districts as |district| }}
                         <div>
-                            <Input id={{district.code}} @type="checkbox" @checked={{ get this.args.subscriptions district.code }} />
+                            <Input id={{district.code}} @type="checkbox" @checked={{ get this.args.subscriptions district.code }} @disabled={{this.args.isSubmitting}}/>
                             <label
                             for={{district.code}}>District {{district.num}}</label>
                         </div>
@@ -67,7 +67,7 @@
     </div>
 
     <div class="subscribe-section">
-        {{#if isSubmitting}}
+        {{#if this.args.isSubmitting}}
             {{fa-icon icon='spinner' spin="true" size="5x" class="map-loading-spinner"}}
         {{/if}}
         <a class="button primary no-margin {{if this.canBeSubmitted "" "disabled"}}" type="submit" {{action "subscribe"}}>{{if this.args.isUpdate "Update" "Subscribe"}}</a>

client/app/templates/subscribe.hbs

@@ -7,11 +7,11 @@
                     <span class="text-small">Get updated on milestones for all projects in any community district (CD) by signing up to receive
                         emails on Zoning Application Portal.</span>
                 </div>
-                    <SubscriptionForm @subscriptions={{this.model.subscriptions}} @email={{this.model.email}} @isUpdate={{false}} @invalidEmailForSignup={{this.invalidEmailForSignup}}>
+                    <SubscriptionForm @subscriptions={{this.model.subscriptions}} @isSubmitting={{this.isSubmitting}} @setIsSubmitting={{this.setIsSubmitting}} @email={{this.model.email}} @isUpdate={{false}} @invalidEmailForSignup={{this.invalidEmailForSignup}}>
                         <div class="subscribe-section">
                             <div class="subscribe-input-group">
                             <label class="email-label">Email Address</label>
-                            <Input class="input-group-field" type="text" @value={{this.model.email}} onkeyup={{action 'continuouslyCheckEmail'}} onchange={{action 'checkExistingEmail'}} />
+                            <Input class="input-group-field" type="text" @value={{this.model.email}} onkeyup={{action 'continuouslyCheckEmail'}} onchange={{action 'checkExistingEmail'}} @disabled={{this.isSubmitting}}/>
                             </div>
                             {{#if this.emailAlreadyExists}}
                                 <p class="email-exists">This email already is subscribed to ZAP Updates. <a onclick={{action 'sendEmail'}}>Click here to receive an email to modify subscriptions.</a></p>

client/app/templates/subscription-update.hbs

@@ -9,7 +9,7 @@
                         <p></p>
                     <div class="update-type-question">To unsubscribe from a Community District or Citywide, uncheck the selected options below.</div>
                 </div>
-                    <SubscriptionForm @subscriptions={{this.model.subscriptions}} @email={{this.model.email}} @isUpdate={{true}} @id={{this.model.id}}>
+                    <SubscriptionForm @subscriptions={{this.model.subscriptions}} @email={{this.model.email}} @isUpdate={{true}} @id={{this.model.id}} @isSubmitting={{this.isSubmitting}} @setIsSubmitting={{this.setIsSubmitting}}>
                         <div class="subscribe-section">
                             <div class="subscribe-input-group">
                                 <label class="email-label">Email Address</label>