feat: Allow admin to see any user's invoice (#5247)

Author: iamareebjamal

app/components/ui-table/cell/admin/sales/invoice-user.hbs

@@ -0,0 +1 @@
+<a href="{{href-to 'account.billing.invoices.list' 'all' (query-params user_id=@record.id)}}" target="_blank" rel="noopener nofollow" data-tooltip="View user's invoices">{{ @record.email }}</a>

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

@@ -2,32 +2,38 @@ import Controller from '@ember/controller';
 import EmberTableControllerMixin from 'open-event-frontend/mixins/ember-table-controller';
 
 export default class extends Controller.extend(EmberTableControllerMixin) {
+  queryParams = [...this.queryParams, 'user_id']
+
   get columns() {
     return [
       {
         name            : 'Invoice ID',
+        headerComponent : 'tables/headers/sort',
+        isSortable      : true,
         valuePath       : 'identifier',
         extraValuePaths : ['invoicePdfUrl'],
         cellComponent   : 'ui-table/cell/events/cell-download-invoice'
       },
       {
-        name      : 'Event Name',
-        valuePath : 'event.name'
+        name            : 'Event Name',
+        valuePath       : 'event.name',
+        isSortable      : true,
+        headerComponent : 'tables/headers/sort'
       },
       {
-        name          : 'Invoice Date',
-        valuePath     : 'issuedAt',
-        isSortable    : true,
-        cellComponent : 'ui-table/cell/cell-date',
-        options       : {
+        name            : 'Invoice Date',
+        valuePath       : 'issuedAt',
+        isSortable      : true,
+        headerComponent : 'tables/headers/sort',
+        cellComponent   : 'ui-table/cell/cell-date',
+        options         : {
           timezone   : 'UTC',
           dateFormat : 'MMMM DD, YYYY'
         }
       },
       {
         name          : 'Due Date',
         valuePath     : 'dueAt',
-        isSortable    : true,
         cellComponent : 'ui-table/cell/cell-date',
         options       : {
           timezone   : 'UTC',

app/controllers/admin/sales/invoices.js

@@ -9,40 +9,61 @@ export default class extends Controller.extend(EmberTableControllerMixin) {
         name            : 'Invoice #',
         headerComponent : 'tables/headers/sort',
         isSortable      : true,
-        valuePath       : 'identifier'
+        valuePath       : 'identifier',
+        extraValuePaths : ['invoicePdfUrl'],
+        cellComponent   : 'ui-table/cell/events/cell-download-invoice'
       },
       {
-        name      : 'Event',
-        valuePath : 'event.name'
+        name            : 'Event',
+        valuePath       : 'event.name',
+        isSortable      : true,
+        headerComponent : 'tables/headers/sort'
       },
       {
         name            : 'Invoice Date',
-        valuePath       : 'createdAt',
-        headerComponent : 'tables/headers/sort',
+        valuePath       : 'issuedAt',
         isSortable      : true,
-        cellComponent   : 'ui-table/cell/cell-simple-date',
+        headerComponent : 'tables/headers/sort',
+        cellComponent   : 'ui-table/cell/cell-date',
         options         : {
-          dateFormat: 'MMMM DD, YYYY - HH:mm A'
+          timezone   : 'UTC',
+          dateFormat : 'MMMM DD, YYYY'
+        }
+      },
+      {
+        name          : 'Due Date',
+        valuePath     : 'dueAt',
+        cellComponent : 'ui-table/cell/cell-date',
+        options       : {
+          timezone   : 'UTC',
+          dateFormat : 'MMMM DD, YYYY'
         }
       },
       {
-        name          : 'Amount',
-        valuePath     : 'amount',
-        cellComponent : 'ui-table/cell/admin/sales/status/cell-amount'
+        name            : 'Amount',
+        valuePath       : 'amount',
+        extraValuePaths : ['event'],
+        cellComponent   : 'ui-table/cell/events/cell-amount',
+        isSortable      : true,
+        headerComponent : 'tables/headers/sort'
       },
       {
-        name      : 'Sent To',
-        valuePath : 'user.email'
+        name          : 'Sent To',
+        valuePath     : 'user',
+        cellComponent : 'ui-table/cell/admin/sales/invoice-user'
+      },
+      {
+        name            : 'Status',
+        valuePath       : 'status',
+        isSortable      : true,
+        headerComponent : 'tables/headers/sort'
       },
       {
-        name      : 'Status',
-        valuePath : 'status'
+        name            : 'Action',
+        valuePath       : 'identifier',
+        extraValuePaths : ['status'],
+        cellComponent   : 'ui-table/cell/events/cell-action'
       }
-      // {
-      //  name            : 'Action',
-      //  valuePath       : 'identifier',
-      //  cellComponent   : 'ui-table/cell/admin/sales/cell-action'
-      // }
     ];
   }
 }

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

@@ -4,6 +4,13 @@ import { action } from '@ember/object';
 import { capitalize } from 'lodash-es';
 
 export default class extends Route.extend(EmberTableRouteMixin) {
+  queryParams = {
+    ...this.queryParams,
+    user_id: {
+      refreshModel: true
+    }
+  }
+
   titleToken() {
     if (['paid', 'due', 'refunding', 'refunded'].includes(this.params.invoice_status)) {
       return this.l10n.t(capitalize(this.params.invoice_status));
@@ -37,8 +44,9 @@ export default class extends Route.extend(EmberTableRouteMixin) {
     };
 
     queryString = this.applySortFilters(queryString, params);
+    const user = params.user_id ? await this.store.findRecord('user', params.user_id) : this.authManager.currentUser;
     return {
-      eventInvoices: await this.asArray(this.authManager.currentUser.query('eventInvoices', queryString)),
+      eventInvoices: await this.asArray(user.query('eventInvoices', queryString)),
       params
 
     };