Release 1.142.0 (#869)

* Improve users table

* Update changelog

CHANGELOG.md

@@ -5,6 +5,45 @@ 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).
 
+## 1.142.0 - 25.04.2022
+
+### Added
+
+- Added the tags to the create or edit transaction dialog
+- Added the tags to the position detail dialog
+
+### Changed
+
+- Changed the date to UTC in the data gathering service
+- Reused the value component in the users table of the admin control panel
+
+## 1.141.1 - 24.04.2022
+
+### Added
+
+- Added the database migration
+
+### Todo
+
+- Apply data migration (`yarn database:migrate`)
+
+## 1.141.0 - 24.04.2022
+
+### Added
+
+- Added a tagging system for activities
+
+### Changed
+
+- Extracted the activities table filter to a dedicated component
+- Changed the url of the _Get Started_ link to `https://ghostfol.io` on the public page
+- Simplified `@@id` using multiple fields with `@id` in the database schema of (`Access`, `Order`, `Subscription`)
+- Upgraded `prisma` from version `3.11.1` to `3.12.0`
+
+### Todo
+
+- Apply data migration (`yarn database:migrate`)
+
 ## 1.140.2 - 22.04.2022
 
 ### Added

apps/api/src/app/access/access.controller.ts

@@ -78,8 +78,12 @@ export class AccessController {
   @Delete(':id')
   @UseGuards(AuthGuard('jwt'))
   public async deleteAccess(@Param('id') id: string): Promise<AccessModule> {
+    const access = await this.accessService.access({ id });
+
     if (
-      !hasPermission(this.request.user.permissions, permissions.deleteAccess)
+      !hasPermission(this.request.user.permissions, permissions.deleteAccess) ||
+      !access ||
+      access.userId !== this.request.user.id
     ) {
       throw new HttpException(
         getReasonPhrase(StatusCodes.FORBIDDEN),
@@ -88,10 +92,7 @@ export class AccessController {
     }
 
     return this.accessService.deleteAccess({
-      id_userId: {
-        id,
-        userId: this.request.user.id
-      }
+      id
     });
   }
 }

apps/api/src/app/info/info.module.ts

@@ -6,6 +6,7 @@ import { ExchangeRateDataModule } from '@ghostfolio/api/services/exchange-rate-d
 import { PrismaModule } from '@ghostfolio/api/services/prisma.module';
 import { PropertyModule } from '@ghostfolio/api/services/property/property.module';
 import { SymbolProfileModule } from '@ghostfolio/api/services/symbol-profile.module';
+import { TagModule } from '@ghostfolio/api/services/tag/tag.module';
 import { Module } from '@nestjs/common';
 import { JwtModule } from '@nestjs/jwt';
 
@@ -26,7 +27,8 @@ import { InfoService } from './info.service';
     PrismaModule,
     PropertyModule,
     RedisCacheModule,
-    SymbolProfileModule
+    SymbolProfileModule,
+    TagModule
   ],
   providers: [InfoService]
 })

apps/api/src/app/info/info.service.ts

@@ -4,6 +4,7 @@ import { DataGatheringService } from '@ghostfolio/api/services/data-gathering.se
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
 import { PropertyService } from '@ghostfolio/api/services/property/property.service';
+import { TagService } from '@ghostfolio/api/services/tag/tag.service';
 import {
   DEMO_USER_ID,
   PROPERTY_IS_READ_ONLY_MODE,
@@ -33,7 +34,8 @@ export class InfoService {
     private readonly jwtService: JwtService,
     private readonly prismaService: PrismaService,
     private readonly propertyService: PropertyService,
-    private readonly redisCacheService: RedisCacheService
+    private readonly redisCacheService: RedisCacheService,
+    private readonly tagService: TagService
   ) {}
 
   public async get(): Promise<InfoItem> {
@@ -105,7 +107,8 @@ export class InfoService {
       demoAuthToken: this.getDemoAuthToken(),
       lastDataGathering: await this.getLastDataGathering(),
       statistics: await this.getStatistics(),
-      subscriptions: await this.getSubscriptions()
+      subscriptions: await this.getSubscriptions(),
+      tags: await this.tagService.get()
     };
   }
 

apps/api/src/app/order/order.controller.ts

@@ -42,8 +42,12 @@ export class OrderController {
   @Delete(':id')
   @UseGuards(AuthGuard('jwt'))
   public async deleteOrder(@Param('id') id: string): Promise<OrderModel> {
+    const order = await this.orderService.order({ id });
+
     if (
-      !hasPermission(this.request.user.permissions, permissions.deleteOrder)
+      !hasPermission(this.request.user.permissions, permissions.deleteOrder) ||
+      !order ||
+      order.userId !== this.request.user.id
     ) {
       throw new HttpException(
         getReasonPhrase(StatusCodes.FORBIDDEN),
@@ -52,10 +56,7 @@ export class OrderController {
     }
 
     return this.orderService.deleteOrder({
-      id_userId: {
-        id,
-        userId: this.request.user.id
-      }
+      id
     });
   }
 
@@ -135,23 +136,15 @@ export class OrderController {
   @UseGuards(AuthGuard('jwt'))
   @UseInterceptors(TransformDataSourceInRequestInterceptor)
   public async update(@Param('id') id: string, @Body() data: UpdateOrderDto) {
-    if (
-      !hasPermission(this.request.user.permissions, permissions.updateOrder)
-    ) {
-      throw new HttpException(
-        getReasonPhrase(StatusCodes.FORBIDDEN),
-        StatusCodes.FORBIDDEN
-      );
-    }
-
     const originalOrder = await this.orderService.order({
-      id_userId: {
-        id,
-        userId: this.request.user.id
-      }
+      id
     });
 
-    if (!originalOrder) {
+    if (
+      !hasPermission(this.request.user.permissions, permissions.updateOrder) ||
+      !originalOrder ||
+      originalOrder.userId !== this.request.user.id
+    ) {
       throw new HttpException(
         getReasonPhrase(StatusCodes.FORBIDDEN),
         StatusCodes.FORBIDDEN
@@ -183,10 +176,7 @@ export class OrderController {
         User: { connect: { id: this.request.user.id } }
       },
       where: {
-        id_userId: {
-          id,
-          userId: this.request.user.id
-        }
+        id
       }
     });
   }

apps/api/src/app/order/order.service.ts

@@ -152,11 +152,13 @@ export class OrderService {
 
   public async getOrders({
     includeDrafts = false,
+    tags,
     types,
     userCurrency,
     userId
   }: {
     includeDrafts?: boolean;
+    tags?: string[];
     types?: TypeOfOrder[];
     userCurrency: string;
     userId: string;
@@ -167,6 +169,18 @@ export class OrderService {
       where.isDraft = false;
     }
 
+    if (tags?.length > 0) {
+      where.tags = {
+        some: {
+          OR: tags.map((tag) => {
+            return {
+              name: tag
+            };
+          })
+        }
+      };
+    }
+
     if (types) {
       where.OR = types.map((type) => {
         return {
@@ -188,7 +202,8 @@ export class OrderService {
             }
           },
           // eslint-disable-next-line @typescript-eslint/naming-convention
-          SymbolProfile: true
+          SymbolProfile: true,
+          tags: true
         },
         orderBy: { date: 'asc' }
       })

apps/api/src/app/portfolio/interfaces/portfolio-position-detail.interface.ts

@@ -1,5 +1,6 @@
 import { EnhancedSymbolProfile } from '@ghostfolio/api/services/interfaces/symbol-profile.interface';
 import { OrderWithAccount } from '@ghostfolio/common/types';
+import { Tag } from '@prisma/client';
 
 export interface PortfolioPositionDetail {
   averagePrice: number;
@@ -16,6 +17,7 @@ export interface PortfolioPositionDetail {
   orders: OrderWithAccount[];
   quantity: number;
   SymbolProfile: EnhancedSymbolProfile;
+  tags: Tag[];
   transactionCount: number;
   value: number;
 }

apps/api/src/app/portfolio/portfolio.controller.ts

@@ -105,7 +105,8 @@ export class PortfolioController {
   @UseInterceptors(TransformDataSourceInResponseInterceptor)
   public async getDetails(
     @Headers('impersonation-id') impersonationId: string,
-    @Query('range') range
+    @Query('range') range,
+    @Query('tags') tags?: string
   ): Promise<PortfolioDetails & { hasError: boolean }> {
     let hasError = false;
 
@@ -113,7 +114,8 @@ export class PortfolioController {
       await this.portfolioService.getDetails(
         impersonationId,
         this.request.user.id,
-        range
+        range,
+        tags?.split(',')
       );
 
     if (hasErrors || hasNotDefinedValuesInObject(holdings)) {
@@ -159,7 +161,11 @@ export class PortfolioController {
       this.configurationService.get('ENABLE_FEATURE_SUBSCRIPTION') &&
       this.request.user.subscription.type === 'Basic';
 
-    return { accounts, hasError, holdings: isBasicUser ? {} : holdings };
+    return {
+      hasError,
+      accounts: tags ? {} : accounts,
+      holdings: isBasicUser ? {} : holdings
+    };
   }
 
   @Get('investments')

apps/api/src/app/portfolio/portfolio.service.ts

@@ -46,7 +46,12 @@ import type {
 } from '@ghostfolio/common/types';
 import { Inject, Injectable } from '@nestjs/common';
 import { REQUEST } from '@nestjs/core';
-import { AssetClass, DataSource, Type as TypeOfOrder } from '@prisma/client';
+import {
+  AssetClass,
+  DataSource,
+  Tag,
+  Type as TypeOfOrder
+} from '@prisma/client';
 import Big from 'big.js';
 import {
   differenceInDays,
@@ -62,7 +67,7 @@ import {
   subDays,
   subYears
 } from 'date-fns';
-import { isEmpty, sortBy } from 'lodash';
+import { isEmpty, sortBy, uniqBy } from 'lodash';
 
 import {
   HistoricalDataContainer,
@@ -303,7 +308,8 @@ export class PortfolioService {
   public async getDetails(
     aImpersonationId: string,
     aUserId: string,
-    aDateRange: DateRange = 'max'
+    aDateRange: DateRange = 'max',
+    tags?: string[]
   ): Promise<PortfolioDetails & { hasErrors: boolean }> {
     const userId = await this.getUserId(aImpersonationId, aUserId);
     const user = await this.userService.user({ id: userId });
@@ -318,6 +324,7 @@ export class PortfolioService {
 
     const { orders, portfolioOrders, transactionPoints } =
       await this.getTransactionPoints({
+        tags,
         userId
       });
 
@@ -441,8 +448,10 @@ export class PortfolioService {
       value: totalValue
     });
 
-    for (const symbol of Object.keys(cashPositions)) {
-      holdings[symbol] = cashPositions[symbol];
+    if (tags === undefined) {
+      for (const symbol of Object.keys(cashPositions)) {
+        holdings[symbol] = cashPositions[symbol];
+      }
     }
 
     const accounts = await this.getValueOfAccounts(
@@ -472,8 +481,11 @@ export class PortfolioService {
       );
     });
 
+    let tags: Tag[] = [];
+
     if (orders.length <= 0) {
       return {
+        tags,
         averagePrice: undefined,
         firstBuyDate: undefined,
         grossPerformance: undefined,
@@ -500,6 +512,8 @@ export class PortfolioService {
 
     const portfolioOrders: PortfolioOrder[] = orders
       .filter((order) => {
+        tags = tags.concat(order.tags);
+
         return order.type === 'BUY' || order.type === 'SELL';
       })
       .map((order) => ({
@@ -514,6 +528,8 @@ export class PortfolioService {
         unitPrice: new Big(order.unitPrice)
       }));
 
+    tags = uniqBy(tags, 'id');
+
     const portfolioCalculator = new PortfolioCalculator({
       currency: positionCurrency,
       currentRateService: this.currentRateService,
@@ -622,6 +638,7 @@ export class PortfolioService {
         netPerformance,
         orders,
         SymbolProfile,
+        tags,
         transactionCount,
         averagePrice: averagePrice.toNumber(),
         grossPerformancePercent:
@@ -678,6 +695,7 @@ export class PortfolioService {
         minPrice,
         orders,
         SymbolProfile,
+        tags,
         averagePrice: 0,
         firstBuyDate: undefined,
         grossPerformance: undefined,
@@ -1178,9 +1196,11 @@ export class PortfolioService {
 
   private async getTransactionPoints({
     includeDrafts = false,
+    tags,
     userId
   }: {
     includeDrafts?: boolean;
+    tags?: string[];
     userId: string;
   }): Promise<{
     transactionPoints: TransactionPoint[];
@@ -1191,6 +1211,7 @@ export class PortfolioService {
 
     const orders = await this.orderService.getOrders({
       includeDrafts,
+      tags,
       userCurrency,
       userId,
       types: ['BUY', 'SELL']

apps/api/src/app/user/user.controller.ts

@@ -34,7 +34,7 @@ import { UserService } from './user.service';
 export class UserController {
   public constructor(
     private readonly configurationService: ConfigurationService,
-    private jwtService: JwtService,
+    private readonly jwtService: JwtService,
     private readonly propertyService: PropertyService,
     @Inject(REQUEST) private readonly request: RequestWithUser,
     private readonly userService: UserService

apps/api/src/app/user/user.module.ts

@@ -2,6 +2,7 @@ import { SubscriptionModule } from '@ghostfolio/api/app/subscription/subscriptio
 import { ConfigurationModule } from '@ghostfolio/api/services/configuration.module';
 import { PrismaModule } from '@ghostfolio/api/services/prisma.module';
 import { PropertyModule } from '@ghostfolio/api/services/property/property.module';
+import { TagModule } from '@ghostfolio/api/services/tag/tag.module';
 import { Module } from '@nestjs/common';
 import { JwtModule } from '@nestjs/jwt';
 
@@ -19,7 +20,8 @@ import { UserService } from './user.service';
     }),
     PrismaModule,
     PropertyModule,
-    SubscriptionModule
+    SubscriptionModule,
+    TagModule
   ],
   providers: [UserService]
 })

apps/api/src/app/user/user.service.ts

@@ -2,6 +2,7 @@ import { SubscriptionService } from '@ghostfolio/api/app/subscription/subscripti
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
 import { PropertyService } from '@ghostfolio/api/services/property/property.service';
+import { TagService } from '@ghostfolio/api/services/tag/tag.service';
 import {
   PROPERTY_IS_READ_ONLY_MODE,
   baseCurrency,
@@ -13,7 +14,6 @@ import {
   hasRole,
   permissions
 } from '@ghostfolio/common/permissions';
-import { SubscriptionType } from '@ghostfolio/common/types/subscription.type';
 import { Injectable } from '@nestjs/common';
 import { Prisma, Role, User, ViewMode } from '@prisma/client';
 
@@ -30,7 +30,8 @@ export class UserService {
     private readonly configurationService: ConfigurationService,
     private readonly prismaService: PrismaService,
     private readonly propertyService: PropertyService,
-    private readonly subscriptionService: SubscriptionService
+    private readonly subscriptionService: SubscriptionService,
+    private readonly tagService: TagService
   ) {}
 
   public async getUser(
@@ -51,12 +52,21 @@ export class UserService {
       orderBy: { User: { alias: 'asc' } },
       where: { GranteeUser: { id } }
     });
+    let tags = await this.tagService.getByUser(id);
+
+    if (
+      this.configurationService.get('ENABLE_FEATURE_SUBSCRIPTION') &&
+      subscription.type === 'Basic'
+    ) {
+      tags = [];
+    }
 
     return {
       alias,
       id,
       permissions,
       subscription,
+      tags,
       access: access.map((accessItem) => {
         return {
           alias: accessItem.User.alias,

apps/api/src/services/data-gathering.service.ts

@@ -377,7 +377,14 @@ export class DataGatheringService {
                 data: {
                   dataSource,
                   symbol,
-                  date: currentDate,
+                  date: new Date(
+                    Date.UTC(
+                      getYear(currentDate),
+                      getMonth(currentDate),
+                      getDate(currentDate),
+                      0
+                    )
+                  ),
                   marketPrice: lastMarketPrice
                 }
               });
@@ -537,6 +544,7 @@ export class DataGatheringService {
       await this.prismaService.marketData.groupBy({
         _count: true,
         by: ['symbol'],
+        orderBy: [{ symbol: 'asc' }],
         where: {
           date: { gt: startDate }
         }

apps/api/src/services/tag/tag.module.ts

@@ -0,0 +1,11 @@
+import { PrismaModule } from '@ghostfolio/api/services/prisma.module';
+import { Module } from '@nestjs/common';
+
+import { TagService } from './tag.service';
+
+@Module({
+  exports: [TagService],
+  imports: [PrismaModule],
+  providers: [TagService]
+})
+export class TagModule {}

apps/api/src/services/tag/tag.service.ts

@@ -0,0 +1,30 @@
+import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { Injectable } from '@nestjs/common';
+
+@Injectable()
+export class TagService {
+  public constructor(private readonly prismaService: PrismaService) {}
+
+  public async get() {
+    return this.prismaService.tag.findMany({
+      orderBy: {
+        name: 'asc'
+      }
+    });
+  }
+
+  public async getByUser(userId: string) {
+    return this.prismaService.tag.findMany({
+      orderBy: {
+        name: 'asc'
+      },
+      where: {
+        orders: {
+          some: {
+            userId
+          }
+        }
+      }
+    });
+  }
+}

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

@@ -1,6 +1,7 @@
 import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { DataService } from '@ghostfolio/client/services/data.service';
-import { AdminData } from '@ghostfolio/common/interfaces';
+import { UserService } from '@ghostfolio/client/services/user/user.service';
+import { AdminData, User } from '@ghostfolio/common/interfaces';
 import {
   differenceInSeconds,
   formatDistanceToNowStrict,
@@ -15,6 +16,7 @@ import { takeUntil } from 'rxjs/operators';
   templateUrl: './admin-users.html'
 })
 export class AdminUsersComponent implements OnDestroy, OnInit {
+  public user: User;
   public users: AdminData['users'];
 
   private unsubscribeSubject = new Subject<void>();
@@ -24,8 +26,17 @@ export class AdminUsersComponent implements OnDestroy, OnInit {
    */
   public constructor(
     private changeDetectorRef: ChangeDetectorRef,
-    private dataService: DataService
-  ) {}
+    private dataService: DataService,
+    private userService: UserService
+  ) {
+    this.userService.stateChanged
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe((state) => {
+        if (state?.user) {
+          this.user = state.user;
+        }
+      });
+  }
 
   /**
    * Initializes the controller

apps/client/src/app/components/admin-users/admin-users.html

@@ -45,14 +45,27 @@
               <td class="mat-cell px-1 py-2 text-right">
                 {{ formatDistanceToNow(userItem.createdAt) }}
               </td>
-              <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem.accountCount }}
+              <td class="mat-cell px-1 py-2">
+                <gf-value
+                  class="align-items-end"
+                  [locale]="user?.settings?.locale"
+                  [value]="userItem.accountCount"
+                ></gf-value>
               </td>
-              <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem.transactionCount }}
+              <td class="mat-cell px-1 py-2">
+                <gf-value
+                  class="align-items-end"
+                  [locale]="user?.settings?.locale"
+                  [value]="userItem.transactionCount"
+                ></gf-value>
               </td>
-              <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem.engagement | number: '1.0-0' }}
+              <td class="mat-cell px-1 py-2">
+                <gf-value
+                  class="align-items-end"
+                  [locale]="user?.settings?.locale"
+                  [precision]="0"
+                  [value]="userItem.engagement"
+                ></gf-value>
               </td>
               <td class="mat-cell px-1 py-2">
                 {{ formatDistanceToNow(userItem.lastActivity) }}

apps/client/src/app/components/admin-users/admin-users.module.ts

@@ -2,13 +2,14 @@ import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import { MatMenuModule } from '@angular/material/menu';
+import { GfValueModule } from '@ghostfolio/ui/value';
 
 import { AdminUsersComponent } from './admin-users.component';
 
 @NgModule({
   declarations: [AdminUsersComponent],
   exports: [],
-  imports: [CommonModule, MatButtonModule, MatMenuModule],
+  imports: [CommonModule, GfValueModule, MatButtonModule, MatMenuModule],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })
 export class GfAdminUsersModule {}

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

@@ -11,7 +11,7 @@ import { DataService } from '@ghostfolio/client/services/data.service';
 import { DATE_FORMAT, downloadAsFile } from '@ghostfolio/common/helper';
 import { OrderWithAccount } from '@ghostfolio/common/types';
 import { LineChartItem } from '@ghostfolio/ui/line-chart/interfaces/line-chart.interface';
-import { SymbolProfile } from '@prisma/client';
+import { SymbolProfile, Tag } from '@prisma/client';
 import { format, isSameMonth, isToday, parseISO } from 'date-fns';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
@@ -48,6 +48,7 @@ export class PositionDetailDialog implements OnDestroy, OnInit {
     [name: string]: { name: string; value: number };
   };
   public SymbolProfile: SymbolProfile;
+  public tags: Tag[];
   public transactionCount: number;
   public value: number;
 
@@ -83,6 +84,7 @@ export class PositionDetailDialog implements OnDestroy, OnInit {
           orders,
           quantity,
           SymbolProfile,
+          tags,
           transactionCount,
           value
         }) => {
@@ -115,6 +117,7 @@ export class PositionDetailDialog implements OnDestroy, OnInit {
           this.quantity = quantity;
           this.sectors = {};
           this.SymbolProfile = SymbolProfile;
+          this.tags = tags;
           this.transactionCount = transactionCount;
           this.value = value;
 

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

@@ -194,21 +194,31 @@
     </div>
   </div>
 
-  <gf-activities-table
-    *ngIf="orders?.length > 0"
-    [activities]="orders"
-    [baseCurrency]="data.baseCurrency"
-    [deviceType]="data.deviceType"
-    [hasPermissionToCreateActivity]="false"
-    [hasPermissionToExportActivities]="!hasImpersonationId"
-    [hasPermissionToFilter]="false"
-    [hasPermissionToImportActivities]="false"
-    [hasPermissionToOpenDetails]="false"
-    [locale]="data.locale"
-    [showActions]="false"
-    [showSymbolColumn]="false"
-    (export)="onExport()"
-  ></gf-activities-table>
+  <div class="mb-3">
+    <div class="h4 mb-0" i18n>Activities</div>
+    <gf-activities-table
+      *ngIf="orders?.length > 0"
+      [activities]="orders"
+      [baseCurrency]="data.baseCurrency"
+      [deviceType]="data.deviceType"
+      [hasPermissionToCreateActivity]="false"
+      [hasPermissionToExportActivities]="!hasImpersonationId"
+      [hasPermissionToFilter]="false"
+      [hasPermissionToImportActivities]="false"
+      [hasPermissionToOpenDetails]="false"
+      [locale]="data.locale"
+      [showActions]="false"
+      [showSymbolColumn]="false"
+      (export)="onExport()"
+    ></gf-activities-table>
+  </div>
+
+  <div *ngIf="tags?.length > 0">
+    <div class="h4" i18n>Tags</div>
+    <mat-chip-list>
+      <mat-chip *ngFor="let tag of tags">{{ tag.name }}</mat-chip>
+    </mat-chip-list>
+  </div>
 </div>
 
 <gf-dialog-footer

apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.module.ts

@@ -1,6 +1,7 @@
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
 import { MatDialogModule } from '@angular/material/dialog';
 import { GfDialogFooterModule } from '@ghostfolio/client/components/dialog-footer/dialog-footer.module';
 import { GfDialogHeaderModule } from '@ghostfolio/client/components/dialog-header/dialog-header.module';
@@ -24,6 +25,7 @@ import { PositionDetailDialog } from './position-detail-dialog.component';
     GfPortfolioProportionChartModule,
     GfValueModule,
     MatButtonModule,
+    MatChipsModule,
     MatDialogModule,
     NgxSkeletonLoaderModule
   ],

apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts

@@ -48,6 +48,7 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
     { label: 'Initial', value: 'original' },
     { label: 'Current', value: 'current' }
   ];
+  public placeholder = '';
   public portfolioDetails: PortfolioDetails;
   public positions: {
     [symbol: string]: Pick<
@@ -73,6 +74,7 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
       value: number;
     };
   };
+  public tags: string[] = [];
 
   public user: User;
 
@@ -120,29 +122,22 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
         this.hasImpersonationId = !!aId;
       });
 
-    this.dataService
-      .fetchPortfolioDetails({})
-      .pipe(takeUntil(this.unsubscribeSubject))
-      .subscribe((portfolioDetails) => {
-        this.portfolioDetails = portfolioDetails;
-
-        this.initializeAnalysisData(this.period);
-
-        this.changeDetectorRef.markForCheck();
-      });
-
     this.userService.stateChanged
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe((state) => {
         if (state?.user) {
           this.user = state.user;
 
+          this.tags = this.user.tags.map((tag) => {
+            return tag.name;
+          });
+
           this.changeDetectorRef.markForCheck();
         }
       });
   }
 
-  public initializeAnalysisData(aPeriod: string) {
+  public initialize() {
     this.accounts = {};
     this.continents = {
       [UNKNOWN_KEY]: {
@@ -185,6 +180,10 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
         value: 0
       }
     };
+  }
+
+  public initializeAnalysisData(aPeriod: string) {
+    this.initialize();
 
     for (const [id, { current, name, original }] of Object.entries(
       this.portfolioDetails.accounts
@@ -305,7 +304,7 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
         }
       }
 
-      if (position.assetClass === AssetClass.EQUITY) {
+      if (position.dataSource) {
         this.symbols[prettifySymbol(symbol)] = {
           dataSource: position.dataSource,
           name: position.name,
@@ -342,6 +341,25 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
     }
   }
 
+  public onUpdateFilters(tags: string[] = []) {
+    this.update(tags);
+  }
+
+  public update(tags?: string[]) {
+    this.initialize();
+
+    this.dataService
+      .fetchPortfolioDetails({ tags })
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe((portfolioDetails) => {
+        this.portfolioDetails = portfolioDetails;
+
+        this.initializeAnalysisData(this.period);
+
+        this.changeDetectorRef.markForCheck();
+      });
+  }
+
   public ngOnDestroy() {
     this.unsubscribeSubject.next();
     this.unsubscribeSubject.complete();

apps/client/src/app/pages/portfolio/allocations/allocations-page.html

@@ -2,6 +2,12 @@
   <div class="row">
     <div class="col">
       <h3 class="d-flex justify-content-center mb-3" i18n>Allocations</h3>
+      <gf-activities-filter
+        [allFilters]="tags"
+        [ngClass]="{ 'd-none': tags.length <= 0 }"
+        [placeholder]="placeholder"
+        (valueChanged)="onUpdateFilters($event)"
+      ></gf-activities-filter>
     </div>
   </div>
   <div class="proportion-charts row">

apps/client/src/app/pages/portfolio/allocations/allocations-page.module.ts

@@ -4,6 +4,7 @@ import { MatCardModule } from '@angular/material/card';
 import { GfPositionsTableModule } from '@ghostfolio/client/components/positions-table/positions-table.module';
 import { GfToggleModule } from '@ghostfolio/client/components/toggle/toggle.module';
 import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
+import { GfActivitiesFilterModule } from '@ghostfolio/ui/activities-filter/activities-filter.module';
 import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart/portfolio-proportion-chart.module';
 import { GfValueModule } from '@ghostfolio/ui/value';
 
@@ -16,6 +17,7 @@ import { AllocationsPageComponent } from './allocations-page.component';
   imports: [
     AllocationsPageRoutingModule,
     CommonModule,
+    GfActivitiesFilterModule,
     GfPortfolioProportionChartModule,
     GfPositionsTableModule,
     GfToggleModule,

apps/client/src/app/pages/portfolio/transactions/create-or-update-transaction-dialog/create-or-update-transaction-dialog.component.ts

@@ -86,6 +86,7 @@ export class CreateOrUpdateTransactionDialog implements OnDestroy {
         },
         Validators.required
       ],
+      tags: [this.data.activity?.tags],
       type: [undefined, Validators.required], // Set after value changes subscription
       unitPrice: [this.data.activity?.unitPrice, Validators.required]
     });

apps/client/src/app/pages/portfolio/transactions/create-or-update-transaction-dialog/create-or-update-transaction-dialog.html

@@ -134,6 +134,18 @@
         >
       </mat-form-field>
     </div>
+    <div
+      [ngClass]="{ 'd-none': activityForm.controls['tags']?.value?.length <= 0 }"
+    >
+      <mat-form-field appearance="outline" class="w-100">
+        <mat-label i18n>Tags</mat-label>
+        <mat-chip-list>
+          <mat-chip *ngFor="let tag of activityForm.controls['tags']?.value">
+            {{ tag.name }}
+          </mat-chip>
+        </mat-chip-list>
+      </mat-form-field>
+    </div>
   </div>
   <div class="d-flex" mat-dialog-actions>
     <gf-value

apps/client/src/app/pages/portfolio/transactions/create-or-update-transaction-dialog/create-or-update-transaction-dialog.module.ts

@@ -3,6 +3,7 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -24,6 +25,7 @@ import { CreateOrUpdateTransactionDialog } from './create-or-update-transaction-
     FormsModule,
     MatAutocompleteModule,
     MatButtonModule,
+    MatChipsModule,
     MatDatepickerModule,
     MatDialogModule,
     MatFormFieldModule,

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

@@ -119,7 +119,7 @@
         Ghostfolio empowers you to keep track of your wealth.
       </p>
       <div class="py-2 text-center">
-        <a color="primary" i18n mat-flat-button [routerLink]="['/']">
+        <a color="primary" href="https://ghostfol.io" i18n mat-flat-button>
           Get Started
         </a>
       </div>

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

@@ -182,9 +182,15 @@ export class DataService {
     );
   }
 
-  public fetchPortfolioDetails(aParams: { [param: string]: any }) {
+  public fetchPortfolioDetails({ tags }: { tags?: string[] }) {
+    let params = new HttpParams();
+
+    if (tags?.length > 0) {
+      params = params.append('tags', tags.join(','));
+    }
+
     return this.http.get<PortfolioDetails>('/api/v1/portfolio/details', {
-      params: aParams
+      params
     });
   }
 

libs/common/src/lib/interfaces/info-item.interface.ts

@@ -1,3 +1,4 @@
+import { Tag } from '@prisma/client';
 import { Statistics } from './statistics.interface';
 import { Subscription } from './subscription.interface';
 
@@ -13,4 +14,5 @@ export interface InfoItem {
   stripePublicKey?: string;
   subscriptions: Subscription[];
   systemMessage?: string;
+  tags: Tag[];
 }

libs/common/src/lib/interfaces/user.interface.ts

@@ -1,5 +1,5 @@
 import { Access } from '@ghostfolio/api/app/user/interfaces/access.interface';
-import { Account } from '@prisma/client';
+import { Account, Tag } from '@prisma/client';
 
 import { UserSettings } from './user-settings.interface';
 
@@ -14,4 +14,5 @@ export interface User {
     expiresAt?: Date;
     type: 'Basic' | 'Premium';
   };
+  tags: Tag[];
 }

libs/common/src/lib/types/order-with-account.type.ts

@@ -1,8 +1,9 @@
-import { Account, Order, Platform, SymbolProfile } from '@prisma/client';
+import { Account, Order, Platform, SymbolProfile, Tag } from '@prisma/client';
 
 type AccountWithPlatform = Account & { Platform?: Platform };
 
 export type OrderWithAccount = Order & {
   Account?: AccountWithPlatform;
   SymbolProfile?: SymbolProfile;
+  tags?: Tag[];
 };

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

@@ -0,0 +1,33 @@
+<mat-form-field appearance="outline" class="w-100">
+  <ion-icon class="mr-1" matPrefix name="search-outline"></ion-icon>
+  <mat-chip-list #chipList aria-label="Search keywords">
+    <mat-chip
+      *ngFor="let searchKeyword of searchKeywords"
+      class="mx-1 my-0 px-2 py-0"
+      matChipRemove
+      [removable]="true"
+      (removed)="removeKeyword(searchKeyword)"
+    >
+      {{ searchKeyword | gfSymbol }}
+      <ion-icon class="ml-2" matPrefix name="close-outline"></ion-icon>
+    </mat-chip>
+    <input
+      #searchInput
+      name="close-outline"
+      [formControl]="searchControl"
+      [matAutocomplete]="autocomplete"
+      [matChipInputFor]="chipList"
+      [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
+      [placeholder]="placeholder"
+      (matChipInputTokenEnd)="addKeyword($event)"
+    />
+  </mat-chip-list>
+  <mat-autocomplete
+    #autocomplete="matAutocomplete"
+    (optionSelected)="keywordSelected($event)"
+  >
+    <mat-option *ngFor="let filter of filters | async" [value]="filter">
+      {{ filter | gfSymbol }}
+    </mat-option>
+  </mat-autocomplete>
+</mat-form-field>

libs/ui/src/lib/activities-filter/activities-filter.component.scss

@@ -0,0 +1,22 @@
+@import '~apps/client/src/styles/ghostfolio-style';
+
+:host {
+  display: block;
+
+  ::ng-deep {
+    .mat-form-field-infix {
+      border-top: 0 solid transparent !important;
+    }
+  }
+
+  .mat-chip {
+    cursor: pointer;
+    min-height: 1.5rem !important;
+  }
+}
+
+:host-context(.is-dark-theme) {
+  .mat-form-field {
+    color: rgba(var(--light-primary-text));
+  }
+}

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

@@ -0,0 +1,108 @@
+import { COMMA, ENTER } from '@angular/cdk/keycodes';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  ElementRef,
+  EventEmitter,
+  Input,
+  OnChanges,
+  OnDestroy,
+  Output,
+  ViewChild
+} from '@angular/core';
+import { FormControl } from '@angular/forms';
+import {
+  MatAutocomplete,
+  MatAutocompleteSelectedEvent
+} from '@angular/material/autocomplete';
+import { MatChipInputEvent } from '@angular/material/chips';
+import { BehaviorSubject, Observable, Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+
+@Component({
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  selector: 'gf-activities-filter',
+  styleUrls: ['./activities-filter.component.scss'],
+  templateUrl: './activities-filter.component.html'
+})
+export class ActivitiesFilterComponent implements OnChanges, OnDestroy {
+  @Input() allFilters: string[];
+  @Input() placeholder: string;
+
+  @Output() valueChanged = new EventEmitter<string[]>();
+
+  @ViewChild('autocomplete') matAutocomplete: MatAutocomplete;
+  @ViewChild('searchInput') searchInput: ElementRef<HTMLInputElement>;
+
+  public filters$: Subject<string[]> = new BehaviorSubject([]);
+  public filters: Observable<string[]> = this.filters$.asObservable();
+  public searchControl = new FormControl();
+  public searchKeywords: string[] = [];
+  public separatorKeysCodes: number[] = [ENTER, COMMA];
+
+  private unsubscribeSubject = new Subject<void>();
+
+  public constructor() {
+    this.searchControl.valueChanges
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe((keyword) => {
+        if (keyword) {
+          const filterValue = keyword.toLowerCase();
+          this.filters$.next(
+            this.allFilters.filter(
+              (filter) => filter.toLowerCase().indexOf(filterValue) === 0
+            )
+          );
+        } else {
+          this.filters$.next(this.allFilters);
+        }
+      });
+  }
+
+  public ngOnChanges() {
+    if (this.allFilters) {
+      this.updateFilter();
+    }
+  }
+
+  public addKeyword({ input, value }: MatChipInputEvent): void {
+    if (value?.trim()) {
+      this.searchKeywords.push(value.trim());
+      this.updateFilter();
+    }
+
+    // Reset the input value
+    if (input) {
+      input.value = '';
+    }
+
+    this.searchControl.setValue(null);
+  }
+
+  public keywordSelected(event: MatAutocompleteSelectedEvent): void {
+    this.searchKeywords.push(event.option.viewValue);
+    this.updateFilter();
+    this.searchInput.nativeElement.value = '';
+    this.searchControl.setValue(null);
+  }
+
+  public removeKeyword(keyword: string): void {
+    const index = this.searchKeywords.indexOf(keyword);
+
+    if (index >= 0) {
+      this.searchKeywords.splice(index, 1);
+      this.updateFilter();
+    }
+  }
+
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
+  }
+
+  private updateFilter() {
+    this.filters$.next(this.allFilters);
+
+    this.valueChanged.emit(this.searchKeywords);
+  }
+}

libs/ui/src/lib/activities-filter/activities-filter.module.ts

@@ -0,0 +1,24 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatInputModule } from '@angular/material/input';
+import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
+
+import { ActivitiesFilterComponent } from './activities-filter.component';
+
+@NgModule({
+  declarations: [ActivitiesFilterComponent],
+  exports: [ActivitiesFilterComponent],
+  imports: [
+    CommonModule,
+    GfSymbolModule,
+    MatAutocompleteModule,
+    MatChipsModule,
+    MatInputModule,
+    ReactiveFormsModule
+  ],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
+})
+export class GfActivitiesFilterModule {}

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

@@ -1,40 +1,9 @@
-<mat-form-field
-  appearance="outline"
-  class="w-100"
+<gf-activities-filter
+  [allFilters]="allFilters"
   [ngClass]="{ 'd-none': !hasPermissionToFilter }"
->
-  <ion-icon class="mr-1" matPrefix name="search-outline"></ion-icon>
-  <mat-chip-list #chipList aria-label="Search keywords">
-    <mat-chip
-      *ngFor="let searchKeyword of searchKeywords"
-      class="mx-1 my-0 px-2 py-0"
-      matChipRemove
-      [removable]="true"
-      (removed)="removeKeyword(searchKeyword)"
-    >
-      {{ searchKeyword | gfSymbol }}
-      <ion-icon class="ml-2" matPrefix name="close-outline"></ion-icon>
-    </mat-chip>
-    <input
-      #searchInput
-      name="close-outline"
-      [formControl]="searchControl"
-      [matAutocomplete]="autocomplete"
-      [matChipInputFor]="chipList"
-      [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
-      [placeholder]="placeholder"
-      (matChipInputTokenEnd)="addKeyword($event)"
-    />
-  </mat-chip-list>
-  <mat-autocomplete
-    #autocomplete="matAutocomplete"
-    (optionSelected)="keywordSelected($event)"
-  >
-    <mat-option *ngFor="let filter of filters | async" [value]="filter">
-      {{ filter | gfSymbol }}
-    </mat-option>
-  </mat-autocomplete>
-</mat-form-field>
+  [placeholder]="placeholder"
+  (valueChanged)="updateFilter($event)"
+></gf-activities-filter>
 
 <div class="activities">
   <table

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

@@ -3,17 +3,6 @@
 :host {
   display: block;
 
-  ::ng-deep {
-    .mat-form-field-infix {
-      border-top: 0 solid transparent !important;
-    }
-  }
-
-  .mat-chip {
-    cursor: pointer;
-    min-height: 1.5rem !important;
-  }
-
   .activities {
     overflow-x: auto;
 
@@ -68,10 +57,6 @@
 }
 
 :host-context(.is-dark-theme) {
-  .mat-form-field {
-    color: rgba(var(--light-primary-text));
-  }
-
   .mat-table {
     td {
       &.mat-footer-cell {

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

@@ -1,8 +1,6 @@
-import { COMMA, ENTER } from '@angular/cdk/keycodes';
 import {
   ChangeDetectionStrategy,
   Component,
-  ElementRef,
   EventEmitter,
   Input,
   OnChanges,
@@ -11,11 +9,6 @@ import {
   ViewChild
 } from '@angular/core';
 import { FormControl } from '@angular/forms';
-import {
-  MatAutocomplete,
-  MatAutocompleteSelectedEvent
-} from '@angular/material/autocomplete';
-import { MatChipInputEvent } from '@angular/material/chips';
 import { MatSort } from '@angular/material/sort';
 import { MatTableDataSource } from '@angular/material/table';
 import { Router } from '@angular/router';
@@ -27,8 +20,7 @@ import Big from 'big.js';
 import { isUUID } from 'class-validator';
 import { endOfToday, format, isAfter } from 'date-fns';
 import { isNumber } from 'lodash';
-import { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
+import { Subject, Subscription } from 'rxjs';
 
 const SEARCH_PLACEHOLDER = 'Search for account, currency, symbol or type...';
 const SEARCH_STRING_SEPARATOR = ',';
@@ -59,16 +51,13 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
   @Output() exportDrafts = new EventEmitter<string[]>();
   @Output() import = new EventEmitter<void>();
 
-  @ViewChild('autocomplete') matAutocomplete: MatAutocomplete;
-  @ViewChild('searchInput') searchInput: ElementRef<HTMLInputElement>;
   @ViewChild(MatSort) sort: MatSort;
 
+  public allFilters: string[];
   public dataSource: MatTableDataSource<Activity> = new MatTableDataSource();
   public defaultDateFormat: string;
   public displayedColumns = [];
   public endOfToday = endOfToday();
-  public filters$: Subject<string[]> = new BehaviorSubject([]);
-  public filters: Observable<string[]> = this.filters$.asObservable();
   public hasDrafts = false;
   public isAfter = isAfter;
   public isLoading = true;
@@ -77,59 +66,12 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
   public routeQueryParams: Subscription;
   public searchControl = new FormControl();
   public searchKeywords: string[] = [];
-  public separatorKeysCodes: number[] = [ENTER, COMMA];
   public totalFees: number;
   public totalValue: number;
 
-  private allFilters: string[];
   private unsubscribeSubject = new Subject<void>();
 
-  public constructor(private router: Router) {
-    this.searchControl.valueChanges
-      .pipe(takeUntil(this.unsubscribeSubject))
-      .subscribe((keyword) => {
-        if (keyword) {
-          const filterValue = keyword.toLowerCase();
-          this.filters$.next(
-            this.allFilters.filter(
-              (filter) => filter.toLowerCase().indexOf(filterValue) === 0
-            )
-          );
-        } else {
-          this.filters$.next(this.allFilters);
-        }
-      });
-  }
-
-  public addKeyword({ input, value }: MatChipInputEvent): void {
-    if (value?.trim()) {
-      this.searchKeywords.push(value.trim());
-      this.updateFilter();
-    }
-
-    // Reset the input value
-    if (input) {
-      input.value = '';
-    }
-
-    this.searchControl.setValue(null);
-  }
-
-  public removeKeyword(keyword: string): void {
-    const index = this.searchKeywords.indexOf(keyword);
-
-    if (index >= 0) {
-      this.searchKeywords.splice(index, 1);
-      this.updateFilter();
-    }
-  }
-
-  public keywordSelected(event: MatAutocompleteSelectedEvent): void {
-    this.searchKeywords.push(event.option.viewValue);
-    this.updateFilter();
-    this.searchInput.nativeElement.value = '';
-    this.searchControl.setValue(null);
-  }
+  public constructor(private router: Router) {}
 
   public ngOnChanges() {
     this.displayedColumns = [
@@ -230,28 +172,23 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
     this.activityToUpdate.emit(aActivity);
   }
 
-  public ngOnDestroy() {
-    this.unsubscribeSubject.next();
-    this.unsubscribeSubject.complete();
-  }
-
-  private updateFilter() {
-    this.dataSource.filter = this.searchKeywords.join(SEARCH_STRING_SEPARATOR);
-    const lowercaseSearchKeywords = this.searchKeywords.map((keyword) =>
+  public updateFilter(filters: string[] = []) {
+    this.dataSource.filter = filters.join(SEARCH_STRING_SEPARATOR);
+    const lowercaseSearchKeywords = filters.map((keyword) =>
       keyword.trim().toLowerCase()
     );
 
     this.placeholder =
       lowercaseSearchKeywords.length <= 0 ? SEARCH_PLACEHOLDER : '';
 
+    this.searchKeywords = filters;
+
     this.allFilters = this.getSearchableFieldValues(this.activities).filter(
       (item) => {
         return !lowercaseSearchKeywords.includes(item.trim().toLowerCase());
       }
     );
 
-    this.filters$.next(this.allFilters);
-
     this.hasDrafts = this.dataSource.data.some((activity) => {
       return activity.isDraft === true;
     });
@@ -259,6 +196,31 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
     this.totalValue = this.getTotalValue();
   }
 
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
+  }
+
+  private getFilterableValues(
+    activity: OrderWithAccount,
+    fieldValues: Set<string> = new Set<string>()
+  ): string[] {
+    fieldValues.add(activity.Account?.name);
+    fieldValues.add(activity.Account?.Platform?.name);
+    fieldValues.add(activity.SymbolProfile.currency);
+
+    if (!isUUID(activity.SymbolProfile.symbol)) {
+      fieldValues.add(activity.SymbolProfile.symbol);
+    }
+
+    fieldValues.add(activity.type);
+    fieldValues.add(format(activity.date, 'yyyy'));
+
+    return [...fieldValues].filter((item) => {
+      return item !== undefined;
+    });
+  }
+
   private getSearchableFieldValues(activities: OrderWithAccount[]): string[] {
     const fieldValues = new Set<string>();
 
@@ -287,26 +249,6 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
       });
   }
 
-  private getFilterableValues(
-    activity: OrderWithAccount,
-    fieldValues: Set<string> = new Set<string>()
-  ): string[] {
-    fieldValues.add(activity.Account?.name);
-    fieldValues.add(activity.Account?.Platform?.name);
-    fieldValues.add(activity.SymbolProfile.currency);
-
-    if (!isUUID(activity.SymbolProfile.symbol)) {
-      fieldValues.add(activity.SymbolProfile.symbol);
-    }
-
-    fieldValues.add(activity.type);
-    fieldValues.add(format(activity.date, 'yyyy'));
-
-    return [...fieldValues].filter((item) => {
-      return item !== undefined;
-    });
-  }
-
   private getTotalFees() {
     let totalFees = new Big(0);
 

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

@@ -1,16 +1,13 @@
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import { MatButtonModule } from '@angular/material/button';
-import { MatChipsModule } from '@angular/material/chips';
-import { MatInputModule } from '@angular/material/input';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatSortModule } from '@angular/material/sort';
 import { MatTableModule } from '@angular/material/table';
 import { RouterModule } from '@angular/router';
 import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
 import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
+import { GfActivitiesFilterModule } from '@ghostfolio/ui/activities-filter/activities-filter.module';
 import { GfNoTransactionsInfoModule } from '@ghostfolio/ui/no-transactions-info';
 import { GfValueModule } from '@ghostfolio/ui/value';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@@ -22,19 +19,16 @@ import { ActivitiesTableComponent } from './activities-table.component';
   exports: [ActivitiesTableComponent],
   imports: [
     CommonModule,
+    GfActivitiesFilterModule,
     GfNoTransactionsInfoModule,
     GfSymbolIconModule,
     GfSymbolModule,
     GfValueModule,
-    MatAutocompleteModule,
     MatButtonModule,
-    MatChipsModule,
-    MatInputModule,
     MatMenuModule,
     MatSortModule,
     MatTableModule,
     NgxSkeletonLoaderModule,
-    ReactiveFormsModule,
     RouterModule
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ghostfolio",
-  "version": "1.140.2",
+  "version": "1.142.0",
   "homepage": "https://ghostfol.io",
   "license": "AGPL-3.0",
   "scripts": {
@@ -71,7 +71,7 @@
     "@nestjs/schedule": "1.0.2",
     "@nestjs/serve-static": "2.2.2",
     "@nrwl/angular": "13.8.5",
-    "@prisma/client": "3.11.1",
+    "@prisma/client": "3.12.0",
     "@simplewebauthn/browser": "4.1.0",
     "@simplewebauthn/server": "4.1.0",
     "@simplewebauthn/typescript-types": "4.0.0",
@@ -109,7 +109,7 @@
     "passport": "0.4.1",
     "passport-google-oauth20": "2.0.0",
     "passport-jwt": "4.0.0",
-    "prisma": "3.11.1",
+    "prisma": "3.12.0",
     "reflect-metadata": "0.1.13",
     "round-to": "5.0.0",
     "rxjs": "7.4.0",

prisma/migrations/20220424064155_changed_various_ids_with_multiple_fields/migration.sql

@@ -0,0 +1,14 @@
+-- AlterTable
+ALTER TABLE "Access" DROP CONSTRAINT "Access_pkey",
+ADD CONSTRAINT "Access_pkey" PRIMARY KEY ("id");
+
+-- AlterTable
+ALTER TABLE "MarketData" ADD CONSTRAINT "MarketData_pkey" PRIMARY KEY ("id");
+
+-- AlterTable
+ALTER TABLE "Order" DROP CONSTRAINT "Order_pkey",
+ADD CONSTRAINT "Order_pkey" PRIMARY KEY ("id");
+
+-- AlterTable
+ALTER TABLE "Subscription" DROP CONSTRAINT "Subscription_pkey",
+ADD CONSTRAINT "Subscription_pkey" PRIMARY KEY ("id");

prisma/migrations/20220424152051_added_tags_to_order/migration.sql

@@ -0,0 +1,28 @@
+-- CreateTable
+CREATE TABLE "Tag" (
+    "id" TEXT NOT NULL,
+    "name" TEXT NOT NULL,
+
+    CONSTRAINT "Tag_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "_OrderToTag" (
+    "A" TEXT NOT NULL,
+    "B" TEXT NOT NULL
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Tag_name_key" ON "Tag"("name");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "_OrderToTag_AB_unique" ON "_OrderToTag"("A", "B");
+
+-- CreateIndex
+CREATE INDEX "_OrderToTag_B_index" ON "_OrderToTag"("B");
+
+-- AddForeignKey
+ALTER TABLE "_OrderToTag" ADD FOREIGN KEY ("A") REFERENCES "Order"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "_OrderToTag" ADD FOREIGN KEY ("B") REFERENCES "Tag"("id") ON DELETE CASCADE ON UPDATE CASCADE;

prisma/schema.prisma

@@ -13,12 +13,10 @@ model Access {
   createdAt     DateTime @default(now())
   GranteeUser   User?    @relation(fields: [granteeUserId], name: "accessGet", references: [id])
   granteeUserId String?
-  id            String   @default(uuid())
+  id            String   @id @default(uuid())
   updatedAt     DateTime @updatedAt
   User          User     @relation(fields: [userId], name: "accessGive", references: [id])
   userId        String
-
-  @@id([id, userId])
 }
 
 model Account {
@@ -61,7 +59,7 @@ model MarketData {
   createdAt   DateTime   @default(now())
   dataSource  DataSource
   date        DateTime
-  id          String     @default(uuid())
+  id          String     @id @default(uuid())
   symbol      String
   marketPrice Float
 
@@ -76,18 +74,17 @@ model Order {
   createdAt       DateTime      @default(now())
   date            DateTime
   fee             Float
-  id              String        @default(uuid())
+  id              String        @id @default(uuid())
   isDraft         Boolean       @default(false)
   quantity        Float
   SymbolProfile   SymbolProfile @relation(fields: [symbolProfileId], references: [id])
   symbolProfileId String
+  tags            Tag[]
   type            Type
   unitPrice       Float
   updatedAt       DateTime      @updatedAt
   User            User          @relation(fields: [userId], references: [id])
   userId          String
-
-  @@id([id, userId])
 }
 
 model Platform {
@@ -138,20 +135,24 @@ model SymbolProfileOverrides {
   countries       Json?
   name            String?
   sectors         Json?
-  SymbolProfile   SymbolProfile @relation(fields: [symbolProfileId], references: [id])
-  symbolProfileId String        @id
-  updatedAt       DateTime      @updatedAt
+  SymbolProfile   SymbolProfile  @relation(fields: [symbolProfileId], references: [id])
+  symbolProfileId String         @id
+  updatedAt       DateTime       @updatedAt
 }
 
 model Subscription {
   createdAt DateTime @default(now())
   expiresAt DateTime
-  id        String   @default(uuid())
+  id        String   @id @default(uuid())
   updatedAt DateTime @updatedAt
   User      User     @relation(fields: [userId], references: [id])
   userId    String
+}
 
-  @@id([id, userId])
+model Tag {
+  id     String  @id @default(uuid())
+  name   String  @unique
+  orders Order[]
 }
 
 model User {

yarn.lock

@@ -3487,22 +3487,22 @@
   resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.10.1.tgz#728ecd95ab207aab8a9a4e421f0422db329232be"
   integrity sha512-HnUhk1Sy9IuKrxEMdIRCxpIqPw6BFsbYSEUO9p/hNw5sMld/+3OLMWQP80F8/db9qsv3qUjs7ZR5bS/R+iinXw==
 
-"@prisma/client@3.11.1":
-  version "3.11.1"
-  resolved "https://registry.yarnpkg.com/@prisma/client/-/client-3.11.1.tgz#bde6dec71ae133d04ce1c6658e3d76627a3c6dc7"
-  integrity sha512-B3C7zQG4HbjJzUr2Zg9UVkBJutbqq9/uqkl1S138+keZCubJrwizx3RuIvGwI+s+pm3qbsyNqXiZgL3Ir0fSng==
+"@prisma/client@3.12.0":
+  version "3.12.0"
+  resolved "https://registry.yarnpkg.com/@prisma/client/-/client-3.12.0.tgz#a0eb49ffea5c128dd11dffb896d7139a60073d12"
+  integrity sha512-4NEQjUcWja/NVBvfuDFscWSk1/rXg3+wj+TSkqXCb1tKlx/bsUE00rxsvOvGg7VZ6lw1JFpGkwjwmsOIc4zvQw==
   dependencies:
-    "@prisma/engines-version" "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+    "@prisma/engines-version" "3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980"
 
-"@prisma/engines-version@3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9":
-  version "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
-  resolved "https://registry.yarnpkg.com/@prisma/engines-version/-/engines-version-3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9.tgz#81a1835b495ad287ad7824dbd62f74e9eee90fb9"
-  integrity sha512-HkcsDniA4iNb/gi0iuyOJNAM7nD/LwQ0uJm15v360O5dee3TM4lWdSQiTYBMK6FF68ACUItmzSur7oYuUZ2zkQ==
+"@prisma/engines-version@3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980":
+  version "3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980"
+  resolved "https://registry.yarnpkg.com/@prisma/engines-version/-/engines-version-3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980.tgz#829ca3d9d0d92555f44644606d4edfd45b2f5886"
+  integrity sha512-o+jo8d7ZEiVpcpNWUDh3fj2uPQpBxl79XE9ih9nkogJbhw6P33274SHnqheedZ7PyvPIK/mvU8MLNYgetgXPYw==
 
-"@prisma/engines@3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9":
-  version "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
-  resolved "https://registry.yarnpkg.com/@prisma/engines/-/engines-3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9.tgz#09ac23f8f615a8586d8d44538060ada199fe872c"
-  integrity sha512-MILbsGnvmnhCbFGa2/iSnsyGyazU3afzD7ldjCIeLIGKkNBMSZgA2IvpYsAXl+6qFHKGrS3B2otKfV31dwMSQw==
+"@prisma/engines@3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980":
+  version "3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980"
+  resolved "https://registry.yarnpkg.com/@prisma/engines/-/engines-3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980.tgz#e52e364084c4d05278f62768047b788665e64a45"
+  integrity sha512-zULjkN8yhzS7B3yeEz4aIym4E2w1ChrV12i14pht3ePFufvsAvBSoZ+tuXMvfSoNTgBS5E4bolRzLbMmbwkkMQ==
 
 "@samverschueren/stream-to-observable@^0.3.0":
   version "0.3.1"
@@ -15334,12 +15334,12 @@ pretty-hrtime@^1.0.3:
   resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
   integrity sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=
 
-prisma@3.11.1:
-  version "3.11.1"
-  resolved "https://registry.yarnpkg.com/prisma/-/prisma-3.11.1.tgz#fff9c0bcf83cb30c2e1d650882d5eb3c5565e028"
-  integrity sha512-aYn8bQwt1xwR2oSsVNHT4PXU7EhsThIwmpNB/MNUaaMx5OPLTro6VdNJe/sJssXFLxhamfWeMjwmpXjljo6xkg==
+prisma@3.12.0:
+  version "3.12.0"
+  resolved "https://registry.yarnpkg.com/prisma/-/prisma-3.12.0.tgz#9675e0e72407122759d3eadcb6d27cdccd3497bd"
+  integrity sha512-ltCMZAx1i0i9xuPM692Srj8McC665h6E5RqJom999sjtVSccHSD8Z+HSdBN2183h9PJKvC5dapkn78dd0NWMBg==
   dependencies:
-    "@prisma/engines" "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+    "@prisma/engines" "3.12.0-37.22b822189f46ef0dc5c5b503368d1bee01213980"
 
 prismjs@^1.21.0, prismjs@~1.24.0:
   version "1.24.1"