Feature/add investment streaks (#2042)

* Add investment streaks

* Current streak
* Longest streak

* Add unit to value component

* Update changelog

libs/common/src/lib/interfaces/portfolio-investments.interface.ts

@@ -2,4 +2,5 @@ import { InvestmentItem } from './investment-item.interface';
 
 export interface PortfolioInvestments {
   investments: InvestmentItem[];
+  streaks: { currentStreak: number; longestStreak: number };
 }

libs/ui/src/lib/i18n.ts

@@ -13,12 +13,16 @@ const locales = {
   HIGHER_RISK: $localize`Higher Risk`,
   IMPORT_ACTIVITY_ERROR_IS_DUPLICATE: $localize`This activity already exists.`,
   LOWER_RISK: $localize`Lower Risk`,
+  MONTH: $localize`Month`,
+  MONTHS: $localize`Months`,
   OTHER: $localize`Other`,
   RETIREMENT_PROVISION: $localize`Retirement Provision`,
   SATELLITE: $localize`Satellite`,
   SECURITIES: $localize`Securities`,
   SYMBOL: $localize`Symbol`,
   TAG: $localize`Tag`,
+  YEAR: $localize`Year`,
+  YEARS: $localize`Years`,
 
   // enum AssetClass
   CASH: $localize`Cash`,

libs/ui/src/lib/value/value.component.html

@@ -35,9 +35,15 @@
         <small *ngIf="currency && size === 'medium'" class="ml-1">
           {{ currency }}
         </small>
+        <small *ngIf="unit && size === 'medium'" class="ml-1">
+          {{ unit }}
+        </small>
         <div *ngIf="currency && size !== 'medium'" class="ml-1">
           {{ currency }}
         </div>
+        <div *ngIf="unit && size !== 'medium'" class="ml-1">
+          {{ unit }}
+        </div>
       </ng-container>
       <ng-container *ngIf="isString">
         <div

libs/ui/src/lib/value/value.component.ts

@@ -26,6 +26,7 @@ export class ValueComponent implements OnChanges {
   @Input() precision: number | undefined;
   @Input() size: 'large' | 'medium' | 'small' = 'small';
   @Input() subLabel = '';
+  @Input() unit = '';
   @Input() value: number | string = '';
 
   public absoluteValue = 0;