Feature/add value column to accounts table (#468)

* Add value column

* Update changelog

apps/client/src/app/components/accounts-table/accounts-table.component.html

@@ -17,6 +17,20 @@
     </td>
   </ng-container>
 
+  <ng-container matColumnDef="currency">
+    <th
+      *matHeaderCellDef
+      class="d-none d-lg-table-cell px-1"
+      i18n
+      mat-header-cell
+    >
+      Currency
+    </th>
+    <td *matCellDef="let element" class="d-none d-lg-table-cell px-1" mat-cell>
+      {{ element.currency }}
+    </td>
+  </ng-container>
+
   <ng-container matColumnDef="platform">
     <th
       *matHeaderCellDef
@@ -45,7 +59,9 @@
       <span class="d-none d-sm-block" i18n>Transactions</span>
     </th>
     <td *matCellDef="let element" class="px-1 text-right" mat-cell>
-      {{ element.transactionCount }}
+      <ng-container *ngIf="element.accountType === 'SECURITIES'">{{
+        element.transactionCount
+      }}</ng-container>
     </td>
   </ng-container>
 
@@ -56,9 +72,23 @@
     <td *matCellDef="let element" class="px-1 text-right" mat-cell>
       <gf-value
         class="d-inline-block justify-content-end"
-        [currency]="element.currency"
+        [isCurrency]="true"
         [locale]="locale"
-        [value]="element.balance"
+        [value]="element.convertedBalance"
+      ></gf-value>
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="value">
+    <th *matHeaderCellDef class="px-1 text-right" i18n mat-header-cell>
+      Value
+    </th>
+    <td *matCellDef="let element" class="px-1 text-right" mat-cell>
+      <gf-value
+        class="d-inline-block justify-content-end"
+        [isCurrency]="true"
+        [locale]="locale"
+        [value]="element.value"
       ></gf-value>
     </td>
   </ng-container>

apps/client/src/app/components/accounts-table/accounts-table.component.ts

@@ -41,7 +41,14 @@ export class AccountsTableComponent implements OnChanges, OnDestroy, OnInit {
   public ngOnInit() {}
 
   public ngOnChanges() {
-    this.displayedColumns = ['account', 'platform', 'transactions', 'balance'];
+    this.displayedColumns = [
+      'account',
+      'currency',
+      'platform',
+      'transactions',
+      'balance',
+      'value'
+    ];
 
     if (this.showActions) {
       this.displayedColumns.push('actions');

apps/client/src/app/services/data.service.ts

@@ -29,7 +29,7 @@ import {
 } from '@ghostfolio/common/interfaces';
 import { InvestmentItem } from '@ghostfolio/common/interfaces/investment-item.interface';
 import { permissions } from '@ghostfolio/common/permissions';
-import { DateRange } from '@ghostfolio/common/types';
+import { AccountWithValue, DateRange } from '@ghostfolio/common/types';
 import {
   Account as AccountModel,
   DataSource,
@@ -62,7 +62,7 @@ export class DataService {
   }
 
   public fetchAccounts() {
-    return this.http.get<AccountModel[]>('/api/account');
+    return this.http.get<AccountWithValue[]>('/api/account');
   }
 
   public fetchAdminData() {