chore: Migrate my-session, ticket and billing forms to ES6 (#3619)

Author: kushthedude

app/components/forms/admin/settings/billing.js

@@ -1,8 +1,9 @@
 import Component from '@ember/component';
 import FormMixin from 'open-event-frontend/mixins/form';
 import { validPhoneNumber } from 'open-event-frontend/utils/validators';
+import { action } from '@ember/object';
 
-export default Component.extend(FormMixin, {
+export default class extends Component.extend(FormMixin) {
   getValidationRules() {
     return {
       inline : true,
@@ -99,13 +100,12 @@ export default Component.extend(FormMixin, {
         }
       }
     };
-  },
+  }
 
-  actions: {
-    submit() {
-      this.onValid(() => {
-        this.save();
-      });
-    }
+  @action
+  submit() {
+    this.onValid(() => {
+      this.save();
+    });
   }
-});
+}

app/components/forms/user-payment-info-form.js

@@ -2,14 +2,14 @@ import Component from '@ember/component';
 import FormMixin from 'open-event-frontend/mixins/form';
 import { validPhoneNumber } from 'open-event-frontend/utils/validators';
 import { pick, orderBy } from 'lodash-es';
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { countries } from 'open-event-frontend/utils/dictionary/demography';
 
-export default Component.extend(FormMixin, {
+export default class extends Component.extend(FormMixin) {
   didInsertElement() {
-    this._super(...arguments);
+    super.didInsertElement(...arguments);
     this.set('userBillingInfo', pick(this.authManager.currentUser, ['billingContactName', 'billingCity', 'billingPhone', 'company', 'billingTaxInfo', 'billingCountry', 'billingState', 'billingAddress', 'billingZipCode', 'billingAdditionalInfo']));
-  },
+  }
 
   getValidationRules() {
     return {
@@ -88,30 +88,30 @@ export default Component.extend(FormMixin, {
         }
       }
     };
-  },
+  }
 
-  countries: computed(function() {
+  @computed()
+  get countries() {
     return orderBy(countries, 'name');
-  }),
+  }
 
-  actions: {
-    submit() {
-      this.onValid(async() => {
-        this.set('isLoading', true);
-        try {
-          this.authManager.currentUser.setProperties(this.userBillingInfo);
-          await this.authManager.currentUser.save();
-          this.notify.success(this.l10n.t('Your billing details has been updated'), {
-            id: 'bill_det_updated'
-          });
-        } catch (error) {
-          this.authManager.currentUser.rollbackAttributes();
-          this.notify.error(this.l10n.t('An unexpected error occurred'), {
-            id: 'bill_det_unexpect'
-          });
-        }
-        this.set('isLoading', false);
-      });
-    }
+  @action
+  submit() {
+    this.onValid(async() => {
+      this.set('isLoading', true);
+      try {
+        this.authManager.currentUser.setProperties(this.userBillingInfo);
+        await this.authManager.currentUser.save();
+        this.notify.success(this.l10n.t('Your billing details has been updated'), {
+          id: 'bill_det_updated'
+        });
+      } catch (error) {
+        this.authManager.currentUser.rollbackAttributes();
+        this.notify.error(this.l10n.t('An unexpected error occurred'), {
+          id: 'bill_det_unexpect'
+        });
+      }
+      this.set('isLoading', false);
+    });
   }
-});
+}

app/controllers/my-sessions/view.js

@@ -1,34 +1,37 @@
 import Controller from '@ember/controller';
-import { computed } from '@ember/object';
+import { computed, action } from '@ember/object';
 import moment from 'moment';
 
-export default Controller.extend({
-  isUpcoming: computed('model.endsAt', function() {
+export default class extends Controller {
+
+  @computed('model.endsAt')
+  get isUpcoming() {
     let endAt = this.get('model.endsAt');
     if (endAt < moment()) {
       return false;
     }
     return true;
-  }),
+  }
 
-  actions: {
-    openProposalDeleteModal() {
-      this.set('isProposalDeleteModalOpen', true);
-    },
-    deleteProposal() {
-      this.set('isLoading', true);
-      this.model.destroyRecord()
-        .then(() => {
-          this.transitionToRoute('my-sessions.index');
-          this.notify.success(this.l10n.t('Proposal has been deleted successfully.'));
-        })
-        .catch(() => {
-          this.notify.error(this.l10n.t('An unexpected error has occurred.'));
-        })
-        .finally(() => {
-          this.set('isLoading', false);
-          this.set('isProposalDeleteModalOpen', false);
-        });
-    }
+  @action
+  openProposalDeleteModal() {
+    this.set('isProposalDeleteModalOpen', true);
+  }
+
+  @action
+  deleteProposal() {
+    this.set('isLoading', true);
+    this.model.destroyRecord()
+      .then(() => {
+        this.transitionToRoute('my-sessions.index');
+        this.notify.success(this.l10n.t('Proposal has been deleted successfully.'));
+      })
+      .catch(() => {
+        this.notify.error(this.l10n.t('An unexpected error has occurred.'));
+      })
+      .finally(() => {
+        this.set('isLoading', false);
+        this.set('isProposalDeleteModalOpen', false);
+      });
   }
-});
+}

app/controllers/my-tickets/past.js

@@ -1,9 +1,10 @@
 import Controller from '@ember/controller';
-export default Controller.extend({
-  actions: {
-    shareEvent(event) {
-      this.set('eventToShare', event);
-      this.set('isShareModalOpen', true);
-    }
+import { action } from '@ember/object';
+
+export default class extends Controller {
+  @action
+  shareEvent(event) {
+    this.set('eventToShare', event);
+    this.set('isShareModalOpen', true);
   }
-});
+}

app/controllers/my-tickets/upcoming.js

@@ -1,9 +1,10 @@
 import Controller from '@ember/controller';
-export default Controller.extend({
-  actions: {
-    shareEvent(event) {
-      this.set('eventToShare', event);
-      this.set('isShareModalOpen', true);
-    }
+import { action } from '@ember/object';
+
+export default class extends Controller {
+  @action
+  shareEvent(event) {
+    this.set('eventToShare', event);
+    this.set('isShareModalOpen', true);
   }
-});
+}