fix: Invoice UI enhancements

app/controllers/account/billing/invoices/list.js

@@ -11,18 +11,27 @@ export default class extends Controller.extend(EmberTableControllerMixin) {
         cellComponent   : 'ui-table/cell/events/cell-download-invoice'
       },
       {
-        name          : 'Event Name',
-        valuePath     : 'event',
-        cellComponent : 'ui-table/cell/events/cell-event-invoice'
+        name      : 'Event Name',
+        valuePath : 'event.name'
       },
       {
-        name       : 'Date',
-        valuePath  : 'issuedAt',
-        isSortable : true,
+        name          : 'Invoice Date',
+        valuePath     : 'issuedAt',
+        isSortable    : true,
         cellComponent : 'ui-table/cell/cell-date',
-        options: {
-          timezone: 'UTC',
-          dateFormat: 'MMMM DD, YYYY'
+        options       : {
+          timezone   : 'UTC',
+          dateFormat : 'MMMM DD, YYYY'
+        }
+      },
+      {
+        name          : 'Due Date',
+        valuePath     : 'dueAt',
+        isSortable    : true,
+        cellComponent : 'ui-table/cell/cell-date',
+        options       : {
+          timezone   : 'UTC',
+          dateFormat : 'MMMM DD, YYYY'
         }
       },
       {

app/models/event-invoice.js

@@ -15,6 +15,7 @@ export default ModelBase.extend({
   brand         : attr('string'),
   createdAt     : attr('moment'),
   issuedAt      : attr('moment'),
+  dueAt         : attr('moment'),
   paymentMode   : attr('string'),
   stripeToken   : attr('string'),
   last4         : attr('string'),

app/routes/account/billing/index.js

@@ -8,6 +8,6 @@ export default class extends Route.extend(AuthenticatedRouteMixin) {
 
   beforeModel() {
     super.beforeModel(...arguments);
-    this.replaceWith('account.billing.payment-info');
+    this.replaceWith('account.billing.invoices');
   }
 }

app/routes/account/billing/invoices/list.js

@@ -1,5 +1,4 @@
 import Route from '@ember/routing/route';
-import moment from 'moment';
 import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
 import { action } from '@ember/object';
 import { capitalize } from 'lodash-es';
@@ -25,23 +24,6 @@ export default class extends Route.extend(EmberTableRouteMixin) {
           val  : params.invoice_status
         }
       ];
-    } else if (params.invoice_status === 'upcoming') {
-      filterOptions = [
-        {
-          and: [
-            {
-              name : 'deleted-at',
-              op   : 'eq',
-              val  : null
-            },
-            {
-              name : 'issued-at',
-              op   : 'ge',
-              val  : moment().subtract(30, 'days').toISOString()
-            }
-          ]
-        }
-      ];
     }
 
 

app/templates/account/billing.hbs

@@ -2,12 +2,12 @@
   <div class="row">
     <div class="{{if this.device.isMobile 'sixteen' 'three'}} wide column">
       <TabbedNavigation @isVertical={{true}}>
-        <LinkTo @route="account.billing.payment-info" class="item">
-          {{t 'Payment Information'}}
-        </LinkTo>
         <LinkTo @route="account.billing.invoices" class="item">
           {{t 'Invoices'}}
         </LinkTo>
+        <LinkTo @route="account.billing.payment-info" class="item">
+          {{t 'Payment Information'}}
+        </LinkTo>
       </TabbedNavigation>
     </div>
     <div class="{{if this.device.isMobile 'sixteen' 'thirteen'}} wide column">

app/templates/account/billing/invoices.hbs

@@ -11,9 +11,6 @@
         <LinkTo @route="account.billing.invoices.list" @model="paid" class="item">
           {{t 'Paid'}}
         </LinkTo>
-        <LinkTo @route="account.billing.invoices.list" @model="upcoming" class="item">
-          {{t 'Upcoming'}}
-        </LinkTo>
         <LinkTo @route="account.billing.invoices.list" @model="refunding" class="item">
           {{t 'Refunding'}}
         </LinkTo>

app/templates/components/ui-table/cell/events/cell-download-invoice.hbs

@@ -1,4 +1,3 @@
-<p> {{this.record}} </p>
-<a href="{{this.extraRecords.invoicePdfUrl}}">
-  <i class="download icon"></i>
+<a href="{{@extraRecords.invoicePdfUrl}}" target="_blank" rel="noopener noreferrer">
+  {{@record}}
 </a>

app/templates/event-invoice/review.hbs

@@ -17,6 +17,9 @@
               <div class="item">
                 <strong>{{t 'Date Issued'}}:</strong> {{general-date this.model.issuedAt 'UTC' 'MMMM DD, YYYY'}} 
               </div>
+              <div class="item">
+                <strong>{{t 'Due Date'}}:</strong> {{general-date this.model.dueAt 'UTC' 'MMMM DD, YYYY'}} 
+              </div>
               <div class="item">
                 <strong>{{t 'Total Invoice Amount'}}:</strong> {{currency-symbol this.model.event.paymentCurrency}} {{format-money this.model.amount}}
               </div>

tests/acceptance/invoices-test.js

@@ -16,6 +16,6 @@ module('Acceptance | account/billing/invoices', function(hooks) {
   test('visiting account/billing/invoices with login', async function(assert) {
     await login(assert);
     await visit('/account/billing/invoices');
-    assert.equal(currentURL(), '/account/billing/invoices');
+    assert.equal(currentURL(), '/account/billing/invoices/all');
   });
 });