Merge branch 'main' into feature/symbols-allocation-chart

CHANGELOG.md

@@ -5,12 +5,17 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## Unreleased
+### Unreleased
 
 ### Added
 
+- Added a link below the holdings to manage the transactions
 - Added the allocation chart by symbol
 
+### Fixed
+
+- Fixed the value formatting for integers (transactions count)
+
 ## 1.44.0 - 30.08.2021
 
 ### Changed

apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html

@@ -102,9 +102,10 @@
       </div>
       <div class="col-6 mb-3">
         <gf-value
-          label="Transactions"
           size="medium"
-          [isCurrency]="true"
+          [isCurrency]="false"
+          [isInteger]="true"
+          [label]="transactionCount === 1 ? 'Transaction' : 'Transactions'"
           [locale]="data.locale"
           [value]="transactionCount"
         ></gf-value>

apps/client/src/app/components/value/value.component.ts

@@ -19,6 +19,7 @@ export class ValueComponent implements OnChanges, OnInit {
   @Input() colorizeSign: boolean;
   @Input() currency: string;
   @Input() isCurrency: boolean;
+  @Input() isInteger: boolean;
   @Input() isPercent: boolean;
   @Input() label: string;
   @Input() locale: string;
@@ -84,6 +85,13 @@ export class ValueComponent implements OnChanges, OnInit {
               minimumFractionDigits: 2
             });
           } catch {}
+        } else if (this.isInteger) {
+          try {
+            this.formattedValue = this.value?.toLocaleString(this.locale, {
+              maximumFractionDigits: 0,
+              minimumFractionDigits: 0
+            });
+          } catch {}
         }
       } else {
         try {

apps/client/src/app/pages/home/home-page.component.ts

@@ -58,6 +58,7 @@ export class HomePageComponent implements OnDestroy, OnInit {
   public fearAndGreedIndex: number;
   public hasImpersonationId: boolean;
   public hasPermissionToAccessFearAndGreedIndex: boolean;
+  public hasPermissionToCreateOrder: boolean;
   public hasPositions: boolean;
   public historicalDataItems: LineChartItem[];
   public isLoadingPerformance = true;
@@ -119,6 +120,11 @@ export class HomePageComponent implements OnDestroy, OnInit {
               });
           }
 
+          this.hasPermissionToCreateOrder = hasPermission(
+            this.user.permissions,
+            permissions.createOrder
+          );
+
           this.changeDetectorRef.markForCheck();
         }
       });
@@ -135,6 +141,8 @@ export class HomePageComponent implements OnDestroy, OnInit {
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe((aId) => {
         this.hasImpersonationId = !!aId;
+
+        this.changeDetectorRef.markForCheck();
       });
 
     this.dateRange =

apps/client/src/app/pages/home/home-page.html

@@ -91,18 +91,28 @@
               (change)="onChangeDateRange($event.value)"
             ></gf-toggle>
           </div>
-
+          <ng-container *ngIf="hasPositions === true">
-          <mat-card *ngIf="hasPositions === true" class="p-0">
+            <mat-card class="p-0">
-            <mat-card-content>
+              <mat-card-content>
-              <gf-positions
+                <gf-positions
-                [baseCurrency]="user?.settings?.baseCurrency"
+                  [baseCurrency]="user?.settings?.baseCurrency"
-                [deviceType]="deviceType"
+                  [deviceType]="deviceType"
-                [locale]="user?.settings?.locale"
+                  [locale]="user?.settings?.locale"
-                [positions]="positions"
+                  [positions]="positions"
-                [range]="dateRange"
+                  [range]="dateRange"
-              ></gf-positions>
+                ></gf-positions>
-            </mat-card-content>
+              </mat-card-content>
-          </mat-card>
+            </mat-card>
+            <div *ngIf="hasPermissionToCreateOrder" class="text-center">
+              <a
+                class="mt-3"
+                i18n
+                mat-button
+                [routerLink]="['/portfolio', 'transactions']"
+                >Manage Transactions...</a
+              >
+            </div>
+          </ng-container>
           <div
             *ngIf="hasPositions === false"
             class="d-flex justify-content-center"

apps/client/src/app/pages/zen/zen-page.component.ts

@@ -19,6 +19,7 @@ import {
   Position,
   User
 } from '@ghostfolio/common/interfaces';
+import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { DateRange } from '@ghostfolio/common/types';
 import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject } from 'rxjs';
@@ -36,6 +37,7 @@ export class ZenPageComponent implements AfterViewInit, OnDestroy, OnInit {
   public dateRange: DateRange = 'max';
   public deviceType: string;
   public hasImpersonationId: boolean;
+  public hasPermissionToCreateOrder: boolean;
   public hasPositions: boolean;
   public historicalDataItems: LineChartItem[];
   public isLoadingPerformance = true;
@@ -63,6 +65,11 @@ export class ZenPageComponent implements AfterViewInit, OnDestroy, OnInit {
         if (state?.user) {
           this.user = state.user;
 
+          this.hasPermissionToCreateOrder = hasPermission(
+            this.user.permissions,
+            permissions.createOrder
+          );
+
           this.changeDetectorRef.markForCheck();
         }
       });
@@ -76,6 +83,8 @@ export class ZenPageComponent implements AfterViewInit, OnDestroy, OnInit {
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe((aId) => {
         this.hasImpersonationId = !!aId;
+
+        this.changeDetectorRef.markForCheck();
       });
 
     this.update();

apps/client/src/app/pages/zen/zen-page.html

@@ -64,17 +64,28 @@
       <h3 class="d-flex justify-content-center mb-3" i18n>Holdings</h3>
       <div class="row">
         <div class="align-items-center col">
-          <mat-card *ngIf="hasPositions === true" class="p-0">
+          <ng-container *ngIf="hasPositions === true">
-            <mat-card-content>
+            <mat-card class="p-0">
-              <gf-positions
+              <mat-card-content>
-                [baseCurrency]="user?.settings?.baseCurrency"
+                <gf-positions
-                [deviceType]="deviceType"
+                  [baseCurrency]="user?.settings?.baseCurrency"
-                [locale]="user?.settings?.locale"
+                  [deviceType]="deviceType"
-                [positions]="positions"
+                  [locale]="user?.settings?.locale"
-                [range]="dateRange"
+                  [positions]="positions"
-              ></gf-positions>
+                  [range]="dateRange"
-            </mat-card-content>
+                ></gf-positions>
-          </mat-card>
+              </mat-card-content>
+            </mat-card>
+            <div *ngIf="hasPermissionToCreateOrder" class="text-center">
+              <a
+                class="mt-3"
+                i18n
+                mat-button
+                [routerLink]="['/portfolio', 'transactions']"
+                >Manage Transactions...</a
+              >
+            </div>
+          </ng-container>
           <div
             *ngIf="hasPositions === false"
             class="d-flex justify-content-center"