Merge remote-tracking branch 'origin/main' into task/migrate-tags-selector-component

CHANGELOG.md

@@ -7,10 +7,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
-### Changed
+### Added
 
+- Extended the activities table menu with a _View Holding_ item
 - Migrated tags selector component in holding detail dialog to form control
 
+### Changed
+
+- Improved the icon of the holdings tab on the home page
+- Improved the icon of the holdings tab on the home page for the _Zen Mode_
+- Improved the icon of the holdings tab in the account detail dialog
+
 ## 2.212.0 - 2025-10-29
 
 ### Added

apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.ts

@@ -43,9 +43,9 @@ import { Big } from 'big.js';
 import { format, parseISO } from 'date-fns';
 import { addIcons } from 'ionicons';
 import {
+  albumsOutline,
   cashOutline,
-  swapVerticalOutline,
+  swapVerticalOutline
-  walletOutline
 } from 'ionicons/icons';
 import { isNumber } from 'lodash';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@@ -129,7 +129,7 @@ export class GfAccountDetailDialogComponent implements OnDestroy, OnInit {
         }
       });
 
-    addIcons({ cashOutline, swapVerticalOutline, walletOutline });
+    addIcons({ albumsOutline, cashOutline, swapVerticalOutline });
   }
 
   public ngOnInit() {

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

@@ -98,7 +98,7 @@
     >
       <mat-tab>
         <ng-template mat-tab-label>
-          <ion-icon name="wallet-outline" />
+          <ion-icon name="albums-outline" />
           <div class="d-none d-sm-block ml-2" i18n>Holdings</div>
         </ng-template>
         <gf-holdings-table

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

@@ -16,11 +16,11 @@ import { RouterModule } from '@angular/router';
 import { IonIcon } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
 import {
+  albumsOutline,
   analyticsOutline,
   bookmarkOutline,
   newspaperOutline,
-  readerOutline,
+  readerOutline
-  walletOutline
 } from 'ionicons/icons';
 import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject } from 'rxjs';
@@ -61,7 +61,7 @@ export class GfHomePageComponent implements OnDestroy, OnInit {
               routerLink: internalRoutes.home.routerLink
             },
             {
-              iconName: 'wallet-outline',
+              iconName: 'albums-outline',
               label: internalRoutes.home.subRoutes.holdings.title,
               routerLink: internalRoutes.home.subRoutes.holdings.routerLink
             },
@@ -97,11 +97,11 @@ export class GfHomePageComponent implements OnDestroy, OnInit {
       });
 
     addIcons({
+      albumsOutline,
       analyticsOutline,
       bookmarkOutline,
       newspaperOutline,
-      readerOutline,
+      readerOutline
-      walletOutline
     });
   }
 

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

@@ -8,7 +8,7 @@ import { MatTabsModule } from '@angular/material/tabs';
 import { RouterModule } from '@angular/router';
 import { IonIcon } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
-import { analyticsOutline, walletOutline } from 'ionicons/icons';
+import { albumsOutline, analyticsOutline } from 'ionicons/icons';
 import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
@@ -43,7 +43,7 @@ export class GfZenPageComponent implements OnDestroy, OnInit {
               routerLink: internalRoutes.zen.routerLink
             },
             {
-              iconName: 'wallet-outline',
+              iconName: 'albums-outline',
               label: internalRoutes.zen.subRoutes.holdings.title,
               routerLink: internalRoutes.zen.subRoutes.holdings.routerLink
             }
@@ -54,7 +54,7 @@ export class GfZenPageComponent implements OnDestroy, OnInit {
         }
       });
 
-    addIcons({ analyticsOutline, walletOutline });
+    addIcons({ albumsOutline, analyticsOutline });
   }
 
   public ngOnInit() {

libs/ui/src/lib/activities-table/activities-table.component.html

@@ -437,6 +437,14 @@
           class="no-max-width"
           xPosition="before"
         >
+          @if (canClickActivity(element)) {
+            <button mat-menu-item (click)="onClickActivity(element)">
+              <span class="align-items-center d-flex">
+                <ion-icon class="mr-2" name="wallet-outline" />
+                <span i18n>View Holding</span>
+              </span>
+            </button>
+          }
           <button mat-menu-item (click)="onUpdateActivity(element)">
             <span class="align-items-center d-flex">
               <ion-icon class="mr-2" name="create-outline" />
@@ -479,11 +487,7 @@
       *matRowDef="let row; columns: displayedColumns"
       mat-row
       [ngClass]="{
-        'cursor-pointer':
+        'cursor-pointer': canClickActivity(row)
-          hasPermissionToOpenDetails &&
-          isExcludedFromAnalysis(row) === false &&
-          row.isDraft === false &&
-          ['BUY', 'DIVIDEND', 'SELL'].includes(row.type)
       }"
       (click)="onClickActivity(row)"
     ></tr>

libs/ui/src/lib/activities-table/activities-table.component.ts

@@ -56,7 +56,8 @@ import {
   documentTextOutline,
   ellipsisHorizontal,
   ellipsisVertical,
-  trashOutline
+  trashOutline,
+  walletOutline
 } from 'ionicons/icons';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
 import { Subject, Subscription, takeUntil } from 'rxjs';
@@ -153,7 +154,8 @@ export class GfActivitiesTableComponent
       documentTextOutline,
       ellipsisHorizontal,
       ellipsisVertical,
-      trashOutline
+      trashOutline,
+      walletOutline
     });
   }
 
@@ -226,6 +228,15 @@ export class GfActivitiesTableComponent
     return numSelectedRows === numTotalRows;
   }
 
+  public canClickActivity(activity: Activity) {
+    return (
+      this.hasPermissionToOpenDetails &&
+      this.isExcludedFromAnalysis(activity) === false &&
+      activity.isDraft === false &&
+      ['BUY', 'DIVIDEND', 'SELL'].includes(activity.type)
+    );
+  }
+
   public isExcludedFromAnalysis(activity: Activity) {
     return (
       activity.account?.isExcluded ||
@@ -244,12 +255,7 @@ export class GfActivitiesTableComponent
       if (!activity.error) {
         this.selectedRows.toggle(activity);
       }
-    } else if (
+    } else if (this.canClickActivity(activity)) {
-      this.hasPermissionToOpenDetails &&
-      this.isExcludedFromAnalysis(activity) === false &&
-      activity.isDraft === false &&
-      ['BUY', 'DIVIDEND', 'SELL'].includes(activity.type)
-    ) {
       this.activityClicked.emit({
         dataSource: activity.SymbolProfile.dataSource,
         symbol: activity.SymbolProfile.symbol