Feature/add total column to tag management (#7970)

* Add total column (accountCount + activityCount)

* Update changelog

CHANGELOG.md

@@ -5,6 +5,12 @@ 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
+
+### Added
+
+- Added the total column to the table of the tag management in the admin control panel
+
 ## 3.75.0 - 2026-09-28
 
 ### Changed

apps/client/src/app/components/admin-tag/admin-tag.component.html

@@ -77,6 +77,24 @@
       </td>
     </ng-container>
 
+    <ng-container matColumnDef="total">
+      <th
+        *matHeaderCellDef
+        class="justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header="totalCount"
+      >
+        <ng-container i18n>Total</ng-container>
+      </th>
+      <td *matCellDef="let element" class="px-1 text-right" mat-cell>
+        <gf-value
+          class="d-inline-block justify-content-end"
+          [locale]="locale()"
+          [value]="getTotalCount(element)"
+        />
+      </td>
+    </ng-container>
+
     <ng-container matColumnDef="actions" stickyEnd>
       <th *matHeaderCellDef class="px-1 text-center" mat-header-cell></th>
       <td *matCellDef="let element" class="px-1 text-center" mat-cell>

apps/client/src/app/components/admin-tag/admin-tag.component.ts

@@ -7,6 +7,7 @@ import {
   getLowercase,
   isSystemTag
 } from '@ghostfolio/common/helper';
+import { TagWithAccountAndActivityCount } from '@ghostfolio/common/types';
 import { translate } from '@ghostfolio/ui/i18n';
 import { NotificationService } from '@ghostfolio/ui/notifications';
 import { DataService } from '@ghostfolio/ui/services';
@@ -32,7 +33,6 @@ import { MatSort, MatSortModule } from '@angular/material/sort';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
 import { IonIcon } from '@ionic/angular/standalone';
-import { Tag } from '@prisma/client';
 import { addIcons } from 'ionicons';
 import {
   createOutline,
@@ -63,17 +63,20 @@ import { CreateOrUpdateTagDialogParams } from './create-or-update-tag-dialog/int
 export class GfAdminTagComponent implements OnInit {
   public readonly locale = input(getLocale());
 
-  protected dataSource = new MatTableDataSource<Tag>();
+  protected dataSource =
+    new MatTableDataSource<TagWithAccountAndActivityCount>();
+
   protected readonly displayedColumns = [
     'name',
     'userId',
     'accounts',
     'activities',
+    'total',
     'actions'
   ];
   protected readonly isSystemTag = isSystemTag;
   protected readonly pageSize = DEFAULT_PAGE_SIZE;
-  protected tags: Tag[];
+  protected tags: TagWithAccountAndActivityCount[];
   protected readonly translate = translate;
 
   private readonly deviceType = computed(
@@ -120,6 +123,13 @@ export class GfAdminTagComponent implements OnInit {
     this.fetchTags();
   }
 
+  protected getTotalCount({
+    accountCount,
+    activityCount
+  }: TagWithAccountAndActivityCount) {
+    return accountCount + activityCount;
+  }
+
   protected onDeleteTag(aId: string) {
     this.notificationService.confirm({
       confirmFn: () => {
@@ -130,7 +140,7 @@ export class GfAdminTagComponent implements OnInit {
     });
   }
 
-  protected onUpdateTag({ id }: Tag) {
+  protected onUpdateTag({ id }: TagWithAccountAndActivityCount) {
     this.router.navigate([], {
       queryParams: { editTagDialog: true, tagId: id }
     });
@@ -164,9 +174,13 @@ export class GfAdminTagComponent implements OnInit {
         this.dataSource.sort = this.sort();
 
         this.dataSource.sortingDataAccessor = (tag, path) => {
-          return path === 'name'
+          if (path === 'name') {
-            ? translate(tag.name).toLocaleLowerCase()
+            return translate(tag.name).toLocaleLowerCase();
-            : (getLowercase(tag, path) as number | string);
+          } else if (path === 'totalCount') {
+            return this.getTotalCount(tag);
+          }
+
+          return getLowercase(tag, path) as number | string;
         };
 
         this.dataService.updateInfo();

libs/common/src/lib/types/index.ts

@@ -24,6 +24,7 @@ import type { PropertyKey } from './property-key.type';
 import type { RequestWithUser } from './request-with-user.type';
 import type { SectorName } from './sector-name.type';
 import type { SubscriptionOfferKey } from './subscription-offer-key.type';
+import type { TagWithAccountAndActivityCount } from './tag-with-account-and-activity-count.type';
 import type { ToggleOption } from './toggle-option.type';
 import type { UserWithSettings } from './user-with-settings.type';
 import type { ViewMode } from './view-mode.type';
@@ -55,6 +56,7 @@ export type {
   RequestWithUser,
   SectorName,
   SubscriptionOfferKey,
+  TagWithAccountAndActivityCount,
   ToggleOption,
   UserWithSettings,
   ViewMode

libs/common/src/lib/types/tag-with-account-and-activity-count.type.ts

@@ -0,0 +1,6 @@
+import { Tag } from '@prisma/client';
+
+export type TagWithAccountAndActivityCount = Tag & {
+  accountCount: number;
+  activityCount: number;
+};

libs/ui/src/lib/services/data.service.ts

@@ -62,7 +62,8 @@ import { filterGlobalPermissions } from '@ghostfolio/common/permissions';
 import type {
   AiPromptMode,
   DateRange,
-  GroupBy
+  GroupBy,
+  TagWithAccountAndActivityCount
 } from '@ghostfolio/common/types';
 import { translate } from '@ghostfolio/ui/i18n';
 
@@ -843,7 +844,7 @@ export class DataService {
   }
 
   public fetchTags() {
-    return this.http.get<Tag[]>('/api/v1/tags');
+    return this.http.get<TagWithAccountAndActivityCount[]>('/api/v1/tags');
   }
 
   public fetchWatchlist() {