Release 1.180.0 (#1169)

* Resolve feature graphic of blog post

* Update changelog

CHANGELOG.md

@@ -5,6 +5,70 @@ 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.180.0 - 18.08.2022
+
+### Added
+
+- Set up `ng-extract-i18n-merge` to improve the i18n extraction and merge workflow
+- Set up language localization for German (`de`)
+- Resolved the feature graphic of the blog post
+
+### Changed
+
+- Tagged template literal strings in components for localization with `$localize`
+
+### Fixed
+
+- Fixed the license component in the about page
+- Fixed the links to the blog posts
+
+## 1.179.5 - 15.08.2022
+
+### Added
+
+- Set up i18n support
+- Added a blog post: _500 Stars on GitHub_
+
+### Changed
+
+- Reduced the maximum width of the performance chart on the home page
+
+## 1.178.0 - 09.08.2022
+
+### Added
+
+- Added `url` to the symbol profile overrides model for manual adjustments
+- Added default values for `countries` and `sectors` of the symbol profile overrides model
+
+### Changed
+
+- Simplified the initialization of the exchange rate service
+- Improved the orders query for `assetClass` with symbol profile overrides
+- Improved the styling of the benchmarks in the markets overview
+
+### Todo
+
+- Apply data migration (`yarn database:migrate`)
+
+## 1.177.0 - 04.08.2022
+
+### Added
+
+- Added `GHOSTFOLIO` as a default to `DATA_SOURCES`
+- Added the `AGPLv3` logo to the landing page
+
+### Changed
+
+- Refactored the initialization of the exchange rate service
+- Upgraded `angular` from version `14.0.2` to `14.1.0`
+- Upgraded `nestjs` from version `8.4.7` to `9.0.7`
+- Upgraded `Nx` from version `14.3.5` to `14.5.1`
+- Upgraded `prisma` from version `3.15.2` to `4.1.1`
+
+### Fixed
+
+- Handled database connection errors (do not exit process)
+
 ## 1.176.2 - 31.07.2022
 
 ### Added

angular.json

@@ -77,41 +77,45 @@
             "polyfills": "apps/client/src/polyfills.ts",
             "tsConfig": "apps/client/tsconfig.app.json",
             "assets": [
-              "apps/client/src/assets",
               {
                 "glob": "assetlinks.json",
                 "input": "apps/client/src/assets",
-                "output": "./.well-known"
+                "output": "./../.well-known"
               },
               {
                 "glob": "CHANGELOG.md",
                 "input": "",
-                "output": "./assets"
+                "output": "./../assets"
               },
               {
                 "glob": "LICENSE",
                 "input": "",
-                "output": "./assets"
+                "output": "./../assets"
               },
               {
                 "glob": "robots.txt",
                 "input": "apps/client/src/assets",
-                "output": "./"
+                "output": "./../"
               },
               {
                 "glob": "sitemap.xml",
                 "input": "apps/client/src/assets",
-                "output": "./"
+                "output": "./../"
               },
               {
                 "glob": "**/*",
                 "input": "node_modules/ionicons/dist/ionicons",
-                "output": "./ionicons"
+                "output": "./../ionicons"
               },
               {
                 "glob": "**/*.js",
                 "input": "node_modules/ionicons/dist/",
-                "output": "./"
+                "output": "./../"
+              },
+              {
+                "glob": "**/*",
+                "input": "apps/client/src/assets",
+                "output": "./../assets/"
               }
             ],
             "styles": ["apps/client/src/styles.scss"],
@@ -124,6 +128,10 @@
             "namedChunks": true
           },
           "configurations": {
+            "development-en": {
+              "baseHref": "/en/",
+              "localize": ["en"]
+            },
             "production": {
               "fileReplacements": [
                 {
@@ -162,15 +170,21 @@
             "proxyConfig": "apps/client/proxy.conf.json"
           },
           "configurations": {
+            "development-en": {
+              "browserTarget": "client:build:development-en"
+            },
             "production": {
               "browserTarget": "client:build:production"
             }
           }
         },
         "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "builder": "ng-extract-i18n-merge:ng-extract-i18n-merge",
           "options": {
-            "browserTarget": "client:build"
+            "browserTarget": "client:build",
+            "includeContext": true,
+            "outputPath": "src/locales",
+            "targetFiles": ["messages.de.xlf"]
           }
         },
         "lint": {
@@ -188,6 +202,15 @@
           "outputs": ["coverage/apps/client"]
         }
       },
+      "i18n": {
+        "locales": {
+          "de": {
+            "baseHref": "/de/",
+            "translation": "apps/client/src/locales/messages.de.xlf"
+          }
+        },
+        "sourceLocale": "en"
+      },
       "tags": []
     },
     "client-e2e": {

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

@@ -1,6 +1,17 @@
+import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { Controller } from '@nestjs/common';
 
 @Controller()
 export class AppController {
-  public constructor() {}
+  public constructor(
+    private readonly exchangeRateDataService: ExchangeRateDataService
+  ) {
+    this.initialize();
+  }
+
+  private async initialize() {
+    try {
+      await this.exchangeRateDataService.initialize();
+    } catch {}
+  }
 }

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

@@ -10,7 +10,7 @@ import { ExchangeRateDataModule } from '@ghostfolio/api/services/exchange-rate-d
 import { PrismaModule } from '@ghostfolio/api/services/prisma.module';
 import { TwitterBotModule } from '@ghostfolio/api/services/twitter-bot/twitter-bot.module';
 import { BullModule } from '@nestjs/bull';
-import { Module } from '@nestjs/common';
+import { MiddlewareConsumer, Module, RequestMethod } from '@nestjs/common';
 import { ConfigModule } from '@nestjs/config';
 import { ScheduleModule } from '@nestjs/schedule';
 import { ServeStaticModule } from '@nestjs/serve-static';
@@ -23,6 +23,7 @@ import { AuthModule } from './auth/auth.module';
 import { BenchmarkModule } from './benchmark/benchmark.module';
 import { CacheModule } from './cache/cache.module';
 import { ExportModule } from './export/export.module';
+import { FrontendMiddleware } from './frontend.middleware';
 import { ImportModule } from './import/import.module';
 import { InfoModule } from './info/info.module';
 import { OrderModule } from './order/order.module';
@@ -82,4 +83,10 @@ import { UserModule } from './user/user.module';
   controllers: [AppController],
   providers: [CronService]
 })
-export class AppModule {}
+export class AppModule {
+  configure(consumer: MiddlewareConsumer) {
+    consumer
+      .apply(FrontendMiddleware)
+      .forRoutes({ path: '*', method: RequestMethod.ALL });
+  }
+}

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

@@ -1,5 +1,6 @@
 import { WebAuthService } from '@ghostfolio/api/app/auth/web-auth.service';
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
+import { DEFAULT_LANGUAGE_CODE } from '@ghostfolio/common/config';
 import { OAuthResponse } from '@ghostfolio/common/interfaces';
 import {
   Body,
@@ -62,9 +63,17 @@ export class AuthController {
     const jwt: string = req.user.jwt;
 
     if (jwt) {
-      res.redirect(`${this.configurationService.get('ROOT_URL')}/auth/${jwt}`);
+      res.redirect(
+        `${this.configurationService.get(
+          'ROOT_URL'
+        )}/${DEFAULT_LANGUAGE_CODE}/auth/${jwt}`
+      );
     } else {
-      res.redirect(`${this.configurationService.get('ROOT_URL')}/auth`);
+      res.redirect(
+        `${this.configurationService.get(
+          'ROOT_URL'
+        )}/${DEFAULT_LANGUAGE_CODE}/auth`
+      );
     }
   }
 

apps/api/src/app/frontend.middleware.ts

@@ -0,0 +1,53 @@
+import * as path from 'path';
+
+import { DEFAULT_LANGUAGE_CODE } from '@ghostfolio/common/config';
+import { Injectable, Logger, NestMiddleware } from '@nestjs/common';
+import { NextFunction, Request, Response } from 'express';
+
+@Injectable()
+export class FrontendMiddleware implements NestMiddleware {
+  use(req: Request, res: Response, next: NextFunction) {
+    if (req.url.includes('cover.png')) {
+      Logger.log(`Referer: ${req.headers.referer}`, 'FrontendMiddleware');
+
+      // Resolve feature graphic for blog post
+      if (req.headers.referer?.includes('500-stars-on-github')) {
+        res.sendFile(
+          path.join(
+            __dirname,
+            '..',
+            'client',
+            'assets',
+            'images',
+            'blog',
+            '500-stars-on-github.jpg'
+          )
+        );
+      } else {
+        // Skip
+        next();
+      }
+    } else if (req.path.startsWith('/api/') || this.isFileRequest(req.url)) {
+      // Skip
+      next();
+    } else if (req.path.startsWith('/de/')) {
+      res.sendFile(this.getPathOfIndexHtmlFile('de'));
+    } else {
+      res.sendFile(this.getPathOfIndexHtmlFile(DEFAULT_LANGUAGE_CODE));
+    }
+  }
+
+  private getPathOfIndexHtmlFile(aLocale: string) {
+    return path.join(__dirname, '..', 'client', aLocale, 'index.html');
+  }
+
+  private isFileRequest(filename: string) {
+    if (filename === '/assets/LICENSE') {
+      return true;
+    } else if (filename.includes('auth/ey')) {
+      return false;
+    }
+
+    return filename.split('.').pop() !== filename;
+  }
+}

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

@@ -21,7 +21,7 @@ import {
 } from '@prisma/client';
 import Big from 'big.js';
 import { endOfToday, isAfter } from 'date-fns';
-import { groupBy, isString } from 'lodash';
+import { groupBy } from 'lodash';
 import { v4 as uuidv4 } from 'uuid';
 
 import { Activity } from './interfaces/activities.interface';
@@ -230,9 +230,10 @@ export class OrderService {
                 })
               },
               {
-                SymbolProfileOverrides: {
-                  is: null
-                }
+                OR: [
+                  { SymbolProfileOverrides: { is: null } },
+                  { SymbolProfileOverrides: { assetClass: null } }
+                ]
               }
             ]
           },

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

@@ -1,6 +1,9 @@
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PropertyService } from '@ghostfolio/api/services/property/property.service';
-import { PROPERTY_COUPONS } from '@ghostfolio/common/config';
+import {
+  DEFAULT_LANGUAGE_CODE,
+  PROPERTY_COUPONS
+} from '@ghostfolio/common/config';
 import { Coupon } from '@ghostfolio/common/interfaces';
 import type { RequestWithUser } from '@ghostfolio/common/types';
 import {
@@ -93,7 +96,11 @@ export class SubscriptionController {
       'SubscriptionController'
     );
 
-    res.redirect(`${this.configurationService.get('ROOT_URL')}/account`);
+    res.redirect(
+      `${this.configurationService.get(
+        'ROOT_URL'
+      )}/${DEFAULT_LANGUAGE_CODE}/account`
+    );
   }
 
   @Post('stripe/checkout-session')

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

@@ -1,5 +1,6 @@
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { DEFAULT_LANGUAGE_CODE } from '@ghostfolio/common/config';
 import { SubscriptionType } from '@ghostfolio/common/types/subscription.type';
 import { Injectable, Logger } from '@nestjs/common';
 import { Subscription } from '@prisma/client';
@@ -33,7 +34,9 @@ export class SubscriptionService {
     userId: string;
   }) {
     const checkoutSessionCreateParams: Stripe.Checkout.SessionCreateParams = {
-      cancel_url: `${this.configurationService.get('ROOT_URL')}/account`,
+      cancel_url: `${this.configurationService.get(
+        'ROOT_URL'
+      )}/${DEFAULT_LANGUAGE_CODE}/account`,
       client_reference_id: userId,
       line_items: [
         {

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

@@ -15,7 +15,9 @@ export class ConfigurationService {
       BASE_CURRENCY: str({ default: 'USD' }),
       CACHE_TTL: num({ default: 1 }),
       DATA_SOURCE_PRIMARY: str({ default: DataSource.YAHOO }),
-      DATA_SOURCES: json({ default: [DataSource.YAHOO] }),
+      DATA_SOURCES: json({
+        default: [DataSource.GHOSTFOLIO, DataSource.YAHOO]
+      }),
       ENABLE_FEATURE_BLOG: bool({ default: false }),
       ENABLE_FEATURE_CUSTOM_SYMBOLS: bool({ default: false }),
       ENABLE_FEATURE_FEAR_AND_GREED_INDEX: bool({ default: false }),

apps/api/src/services/exchange-rate-data.service.ts

@@ -22,9 +22,7 @@ export class ExchangeRateDataService {
     private readonly dataProviderService: DataProviderService,
     private readonly prismaService: PrismaService,
     private readonly propertyService: PropertyService
-  ) {
-    this.initialize();
-  }
+  ) {}
 
   public getCurrencies() {
     return this.currencies?.length > 0 ? this.currencies : [this.baseCurrency];

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

@@ -1,15 +1,25 @@
-import { Injectable, OnModuleDestroy, OnModuleInit } from '@nestjs/common';
+import {
+  Injectable,
+  Logger,
+  OnModuleDestroy,
+  OnModuleInit
+} from '@nestjs/common';
 import { PrismaClient } from '@prisma/client';
 
 @Injectable()
 export class PrismaService
   extends PrismaClient
-  implements OnModuleInit, OnModuleDestroy {
-  async onModuleInit() {
-    await this.$connect();
+  implements OnModuleInit, OnModuleDestroy
+{
+  public async onModuleInit() {
+    try {
+      await this.$connect();
+    } catch (error) {
+      Logger.error(error, 'PrismaService');
+    }
   }
 
-  async onModuleDestroy() {
+  public async onModuleDestroy() {
     await this.$disconnect();
   }
 }

apps/api/src/services/symbol-profile.service.ts

@@ -115,9 +115,16 @@ export class SymbolProfileService {
         }
 
         item.name = item.SymbolProfileOverrides?.name ?? item.name;
-        item.sectors =
-          (item.SymbolProfileOverrides.sectors as unknown as Sector[]) ??
-          item.sectors;
+
+        if (
+          (item.SymbolProfileOverrides.sectors as unknown as Sector[])?.length >
+          0
+        ) {
+          item.sectors = item.SymbolProfileOverrides
+            .sectors as unknown as Sector[];
+        }
+
+        item.url = item.SymbolProfileOverrides?.url ?? item.url;
 
         delete item.SymbolProfileOverrides;
       }

apps/client/src/app/app-routing.module.ts

@@ -54,45 +54,52 @@ const routes: Routes = [
       import('./pages/blog/blog-page.module').then((m) => m.BlogPageModule)
   },
   {
-    path: 'de/blog/2021/07/hallo-ghostfolio',
+    path: 'blog/2021/07/hallo-ghostfolio',
     loadChildren: () =>
       import(
         './pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.module'
       ).then((m) => m.HalloGhostfolioPageModule)
   },
   {
-    path: 'demo',
-    loadChildren: () =>
-      import('./pages/demo/demo-page.module').then((m) => m.DemoPageModule)
-  },
-  {
-    path: 'en/blog/2021/07/hello-ghostfolio',
+    path: 'blog/2021/07/hello-ghostfolio',
     loadChildren: () =>
       import(
         './pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.module'
       ).then((m) => m.HelloGhostfolioPageModule)
   },
   {
-    path: 'en/blog/2022/01/ghostfolio-first-months-in-open-source',
+    path: 'blog/2022/01/ghostfolio-first-months-in-open-source',
     loadChildren: () =>
       import(
         './pages/blog/2022/01/first-months-in-open-source/first-months-in-open-source-page.module'
       ).then((m) => m.FirstMonthsInOpenSourcePageModule)
   },
   {
-    path: 'en/blog/2022/07/ghostfolio-meets-internet-identity',
+    path: 'blog/2022/07/ghostfolio-meets-internet-identity',
     loadChildren: () =>
       import(
         './pages/blog/2022/07/ghostfolio-meets-internet-identity/ghostfolio-meets-internet-identity-page.module'
       ).then((m) => m.GhostfolioMeetsInternetIdentityPageModule)
   },
   {
-    path: 'en/blog/2022/07/how-do-i-get-my-finances-in-order',
+    path: 'blog/2022/07/how-do-i-get-my-finances-in-order',
     loadChildren: () =>
       import(
         './pages/blog/2022/07/how-do-i-get-my-finances-in-order/how-do-i-get-my-finances-in-order-page.module'
       ).then((m) => m.HowDoIGetMyFinancesInOrderPageModule)
   },
+  {
+    path: 'blog/2022/08/500-stars-on-github',
+    loadChildren: () =>
+      import(
+        './pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page.module'
+      ).then((m) => m.FiveHundredStarsOnGitHubPageModule)
+  },
+  {
+    path: 'demo',
+    loadChildren: () =>
+      import('./pages/demo/demo-page.module').then((m) => m.DemoPageModule)
+  },
   {
     path: 'faq',
     loadChildren: () =>

apps/client/src/app/components/access-table/access-table.component.html

@@ -21,8 +21,10 @@
     <td *matCellDef="let element" class="px-1 text-nowrap" mat-cell>
       <ng-container *ngIf="element.type === 'PUBLIC'">
         <ion-icon class="mr-1" name="link-outline"></ion-icon>
-        <a href="{{ baseUrl }}/p/{{ element.id }}" target="_blank"
-          >{{ baseUrl }}/p/{{ element.id }}</a
+        <a
+          href="{{ baseUrl }}/{{ defaultLanguageCode }}/p/{{ element.id }}"
+          target="_blank"
+          >{{ baseUrl }}/{{ defaultLanguageCode }}/p/{{ element.id }}</a
         >
       </ng-container>
     </td>

apps/client/src/app/components/access-table/access-table.component.ts

@@ -8,6 +8,7 @@ import {
   Output
 } from '@angular/core';
 import { MatTableDataSource } from '@angular/material/table';
+import { DEFAULT_LANGUAGE_CODE } from '@ghostfolio/common/config';
 import { Access } from '@ghostfolio/common/interfaces';
 
 @Component({
@@ -24,6 +25,7 @@ export class AccessTableComponent implements OnChanges, OnInit {
 
   public baseUrl = window.location.origin;
   public dataSource: MatTableDataSource<Access>;
+  public defaultLanguageCode = DEFAULT_LANGUAGE_CODE;
   public displayedColumns = [];
 
   public constructor() {}
@@ -44,7 +46,7 @@ export class AccessTableComponent implements OnChanges, OnInit {
 
   public onDeleteAccess(aId: string) {
     const confirmation = confirm(
-      'Do you really want to revoke this granted access?'
+      $localize`Do you really want to revoke this granted access?`
     );
 
     if (confirmation) {

apps/client/src/app/components/accounts-table/accounts-table.component.ts

@@ -69,7 +69,9 @@ export class AccountsTableComponent implements OnChanges, OnDestroy, OnInit {
   }
 
   public onDeleteAccount(aId: string) {
-    const confirmation = confirm('Do you really want to delete this account?');
+    const confirmation = confirm(
+      $localize`Do you really want to delete this account?`
+    );
 
     if (confirmation) {
       this.accountDeleted.emit(aId);

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

@@ -103,7 +103,7 @@ export class AdminOverviewComponent implements OnDestroy, OnInit {
   }
 
   public onAddCurrency() {
-    const currency = prompt('Please add a currency:');
+    const currency = prompt($localize`Please add a currency:`);
 
     if (currency) {
       const currencies = uniq([...this.customCurrencies, currency]);
@@ -116,7 +116,9 @@ export class AdminOverviewComponent implements OnDestroy, OnInit {
   }
 
   public onDeleteCoupon(aCouponCode: string) {
-    const confirmation = confirm('Do you really want to delete this coupon?');
+    const confirmation = confirm(
+      $localize`Do you really want to delete this coupon?`
+    );
 
     if (confirmation === true) {
       const coupons = this.coupons.filter((coupon) => {
@@ -127,7 +129,9 @@ export class AdminOverviewComponent implements OnDestroy, OnInit {
   }
 
   public onDeleteCurrency(aCurrency: string) {
-    const confirmation = confirm('Do you really want to delete this currency?');
+    const confirmation = confirm(
+      $localize`Do you really want to delete this currency?`
+    );
 
     if (confirmation === true) {
       const currencies = this.customCurrencies.filter((currency) => {
@@ -142,7 +146,9 @@ export class AdminOverviewComponent implements OnDestroy, OnInit {
   }
 
   public onFlushCache() {
-    const confirmation = confirm('Do you really want to flush the cache?');
+    const confirmation = confirm(
+      $localize`Do you really want to flush the cache?`
+    );
 
     if (confirmation === true) {
       this.cacheService
@@ -190,7 +196,7 @@ export class AdminOverviewComponent implements OnDestroy, OnInit {
   }
 
   public onSetSystemMessage() {
-    const systemMessage = prompt('Please set your system message:');
+    const systemMessage = prompt($localize`Please set your system message:`);
 
     if (systemMessage) {
       this.putSystemMessage(systemMessage);

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

@@ -55,7 +55,9 @@ export class AdminUsersComponent implements OnDestroy, OnInit {
   }
 
   public onDeleteUser(aId: string) {
-    const confirmation = confirm('Do you really want to delete this user?');
+    const confirmation = confirm(
+      $localize`Do you really want to delete this user?`
+    );
 
     if (confirmation) {
       this.dataService

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

@@ -109,7 +109,7 @@ export class HeaderComponent implements OnChanges {
       data: {
         accessToken: '',
         hasPermissionToUseSocialLogin: this.hasPermissionForSocialLogin,
-        title: 'Sign in'
+        title: $localize`Sign in`
       },
       width: '30rem'
     });
@@ -123,7 +123,7 @@ export class HeaderComponent implements OnChanges {
             .loginAnonymous(data?.accessToken)
             .pipe(
               catchError(() => {
-                alert('Oops! Incorrect Security Token.');
+                alert($localize`Oops! Incorrect Security Token.`);
 
                 return EMPTY;
               }),

apps/client/src/app/components/home-holdings/home-holdings.component.ts

@@ -2,6 +2,7 @@ import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { ActivatedRoute, Router } from '@angular/router';
 import { PositionDetailDialog } from '@ghostfolio/client/components/position/position-detail-dialog/position-detail-dialog.component';
+import { ToggleComponent } from '@ghostfolio/client/components/toggle/toggle.component';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import {
@@ -9,7 +10,6 @@ import {
   SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
-import { defaultDateRangeOptions } from '@ghostfolio/common/config';
 import { Position, User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { DateRange } from '@ghostfolio/common/types';
@@ -27,7 +27,7 @@ import { PositionDetailDialogParams } from '../position/position-detail-dialog/i
 })
 export class HomeHoldingsComponent implements OnDestroy, OnInit {
   public dateRange: DateRange;
-  public dateRangeOptions = defaultDateRangeOptions;
+  public dateRangeOptions = ToggleComponent.DEFAULT_DATE_RANGE_OPTIONS;
   public deviceType: string;
   public hasImpersonationId: boolean;
   public hasPermissionToCreateOrder: boolean;

apps/client/src/app/components/home-market/home-market.html

@@ -34,6 +34,7 @@
       <ngx-skeleton-loader
         *ngIf="isLoading"
         animation="pulse"
+        class="px-2 py-3"
         [theme]="{
           height: '1.5rem',
           width: '100%'

apps/client/src/app/components/home-overview/home-overview.component.ts

@@ -1,4 +1,5 @@
 import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
+import { ToggleComponent } from '@ghostfolio/client/components/toggle/toggle.component';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import {
@@ -6,7 +7,6 @@ import {
   SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
-import { defaultDateRangeOptions } from '@ghostfolio/common/config';
 import {
   PortfolioPerformance,
   UniqueAsset,
@@ -26,7 +26,7 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class HomeOverviewComponent implements OnDestroy, OnInit {
   public dateRange: DateRange;
-  public dateRangeOptions = defaultDateRangeOptions;
+  public dateRangeOptions = ToggleComponent.DEFAULT_DATE_RANGE_OPTIONS;
   public deviceType: string;
   public errors: UniqueAsset[];
   public hasError: boolean;

apps/client/src/app/components/home-overview/home-overview.scss

@@ -6,7 +6,7 @@
   .chart-container {
     aspect-ratio: 16 / 9;
     height: auto;
-    max-width: 67rem;
+    max-width: 50rem;
 
     // Fallback for aspect-ratio (using padding hack)
     @supports not (aspect-ratio: 16 / 9) {

apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html

@@ -25,14 +25,14 @@
         >
           <img
             class="mr-2"
-            src="./assets/icons/internet-computer.svg"
+            src="../assets/icons/internet-computer.svg"
             style="height: 0.75rem"
           /><span i18n>Sign in with Internet Identity</span>
         </button>
-        <a href="/api/v1/auth/google" mat-stroked-button
+        <a href="../api/v1/auth/google" mat-stroked-button
           ><img
             class="mr-2"
-            src="./assets/icons/google.svg"
+            src="../assets/icons/google.svg"
             style="height: 1rem"
           /><span i18n>Sign in with Google</span></a
         >

apps/client/src/app/components/portfolio-summary/portfolio-summary.component.ts

@@ -45,7 +45,7 @@ export class PortfolioSummaryComponent implements OnChanges, OnInit {
 
   public onEditEmergencyFund() {
     const emergencyFundInput = prompt(
-      'Please enter the amount of your emergency fund:',
+      $localize`Please enter the amount of your emergency fund:`,
       this.summary.emergencyFund.toString()
     );
     const emergencyFund = parseFloat(emergencyFundInput?.trim());

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

@@ -17,6 +17,14 @@ import { ToggleOption } from '@ghostfolio/common/types';
   styleUrls: ['./toggle.component.scss']
 })
 export class ToggleComponent implements OnChanges, OnInit {
+  public static DEFAULT_DATE_RANGE_OPTIONS: ToggleOption[] = [
+    { label: $localize`Today`, value: '1d' },
+    { label: $localize`YTD`, value: 'ytd' },
+    { label: $localize`1Y`, value: '1y' },
+    { label: $localize`5Y`, value: '5y' },
+    { label: $localize`Max`, value: 'max' }
+  ];
+
   @Input() defaultValue: string;
   @Input() isLoading: boolean;
   @Input() options: ToggleOption[];

apps/client/src/app/core/http-response.interceptor.ts

@@ -56,14 +56,16 @@ export class HttpResponseInterceptor implements HttpInterceptor {
           if (!this.snackBarRef) {
             if (this.info.isReadOnlyMode) {
               this.snackBarRef = this.snackBar.open(
-                'This feature is currently unavailable. Please try again later.',
+                $localize`This feature is currently unavailable. Please try again later.`,
                 undefined,
                 { duration: 6000 }
               );
             } else {
               this.snackBarRef = this.snackBar.open(
-                'This feature requires a subscription.',
-                this.hasPermissionForSubscription ? 'Upgrade Plan' : undefined,
+                $localize`This feature requires a subscription.`,
+                this.hasPermissionForSubscription
+                  ? $localize`Upgrade Plan`
+                  : undefined,
                 { duration: 6000 }
               );
             }
@@ -79,8 +81,8 @@ export class HttpResponseInterceptor implements HttpInterceptor {
         } else if (error.status === StatusCodes.INTERNAL_SERVER_ERROR) {
           if (!this.snackBarRef) {
             this.snackBarRef = this.snackBar.open(
-              'Oops! Something went wrong. Please try again later.',
-              'Okay',
+              $localize`Oops! Something went wrong. Please try again later.`,
+              $localize`Okay`,
               { duration: 6000 }
             );
 

apps/client/src/app/pages/about/about-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: AboutPageComponent,
     path: '',
-    title: 'About'
+    title: $localize`About`
   }
 ];
 

apps/client/src/app/pages/about/changelog/changelog-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: ChangelogPageComponent,
     path: '',
-    title: 'Changelog & License'
+    title: $localize`Changelog & License`
   }
 ];
 

apps/client/src/app/pages/about/changelog/changelog-page.html

@@ -4,7 +4,7 @@
       <h3 class="mb-3 text-center" i18n>Changelog</h3>
       <mat-card class="changelog">
         <mat-card-content>
-          <markdown [src]="'assets/CHANGELOG.md'"></markdown>
+          <markdown [src]="'../assets/CHANGELOG.md'"></markdown>
         </mat-card-content>
       </mat-card>
     </div>
@@ -15,7 +15,7 @@
       <h3 class="mb-3 text-center" i18n>License</h3>
       <mat-card>
         <mat-card-content>
-          <markdown [src]="'assets/LICENSE'"></markdown>
+          <markdown [src]="'../assets/LICENSE'"></markdown>
         </mat-card-content>
       </mat-card>
     </div>

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: PrivacyPolicyPageComponent,
     path: '',
-    title: 'Privacy Policy'
+    title: $localize`Privacy Policy`
   }
 ];
 

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page.html

@@ -2,7 +2,7 @@
   <div class="mb-5 row">
     <div class="col">
       <h3 class="mb-3 text-center" i18n>Privacy Policy</h3>
-      <markdown [src]="'assets/privacy-policy.md'"></markdown>
+      <markdown [src]="'../assets/privacy-policy.md'"></markdown>
     </div>
   </div>
 </div>

apps/client/src/app/pages/account/account-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: AccountPageComponent,
     path: '',
-    title: 'My Ghostfolio'
+    title: $localize`My Ghostfolio`
   }
 ];
 

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

@@ -218,7 +218,7 @@ export class AccountPageComponent implements OnDestroy, OnInit {
   }
 
   public onRedeemCoupon() {
-    let couponCode = prompt('Please enter your coupon code:');
+    let couponCode = prompt($localize`Please enter your coupon code:`);
     couponCode = couponCode?.trim();
 
     if (couponCode) {
@@ -227,17 +227,21 @@ export class AccountPageComponent implements OnDestroy, OnInit {
         .pipe(
           takeUntil(this.unsubscribeSubject),
           catchError(() => {
-            this.snackBar.open('😞 Could not redeem coupon code', undefined, {
-              duration: 3000
-            });
+            this.snackBar.open(
+              '😞 ' + $localize`Could not redeem coupon code`,
+              undefined,
+              {
+                duration: 3000
+              }
+            );
 
             return EMPTY;
           })
         )
         .subscribe(() => {
           this.snackBarRef = this.snackBar.open(
-            '✅ Coupon code has been redeemed',
-            'Reload',
+            '✅' + $localize`Coupon code has been redeemed`,
+            $localize`Reload`,
             {
               duration: 3000
             }
@@ -283,7 +287,7 @@ export class AccountPageComponent implements OnDestroy, OnInit {
       this.registerDevice();
     } else {
       const confirmation = confirm(
-        'Do you really want to remove this sign in method?'
+        $localize`Do you really want to remove this sign in method?`
       );
 
       if (confirmation) {

apps/client/src/app/pages/accounts/accounts-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: AccountsPageComponent,
     path: '',
-    title: 'Accounts'
+    title: $localize`Accounts`
   }
 ];
 

apps/client/src/app/pages/admin/admin-page-routing.module.ts

@@ -20,7 +20,7 @@ const routes: Routes = [
     ],
     component: AdminPageComponent,
     path: '',
-    title: 'Admin Control'
+    title: $localize`Admin Control`
   }
 ];
 

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

@@ -28,6 +28,7 @@ export class AuthPageComponent implements OnDestroy, OnInit {
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe((params) => {
         const jwt = params['jwt'];
+
         this.tokenStorageService.saveToken(
           jwt,
           this.settingsStorageService.getSetting(STAY_SIGNED_IN) === 'true'

apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.html

@@ -68,7 +68,7 @@
           <p class="my-5 text-center">
             <img
               alt="Ghostfol.io Screenshot"
-              src="./assets/images/screenshot.png"
+              src="../assets/images/screenshot.png"
               style="max-width: 100%; width: 20rem"
               title="Ghostfol.io Screenshot"
             />

apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.html

@@ -66,7 +66,7 @@
           <p class="my-5 text-center">
             <img
               alt="Ghostfol.io Screenshot"
-              src="./assets/images/screenshot.png"
+              src="../assets/images/screenshot.png"
               style="max-width: 100%; width: 20rem"
               title="Ghostfol.io Screenshot"
             />

apps/client/src/app/pages/blog/2022/01/first-months-in-open-source/first-months-in-open-source-page.html

@@ -20,9 +20,7 @@
           <h2 class="h4">From 1* to 100 stars on GitHub</h2>
           <p>
             When I decided to
-            <a [routerLink]="['/en', 'blog', '2021', '07', 'hello-ghostfolio']"
-              >publish</a
-            >
+            <a href="../en/blog/2021/07/hello-ghostfolio">publish</a>
             the project as
             <a href="https://github.com/ghostfolio/ghostfolio"
               >open source software</a

apps/client/src/app/pages/blog/2022/07/ghostfolio-meets-internet-identity/ghostfolio-meets-internet-identity-page.html

@@ -7,8 +7,8 @@
           <div class="mb-3 text-muted"><small>2022-07-23</small></div>
           <img
             alt="Ghostfolio meets Internet Identity Teaser"
-            class="w-100"
-            src="./assets/images/blog/ghostfolio-meets-internet-identity.png"
+            class="rounded w-100"
+            src="../assets/images/blog/ghostfolio-meets-internet-identity.png"
             title="Ghostfolio meets Internet Identity"
           />
         </div>

apps/client/src/app/pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page-routing.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
+
+import { FiveHundredStarsOnGitHubPageComponent } from './500-stars-on-github-page.component';
+
+const routes: Routes = [
+  {
+    canActivate: [AuthGuard],
+    component: FiveHundredStarsOnGitHubPageComponent,
+    path: '',
+    title: '500 Stars on GitHub'
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class FiveHundredStarsOnGitHubRoutingModule {}

apps/client/src/app/pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page.component.ts

@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+  host: { class: 'page' },
+  selector: 'gf-500-stars-on-github-page',
+  styleUrls: ['./500-stars-on-github-page.scss'],
+  templateUrl: './500-stars-on-github-page.html'
+})
+export class FiveHundredStarsOnGitHubPageComponent {}

apps/client/src/app/pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page.html

@@ -0,0 +1,195 @@
+<div class="blog container">
+  <div class="row">
+    <div class="col-md-8 offset-md-2">
+      <article>
+        <div class="mb-4 text-center">
+          <h1 class="mb-1">500 Stars</h1>
+          <div class="mb-3 text-muted"><small>2022-08-18</small></div>
+          <img
+            alt="500 Stars on GitHub Teaser"
+            class="rounded w-100"
+            src="../assets/images/blog/500-stars-on-github.jpg"
+            title="500 Stars on GitHub"
+          />
+        </div>
+        <section class="mb-4">
+          <p>
+            <a href="https://ghostfol.io">Ghostfolio</a>, the web-based personal
+            finance management software, is celebrating 500 stars on
+            <a href="https://github.com/ghostfolio/ghostfolio">GitHub</a>. This
+            is a major milestone for this open source project and a good time
+            for another
+            <a href="../en/blog/2022/01/ghostfolio-first-months-in-open-source"
+              >recap</a
+            >.
+          </p>
+        </section>
+        <section class="mb-4">
+          <h2 class="h4">Growing Community</h2>
+          <p>
+            The Ghostfolio community is growing on various platforms and has
+            recently passed 100 members on
+            <a
+              href="https://join.slack.com/t/ghostfolio/shared_invite/zt-vsaan64h-F_I0fEo5M0P88lP9ibCxFg"
+              >Slack</a
+            >
+            as well as 100 followers on
+            <a href="https://twitter.com/ghostfolio_">Twitter</a>. If you have
+            not joined yet, this is a good time to make sure you do not miss out
+            on any future updates.
+          </p>
+        </section>
+        <section class="mb-4">
+          <h2 class="h4">Message Queue: Asynchronous Processing</h2>
+          <p>
+            Overall
+            <a href="https://status.ghostfol.io">stability and robustness</a>
+            has increased significantly since the introduction of a
+            <a href="https://github.com/OptimalBits/bull">message queue</a>. The
+            workers of this robust queue system process jobs, namely gathering
+            historical market data, asynchronously in the background to not
+            bother the main service.
+          </p>
+        </section>
+        <section class="mb-4">
+          <h2 class="h4">Ready for Web 3.0</h2>
+          <p>
+            The
+            <a href="../en/blog/2022/07/ghostfolio-meets-internet-identity"
+              >recent integration of Internet Identity</a
+            >, a blockchain authentication system, makes Ghostfolio ready for
+            Web3. This third iteration of the World Wide Web is the vision of a
+            new and better Internet based on decentralized blockchains to give
+            power back to the users. <i>Internet Identity</i> created by the
+            <a href="https://dfinity.org">Dfinity Foundation</a> enables you to
+            sign in securely and anonymously to Ghostfolio without an email
+            address, username, or a password. All you need is your device with
+            built-in biometric authentication.
+          </p>
+        </section>
+        <section class="mb-4">
+          <h2 class="h4">Break-even Point</h2>
+          <p>
+            Despite the complicated
+            <a [routerLink]="['/markets']">economic situation</a> at this time,
+            the goal set at the beginning of the year to build a sustainable
+            business and reach break-even with the SaaS offering (<a
+              [routerLink]="['/markets']"
+              >Ghostfolio Premium</a
+            >) has been achieved. We will continue to leverage the revenue to
+            further improve the fully managed cloud offering for our paying
+            customers. A new goal we have set for ourselves is to become
+            profitable.
+          </p>
+        </section>
+        <section class="mb-4">
+          <h2 class="h4">Outlook</h2>
+          <p>
+            Besides all the positive accomplishments during the last months,
+            there is still a lot of room for improvement. It would be great to
+            onboard more contributors who are actively involved in software
+            engineering to realize the full potential of open source software.
+            If you are a web developer and interested in personal finance,
+            please get in touch by email via
+            <a href="mailto:hi@ghostfol.io">hi@ghostfol.io</a> or on Twitter
+            <a href="https://twitter.com/ghostfolio_">@ghostfolio_</a>. We are
+            happy to discuss ideas.
+          </p>
+          <p>
+            We would like to say thank you for all your feedback and support
+            since the beginning of this project.
+          </p>
+          <p>
+            Off to the next 500 stars!<br />
+            Thomas from Ghostfolio
+          </p>
+        </section>
+        <section class="mb-4">
+          <ul class="list-inline">
+            <li class="list-inline-item">
+              <span class="badge badge-light">Blockchain</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">BuildInPublic</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Cloud</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Community</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Finance</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Fintech</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Future</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Goal</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Internet Identity</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Investment</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Message Queue</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">OpenSaaS</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Open Source</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">OSS</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Personal Finance</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Planning</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Portfolio</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Portfolio Tracker</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Progress</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">SaaS</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Software</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">User Feedback</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Wealth</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Wealth Management</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Web3</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Web 3.0</span>
+            </li>
+            <li class="list-inline-item">
+              <span class="badge badge-light">Worker</span>
+            </li>
+          </ul>
+        </section>
+      </article>
+    </div>
+  </div>
+</div>

apps/client/src/app/pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page.module.ts

@@ -0,0 +1,13 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { FiveHundredStarsOnGitHubRoutingModule } from './500-stars-on-github-page-routing.module';
+import { FiveHundredStarsOnGitHubPageComponent } from './500-stars-on-github-page.component';
+
+@NgModule({
+  declarations: [FiveHundredStarsOnGitHubPageComponent],
+  imports: [CommonModule, FiveHundredStarsOnGitHubRoutingModule, RouterModule],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
+})
+export class FiveHundredStarsOnGitHubPageModule {}

apps/client/src/app/pages/blog/2022/08/500-stars-on-github/500-stars-on-github-page.scss

@@ -0,0 +1,3 @@
+:host {
+  display: block;
+}

apps/client/src/app/pages/blog/blog-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: BlogPageComponent,
     path: '',
-    title: 'Blog'
+    title: $localize`Blog`
   }
 ];
 

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

@@ -8,7 +8,31 @@
             <div class="flex-nowrap no-gutters row">
               <a
                 class="d-flex w-100"
-                [routerLink]="['/en', 'blog', '2022', '07', 'ghostfolio-meets-internet-identity']"
+                href="../en/blog/2022/08/500-stars-on-github"
+              >
+                <div class="flex-grow-1">
+                  <div class="h6 m-0 text-truncate">500 Stars on GitHub</div>
+                  <div class="d-flex text-muted">2022-08-18</div>
+                </div>
+                <div class="align-items-center d-flex">
+                  <ion-icon
+                    class="chevron text-muted"
+                    name="chevron-forward-outline"
+                    size="small"
+                  ></ion-icon>
+                </div>
+              </a>
+            </div>
+          </div>
+        </mat-card-content>
+      </mat-card>
+      <mat-card class="mb-3">
+        <mat-card-content>
+          <div class="container p-0">
+            <div class="flex-nowrap no-gutters row">
+              <a
+                class="d-flex w-100"
+                href="../en/blog/2022/07/ghostfolio-meets-internet-identity"
               >
                 <div class="flex-grow-1">
                   <div class="h6 m-0 text-truncate">
@@ -34,7 +58,7 @@
             <div class="flex-nowrap no-gutters row">
               <a
                 class="d-flex w-100"
-                [routerLink]="['/en', 'blog', '2022', '07', 'how-do-i-get-my-finances-in-order']"
+                href="../en/blog/2022/07/how-do-i-get-my-finances-in-order"
               >
                 <div class="flex-grow-1">
                   <div class="h6 m-0 text-truncate">
@@ -60,7 +84,7 @@
             <div class="flex-nowrap no-gutters row">
               <a
                 class="d-flex w-100"
-                [routerLink]="['/en', 'blog', '2022', '01', 'ghostfolio-first-months-in-open-source']"
+                href="'../en/blog/2022/01/ghostfolio-first-months-in-open-source"
               >
                 <div class="flex-grow-1">
                   <div class="h6 m-0 text-truncate">
@@ -86,7 +110,7 @@
             <div class="flex-nowrap no-gutters row">
               <a
                 class="d-flex w-100"
-                [routerLink]="['/en', 'blog', '2021', '07', 'hello-ghostfolio']"
+                href="../en/blog/2021/07/hello-ghostfolio"
               >
                 <div class="flex-grow-1">
                   <div class="h6 m-0 text-truncate">Hello Ghostfolio</div>
@@ -110,7 +134,7 @@
             <div class="flex-nowrap no-gutters row">
               <a
                 class="d-flex w-100"
-                [routerLink]="['/de', 'blog', '2021', '07', 'hallo-ghostfolio']"
+                href="../de/blog/2021/07/hallo-ghostfolio"
               >
                 <div class="flex-grow-1">
                   <div class="h6 m-0 text-truncate">Hallo Ghostfolio</div>

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

@@ -28,7 +28,7 @@ export class DemoPageComponent implements OnDestroy {
 
     if (hasToken) {
       alert(
-        'As you are already logged in, you cannot access the demo account.'
+        $localize`As you are already logged in, you cannot access the demo account.`
       );
     } else {
       this.tokenStorageService.saveToken(this.info.demoAuthToken, true);

apps/client/src/app/pages/faq/faq-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: FaqPageComponent,
     path: '',
-    title: 'FAQ'
+    title: $localize`FAQ`
   }
 ];
 

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

@@ -35,8 +35,7 @@
             >Get Started</a
           >” button at the top of the page. You have multiple options to join
           Ghostfolio: Create an account with a security token, using
-          <a
-            [routerLink]="['/en', 'blog', '2022', '07', 'ghostfolio-meets-internet-identity']"
+          <a href="../en/blog/2022/07/ghostfolio-meets-internet-identity"
             >Internet Identity</a
           >
           or <i>Google Sign</i>. We will guide you to set up your portfolio.
@@ -46,8 +45,7 @@
         <mat-card-title i18n>Can I use Ghostfolio anonymously?</mat-card-title>
         <mat-card-content i18n>
           Yes, the authentication systems (via security token or
-          <a
-            [routerLink]="['/en', 'blog', '2022', '07', 'ghostfolio-meets-internet-identity']"
+          <a href="../en/blog/2022/07/ghostfolio-meets-internet-identity"
             >Internet Identity</a
           >) enable you to sign in securely and anonymously to Ghostfolio. There
           is no need for an email address, phone number, or a username.

apps/client/src/app/pages/features/features-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: FeaturesPageComponent,
     path: '',
-    title: 'Features'
+    title: $localize`Features`
   }
 ];
 

apps/client/src/app/pages/home/home-page-routing.module.ts

@@ -20,7 +20,7 @@ const routes: Routes = [
     ],
     component: HomePageComponent,
     path: '',
-    title: 'Overview'
+    title: $localize`Overview`
   }
 ];
 

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

@@ -13,7 +13,7 @@
           <img
             alt="Ghostfol.io Trailer"
             class="rounded video"
-            src="./assets/images/video-preview.jpg"
+            src="../assets/images/video-preview.jpg"
             style="max-width: 100%; width: 40rem"
           />
         </a>
@@ -183,7 +183,7 @@
       href="https://play.google.com/store/apps/details?id=ch.dotsilver.ghostfolio.twa"
       title="Get Ghostfolio on Google Play"
     >
-      <img alt="Google Play Badge" src="assets/badge-en-google-play.png" />
+      <img alt="Google Play Badge" src="../assets/badge-en-google-play.png" />
     </a>
   </div>
 </div>
@@ -194,7 +194,7 @@
       <div class="h-100 w-100"></div>
     </div>
   </div>
-  <div class="row">
+  <div class="row mb-4">
     <div
       class="align-items-center d-flex flex-column justify-content-center w-100"
     >
@@ -202,4 +202,14 @@
       <div>Wealth Management Software</div>
     </div>
   </div>
+  <div class="row">
+    <div class="align-items-center d-flex flex-column w-100">
+      <a
+        class="agplv3-logo"
+        href="https://www.gnu.org/licenses/agpl-3.0.html"
+        target="_blank"
+        title="GNU Affero General Public License Version 3"
+      ></a>
+    </div>
+  </div>
 </div>

apps/client/src/app/pages/landing/landing-page.scss

@@ -3,6 +3,16 @@
 :host {
   display: block;
 
+  .agplv3-logo {
+    background-color: rgba(var(--dark-primary-text));
+    height: 3rem;
+    mask-image: url('/assets/images/AGPLv3-logo.svg');
+    mask-position: center;
+    mask-repeat: no-repeat;
+    mask-size: contain;
+    width: 7.5rem;
+  }
+
   .button-container {
     .mat-stroked-button {
       background-color: var(--light-background);
@@ -46,6 +56,10 @@
 }
 
 :host-context(.is-dark-theme) {
+  .agplv3-logo {
+    background-color: rgba(var(--light-primary-text));
+  }
+
   .button-container {
     .mat-stroked-button {
       background-color: var(--dark-background);

apps/client/src/app/pages/markets/markets-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: MarketsPageComponent,
     path: '',
-    title: 'Markets'
+    title: $localize`Markets`
   }
 ];
 

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

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: AllocationsPageComponent,
     path: '',
-    title: 'Allocations'
+    title: $localize`Allocations`
   }
 ];
 

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

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: AnalysisPageComponent,
     path: '',
-    title: 'Analysis'
+    title: $localize`Analysis`
   }
 ];
 

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

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: FirePageComponent,
     path: '',
-    title: 'FIRE'
+    title: $localize`FIRE`
   }
 ];
 

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

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: HoldingsPageComponent,
     path: '',
-    title: 'Holdings'
+    title: $localize`Holdings`
   }
 ];
 

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

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: TransactionsPageComponent,
     path: '',
-    title: 'Activities'
+    title: $localize`Activities`
   }
 ];
 

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

@@ -188,7 +188,7 @@ export class TransactionsPageComponent implements OnDestroy, OnInit {
     input.type = 'file';
 
     input.onchange = (event) => {
-      this.snackBar.open('⏳ Importing data...');
+      this.snackBar.open('⏳' + $localize`Importing data...`);
 
       // Getting the file reference
       const file = (event.target as HTMLInputElement).files[0];
@@ -334,7 +334,7 @@ export class TransactionsPageComponent implements OnDestroy, OnInit {
   private handleImportSuccess() {
     this.fetchActivities();
 
-    this.snackBar.open('✅ Import has been completed', undefined, {
+    this.snackBar.open('✅' + $localize`Import has been completed`, undefined, {
       duration: 3000
     });
   }

apps/client/src/app/pages/pricing/pricing-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: PricingPageComponent,
     path: '',
-    title: 'Pricing'
+    title: $localize`Pricing`
   }
 ];
 

apps/client/src/app/pages/public/public-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: PublicPageComponent,
     path: ':id',
-    title: 'Portfolio'
+    title: $localize`Portfolio`
   }
 ];
 

apps/client/src/app/pages/register/register-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: RegisterPageComponent,
     path: '',
-    title: 'Registration'
+    title: $localize`Registration`
   }
 ];
 

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

@@ -36,15 +36,15 @@
           >
             <img
               class="mr-2"
-              src="./assets/icons/internet-computer.svg"
+              src="../assets/icons/internet-computer.svg"
               style="height: 0.75rem"
             />
             <span i18n>Continue with Internet Identity</span>
           </button>
-          <a class="d-block" href="/api/v1/auth/google" mat-stroked-button
+          <a class="d-block" href="../api/v1/auth/google" mat-stroked-button
             ><img
               class="mr-2"
-              src="./assets/icons/google.svg"
+              src="../assets/icons/google.svg"
               style="height: 1rem"
             /><span i18n>Continue with Google</span></a
           >

apps/client/src/app/pages/resources/resources-page-routing.module.ts

@@ -9,7 +9,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: ResourcesPageComponent,
     path: '',
-    title: 'Resources'
+    title: $localize`Resources`
   }
 ];
 

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

@@ -29,8 +29,7 @@
               easier and faster in this guide.
             </div>
             <div>
-              <a
-                [routerLink]="['/en', 'blog', '2022', '07', 'how-do-i-get-my-finances-in-order']"
+              <a href="../en/blog/2022/07/how-do-i-get-my-finances-in-order"
                 >How do I get my finances in order? →</a
               >
             </div>

apps/client/src/app/pages/webauthn/webauthn-page-routing.module.ts

@@ -3,7 +3,7 @@ import { RouterModule, Routes } from '@angular/router';
 import { WebauthnPageComponent } from '@ghostfolio/client/pages/webauthn/webauthn-page.component';
 
 const routes: Routes = [
-  { component: WebauthnPageComponent, path: '', title: 'Login' }
+  { component: WebauthnPageComponent, path: '', title: $localize`Login` }
 ];
 
 @NgModule({

apps/client/src/app/pages/zen/zen-page-routing.module.ts

@@ -16,7 +16,7 @@ const routes: Routes = [
     ],
     component: ZenPageComponent,
     path: '',
-    title: 'Overview'
+    title: $localize`Overview`
   }
 ];
 

apps/client/src/assets/robots.txt

@@ -1,6 +1,6 @@
 User-agent: *
 Allow: /
-Disallow: /about/privacy-policy
-Disallow: /p/*
+Disallow: /en/about/privacy-policy
+Disallow: /en/p/*
 
 Sitemap: https://ghostfol.io/sitemap.xml

apps/client/src/assets/site.webmanifest

@@ -6,12 +6,12 @@
   "icons": [
     {
       "sizes": "192x192",
-      "src": "/assets/android-chrome-192x192.png",
+      "src": "/en/assets/android-chrome-192x192.png",
       "type": "image/png"
     },
     {
       "sizes": "512x512",
-      "src": "/assets/android-chrome-512x512.png",
+      "src": "/en/assets/android-chrome-512x512.png",
       "type": "image/png"
     }
   ],

apps/client/src/assets/sitemap.xml

@@ -6,66 +6,70 @@
             http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
   <url>
     <loc>https://ghostfol.io</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
-  </url>
-  <url>
-    <loc>https://ghostfol.io/about</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
-  </url>
-  <url>
-    <loc>https://ghostfol.io/about/changelog</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
-  </url>
-  <url>
-    <loc>https://ghostfol.io/blog</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
     <loc>https://ghostfol.io/de/blog/2021/07/hallo-ghostfolio</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/demo</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/about</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
+  </url>
+  <url>
+    <loc>https://ghostfol.io/en/about/changelog</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
+  </url>
+  <url>
+    <loc>https://ghostfol.io/en/blog</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
     <loc>https://ghostfol.io/en/blog/2021/07/hello-ghostfolio</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
     <loc>https://ghostfol.io/en/blog/2022/01/ghostfolio-first-months-in-open-source</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
     <loc>https://ghostfol.io/en/blog/2022/07/ghostfolio-meets-internet-identity</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
     <loc>https://ghostfol.io/en/blog/2022/07/how-do-i-get-my-finances-in-order</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/faq</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/blog/2022/08/500-stars-on-github</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/features</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/demo</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/markets</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/faq</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/pricing</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/features</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/register</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/markets</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
   <url>
-    <loc>https://ghostfol.io/resources</loc>
-    <lastmod>2022-07-29T00:00:00+00:00</lastmod>
+    <loc>https://ghostfol.io/en/pricing</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
+  </url>
+  <url>
+    <loc>https://ghostfol.io/en/register</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
+  </url>
+  <url>
+    <loc>https://ghostfol.io/en/resources</loc>
+    <lastmod>2022-08-18T00:00:00+00:00</lastmod>
   </url>
 </urlset>

apps/client/src/index.html

@@ -19,10 +19,7 @@
       name="twitter:description"
       content="Ghostfolio is a lightweight wealth management application for individuals to keep track of stocks, ETFs or cryptocurrencies"
     />
-    <meta
-      name="twitter:image"
-      content="https://www.ghostfol.io/assets/cover.png"
-    />
+    <meta name="twitter:image" content="https://ghostfol.io/assets/cover.png" />
     <meta
       name="twitter:title"
       content="Ghostfolio – Open Source Wealth Management Software"
@@ -37,12 +34,9 @@
       content="Ghostfolio – Open Source Wealth Management Software"
     />
     <meta property="og:type" content="website" />
-    <meta property="og:url" content="https://www.ghostfol.io" />
-    <meta
-      property="og:image"
-      content="https://www.ghostfol.io/assets/cover.png"
-    />
-    <meta property="og:updated_time" content="2022-05-28T00:00:00+00:00" />
+    <meta property="og:url" content="https://ghostfol.io" />
+    <meta property="og:image" content="https://ghostfol.io/assets/cover.png" />
+    <meta property="og:updated_time" content="2022-08-18T00:00:00+00:00" />
     <meta
       property="og:site_name"
       content="Ghostfolio – Open Source Wealth Management Software"
@@ -51,26 +45,26 @@
     <link
       rel="apple-touch-icon"
       sizes="180x180"
-      href="/assets/apple-touch-icon.png"
+      href="../assets/apple-touch-icon.png"
     />
     <link
       rel="icon"
       type="image/png"
       sizes="32x32"
-      href="/assets/favicon-32x32.png"
+      href="../assets/favicon-32x32.png"
     />
     <link
       rel="icon"
       type="image/png"
       sizes="16x16"
-      href="/assets/favicon-16x16.png"
+      href="../assets/favicon-16x16.png"
     />
-    <link rel="manifest" href="/assets/site.webmanifest" />
+    <link rel="manifest" href="../assets/site.webmanifest" />
   </head>
   <body>
     <gf-root></gf-root>
 
-    <script type="module" src="ionicons/ionicons.esm.js"></script>
+    <script type="module" src="../ionicons/ionicons.esm.js"></script>
     <script nomodule="" src="ionicons.js"></script>
 
     <noscript

apps/client/src/styles/bootstrap.scss

@@ -11,7 +11,7 @@
 @import '~bootstrap/scss/root';
 @import '~bootstrap/scss/reboot';
 @import '~bootstrap/scss/type';
-// @import '~bootstrap/scss/images';
+@import '~bootstrap/scss/images';
 // @import '~bootstrap/scss/code';
 @import '~bootstrap/scss/grid';
 // @import '~bootstrap/scss/tables';

libs/common/src/lib/config.ts

@@ -2,16 +2,6 @@ import { DataSource } from '@prisma/client';
 import { JobOptions, JobStatus } from 'bull';
 import ms from 'ms';
 
-import { ToggleOption } from './types';
-
-export const defaultDateRangeOptions: ToggleOption[] = [
-  { label: 'Today', value: '1d' },
-  { label: 'YTD', value: 'ytd' },
-  { label: '1Y', value: '1y' },
-  { label: '5Y', value: '5y' },
-  { label: 'Max', value: 'max' }
-];
-
 export const DEMO_USER_ID = '9b112b4d-3b7d-4bad-9bdd-3b0f7b4dac2f';
 
 export const ghostfolioScraperApiSymbolPrefix = '_GF_';
@@ -49,6 +39,7 @@ export const DATA_GATHERING_QUEUE_PRIORITY_LOW = Number.MAX_SAFE_INTEGER;
 export const DATA_GATHERING_QUEUE_PRIORITY_HIGH = 1;
 
 export const DEFAULT_DATE_FORMAT_MONTH_YEAR = 'MMM yyyy';
+export const DEFAULT_LANGUAGE_CODE = 'en';
 
 export const GATHER_ASSET_PROFILE_PROCESS = 'GATHER_ASSET_PROFILE';
 export const GATHER_ASSET_PROFILE_PROCESS_OPTIONS: JobOptions = {

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

@@ -132,7 +132,9 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
   }
 
   public onDeleteActivity(aId: string) {
-    const confirmation = confirm('Do you really want to delete this activity?');
+    const confirmation = confirm(
+      $localize`Do you really want to delete this activity?`
+    );
 
     if (confirmation) {
       this.activityDeleted.emit(aId);

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

@@ -1,50 +1,50 @@
-<table class="gf-table w-100">
-  <thead>
-    <tr class="mat-header-row">
-      <th class="mat-header-cell px-1 py-2" i18n>Index</th>
-      <th class="mat-header-cell px-1 py-2 text-right">
-        <span class="d-none d-sm-block text-nowrap" i18n
-          >Change from All Time High</span
-        >
-        <span class="d-block d-sm-none text-nowrap" i18n>from ATH</span>
-      </th>
-      <th class="mat-header-cell px-1 py-2 text-right" i18n></th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr *ngFor="let benchmark of benchmarks" class="mat-row">
-      <td class="mat-cell px-1 py-2">
-        <div class="d-flex align-items-center">
-          {{ benchmark.name }}
-        </div>
-      </td>
-      <td class="mat-cell px-1 py-2 text-right">
-        <gf-value
-          class="d-inline-block justify-content-end"
-          size="medium"
-          [isPercent]="true"
-          [locale]="locale"
-          [ngClass]="{
-            'text-danger':
-              benchmark?.performances?.allTimeHigh?.performancePercent < 0,
-            'text-success':
-              benchmark?.performances?.allTimeHigh?.performancePercent > 0
-          }"
-          [value]="
-            benchmark?.performances?.allTimeHigh?.performancePercent ??
-            undefined
-          "
-        ></gf-value>
-      </td>
-      <td class="mat-cell px-1 py-2">
-        <div
-          *ngIf="benchmark?.marketCondition"
-          class="text-center"
-          [title]="benchmark?.marketCondition"
-        >
-          {{ resolveMarketCondition(benchmark.marketCondition).emoji }}
-        </div>
-      </td>
-    </tr>
-  </tbody>
+<table class="gf-table w-100" mat-table [dataSource]="benchmarks">
+  <ng-container matColumnDef="name">
+    <th *matHeaderCellDef class="px-2" i18n mat-header-cell>Index</th>
+    <td *matCellDef="let element" class="px-2" mat-cell>
+      {{ element?.name }}
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="change">
+    <th *matHeaderCellDef class="text-right" mat-header-cell>
+      <span class="d-none d-sm-block text-nowrap" i18n
+        >Change from All Time High</span
+      >
+      <span class="d-block d-sm-none text-nowrap" i18n>from ATH</span>
+    </th>
+    <td *matCellDef="let element" class="text-right" mat-cell>
+      <gf-value
+        class="d-inline-block justify-content-end"
+        size="medium"
+        [isPercent]="true"
+        [locale]="locale"
+        [ngClass]="{
+          'text-danger':
+            element?.performances?.allTimeHigh?.performancePercent < 0,
+          'text-success':
+            element?.performances?.allTimeHigh?.performancePercent > 0
+        }"
+        [value]="
+          element?.performances?.allTimeHigh?.performancePercent ?? undefined
+        "
+      ></gf-value>
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="marketCondition">
+    <th *matHeaderCellDef mat-header-cell></th>
+    <td *matCellDef="let element" class="px-0" mat-cell>
+      <div
+        *ngIf="element?.marketCondition"
+        class="text-center"
+        [title]="element?.marketCondition"
+      >
+        {{ resolveMarketCondition(element.marketCondition).emoji }}
+      </div>
+    </td>
+  </ng-container>
+
+  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+  <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
 </table>

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

@@ -18,6 +18,7 @@ export class BenchmarkComponent implements OnChanges {
   @Input() benchmarks: Benchmark[];
   @Input() locale: string;
 
+  public displayedColumns = ['name', 'change', 'marketCondition'];
   public resolveMarketCondition = resolveMarketCondition;
 
   public constructor() {}

libs/ui/src/lib/benchmark/benchmark.module.ts

@@ -1,5 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { MatTableModule } from '@angular/material/table';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
 
 import { GfValueModule } from '../value';
@@ -8,7 +9,12 @@ import { BenchmarkComponent } from './benchmark.component';
 @NgModule({
   declarations: [BenchmarkComponent],
   exports: [BenchmarkComponent],
-  imports: [CommonModule, GfValueModule, NgxSkeletonLoaderModule],
+  imports: [
+    CommonModule,
+    GfValueModule,
+    MatTableModule,
+    NgxSkeletonLoaderModule
+  ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })
 export class GfBenchmarkModule {}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ghostfolio",
-  "version": "1.176.2",
+  "version": "1.180.0",
   "homepage": "https://ghostfol.io",
   "license": "AGPL-3.0",
   "scripts": {
@@ -13,10 +13,11 @@
     "affected:lint": "nx affected:lint",
     "affected:test": "nx affected:test",
     "angular": "node --max_old_space_size=32768 ./node_modules/@angular/cli/bin/ng",
-    "build:all": "nx run api:build:production && nx run client:build:production && yarn replace-placeholders-in-build",
+    "build:all": "nx run api:build:production && nx run client:build:production --localize && yarn replace-placeholders-in-build",
     "build:dev": "nx run api:build && nx run client:build && yarn replace-placeholders-in-build",
     "build:storybook": "nx run ui:build-storybook",
     "clean": "rimraf dist",
+    "database:baseline": "sh ./prisma/baseline.sh",
     "database:format-schema": "prisma format",
     "database:generate-typings": "prisma generate",
     "database:gui": "prisma studio",
@@ -24,9 +25,11 @@
     "database:migrate": "prisma migrate deploy",
     "database:push": "prisma db push",
     "database:seed": "prisma db seed",
-    "database:setup": "yarn database:push && yarn database:seed",
+    "database:setup": "yarn database:push && yarn database:seed && yarn database:baseline",
+    "database:validate": "prisma validate",
     "dep-graph": "nx dep-graph",
     "e2e": "ng e2e",
+    "extract-locales": "ng extract-i18n client --output-path ./apps/client/src/locales",
     "format": "nx format:write",
     "format:check": "nx format:check",
     "format:write": "nx format:write",
@@ -38,7 +41,7 @@
     "postinstall": "prisma generate && ngcc --properties es2020 browser module main",
     "replace-placeholders-in-build": "node ./replace.build.js",
     "start": "node dist/apps/api/main",
-    "start:client": "ng serve client --hmr -o",
+    "start:client": "ng serve client --configuration=development-en --hmr -o",
     "start:prod": "node apps/api/main",
     "start:server": "nx serve api --watch",
     "start:storybook": "nx run ui:storybook",
@@ -51,16 +54,16 @@
     "workspace-generator": "nx workspace-generator"
   },
   "dependencies": {
-    "@angular/animations": "14.0.2",
-    "@angular/cdk": "14.0.1",
-    "@angular/common": "14.0.2",
-    "@angular/compiler": "14.0.2",
-    "@angular/core": "14.0.2",
-    "@angular/forms": "14.0.2",
-    "@angular/material": "14.0.1",
-    "@angular/platform-browser": "14.0.2",
-    "@angular/platform-browser-dynamic": "14.0.2",
-    "@angular/router": "14.0.2",
+    "@angular/animations": "14.1.0",
+    "@angular/cdk": "14.1.0",
+    "@angular/common": "14.1.0",
+    "@angular/compiler": "14.1.0",
+    "@angular/core": "14.1.0",
+    "@angular/forms": "14.1.0",
+    "@angular/material": "14.1.0",
+    "@angular/platform-browser": "14.1.0",
+    "@angular/platform-browser-dynamic": "14.1.0",
+    "@angular/router": "14.1.0",
     "@codewithdan/observable-store": "2.2.11",
     "@dfinity/agent": "0.12.1",
     "@dfinity/auth-client": "0.12.1",
@@ -70,16 +73,16 @@
     "@dfinity/principal": "0.12.1",
     "@dinero.js/currencies": "2.0.0-alpha.8",
     "@nestjs/bull": "0.5.5",
-    "@nestjs/common": "8.4.7",
-    "@nestjs/config": "2.1.0",
-    "@nestjs/core": "8.4.7",
-    "@nestjs/jwt": "8.0.1",
-    "@nestjs/passport": "8.2.2",
-    "@nestjs/platform-express": "8.4.7",
-    "@nestjs/schedule": "2.0.1",
-    "@nestjs/serve-static": "2.2.2",
-    "@nrwl/angular": "14.3.5",
-    "@prisma/client": "3.15.2",
+    "@nestjs/common": "9.0.7",
+    "@nestjs/config": "2.2.0",
+    "@nestjs/core": "9.0.7",
+    "@nestjs/jwt": "9.0.0",
+    "@nestjs/passport": "9.0.0",
+    "@nestjs/platform-express": "9.0.7",
+    "@nestjs/schedule": "2.1.0",
+    "@nestjs/serve-static": "3.0.0",
+    "@nrwl/angular": "14.5.1",
+    "@prisma/client": "4.1.1",
     "@simplewebauthn/browser": "5.2.1",
     "@simplewebauthn/server": "5.2.1",
     "@stripe/stripe-js": "1.22.0",
@@ -88,7 +91,7 @@
     "bent": "7.3.12",
     "big.js": "6.1.1",
     "bootstrap": "4.6.0",
-    "bull": "4.8.2",
+    "bull": "4.8.5",
     "cache-manager": "3.4.3",
     "cache-manager-redis-store": "2.0.0",
     "chart.js": "3.8.0",
@@ -108,6 +111,7 @@
     "ionicons": "5.5.1",
     "lodash": "4.17.21",
     "ms": "3.0.0-canary.1",
+    "ng-extract-i18n-merge": "2.1.2",
     "ngx-device-detector": "3.0.0",
     "ngx-markdown": "14.0.1",
     "ngx-skeleton-loader": "5.0.0",
@@ -116,7 +120,7 @@
     "passport": "0.6.0",
     "passport-google-oauth20": "2.0.0",
     "passport-jwt": "4.0.0",
-    "prisma": "3.15.2",
+    "prisma": "4.1.1",
     "reflect-metadata": "0.1.13",
     "rxjs": "7.4.0",
     "stripe": "8.199.0",
@@ -127,25 +131,25 @@
     "zone.js": "0.11.6"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "14.0.2",
-    "@angular-eslint/eslint-plugin": "13.2.1",
-    "@angular-eslint/eslint-plugin-template": "13.2.1",
-    "@angular-eslint/template-parser": "13.2.1",
-    "@angular/cli": "14.0.2",
-    "@angular/compiler-cli": "14.0.2",
-    "@angular/language-service": "14.0.2",
-    "@angular/localize": "14.0.2",
-    "@nestjs/schematics": "8.0.5",
-    "@nestjs/testing": "8.2.3",
-    "@nrwl/cli": "14.3.5",
-    "@nrwl/cypress": "14.3.5",
-    "@nrwl/eslint-plugin-nx": "14.3.5",
-    "@nrwl/jest": "14.3.5",
-    "@nrwl/nest": "14.3.5",
-    "@nrwl/node": "14.3.5",
-    "@nrwl/nx-cloud": "14.1.1",
-    "@nrwl/storybook": "14.3.5",
-    "@nrwl/workspace": "14.3.5",
+    "@angular-devkit/build-angular": "14.1.0",
+    "@angular-eslint/eslint-plugin": "14.0.2",
+    "@angular-eslint/eslint-plugin-template": "14.0.2",
+    "@angular-eslint/template-parser": "14.0.2",
+    "@angular/cli": "14.1.0",
+    "@angular/compiler-cli": "14.1.0",
+    "@angular/language-service": "14.1.0",
+    "@angular/localize": "14.1.0",
+    "@nestjs/schematics": "9.0.1",
+    "@nestjs/testing": "9.0.7",
+    "@nrwl/cli": "14.5.1",
+    "@nrwl/cypress": "14.5.1",
+    "@nrwl/eslint-plugin-nx": "14.5.1",
+    "@nrwl/jest": "14.5.1",
+    "@nrwl/nest": "14.5.1",
+    "@nrwl/node": "14.5.1",
+    "@nrwl/nx-cloud": "14.2.0",
+    "@nrwl/storybook": "14.5.1",
+    "@nrwl/workspace": "14.5.1",
     "@simplewebauthn/typescript-types": "5.2.1",
     "@storybook/addon-essentials": "6.5.9",
     "@storybook/angular": "6.5.9",
@@ -153,13 +157,13 @@
     "@storybook/core-server": "6.5.9",
     "@storybook/manager-webpack5": "6.5.9",
     "@types/big.js": "6.1.2",
-    "@types/bull": "3.15.8",
+    "@types/bull": "3.15.9",
     "@types/cache-manager": "3.4.2",
     "@types/color": "3.0.2",
     "@types/google-spreadsheet": "3.1.5",
     "@types/jest": "27.4.1",
     "@types/lodash": "4.14.174",
-    "@types/node": "14.14.33",
+    "@types/node": "16.11.7",
     "@types/papaparse": "5.2.6",
     "@types/passport-google-oauth20": "2.0.11",
     "@typescript-eslint/eslint-plugin": "5.4.0",
@@ -175,7 +179,7 @@
     "import-sort-style-module": "6.0.0",
     "jest": "27.5.1",
     "jest-preset-angular": "11.1.2",
-    "nx": "14.3.5",
+    "nx": "14.5.1",
     "prettier": "2.7.1",
     "replace-in-file": "6.2.0",
     "rimraf": "3.0.2",

prisma/baseline.sh

@@ -0,0 +1,8 @@
+#!/bin/sh
+
+# List all migration scripts based on the directory name and mark the migration as "applied"
+
+for directory in ./prisma/migrations/*/; do 
+	migration=$(echo "$directory" | sed 's/.\/prisma\/migrations\///' | sed 's/\///')
+	yarn prisma migrate resolve --applied $migration
+done

prisma/migrations/20220808181846_added_url_to_symbol_profile_overrides/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "SymbolProfileOverrides" ADD COLUMN "url" TEXT;

prisma/migrations/20220808191912_added_default_value_for_countries_of_symbol_profile_overrides/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "SymbolProfileOverrides" ALTER COLUMN "countries" SET DEFAULT '[]';

prisma/migrations/20220808192002_added_default_value_for_sectors_of_symbol_profile_overrides/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "SymbolProfileOverrides" ALTER COLUMN "sectors" SET DEFAULT '[]';

prisma/schema.prisma

@@ -1,22 +1,22 @@
+generator client {
+  provider        = "prisma-client-js"
+  previewFeatures = []
+  binaryTargets   = ["debian-openssl-1.1.x", "native"]
+}
+
 datasource db {
   provider = "postgresql"
   url      = env("DATABASE_URL")
 }
 
-generator client {
-  provider        = "prisma-client-js"
-  binaryTargets   = ["debian-openssl-1.1.x", "native"]
-  previewFeatures = []
-}
-
 model Access {
   createdAt     DateTime @default(now())
-  GranteeUser   User?    @relation(fields: [granteeUserId], name: "accessGet", references: [id])
   granteeUserId String?
   id            String   @id @default(uuid())
   updatedAt     DateTime @updatedAt
-  User          User     @relation(fields: [userId], name: "accessGive", references: [id])
   userId        String
+  GranteeUser   User?    @relation("accessGet", fields: [granteeUserId], references: [id])
+  User          User     @relation("accessGive", fields: [userId], references: [id])
 }
 
 model Account {
@@ -27,12 +27,12 @@ model Account {
   id          String      @default(uuid())
   isDefault   Boolean     @default(false)
   name        String?
-  Order       Order[]
-  Platform    Platform?   @relation(fields: [platformId], references: [id])
   platformId  String?
   updatedAt   DateTime    @updatedAt
-  User        User        @relation(fields: [userId], references: [id])
   userId      String
+  Platform    Platform?   @relation(fields: [platformId], references: [id])
+  User        User        @relation(fields: [userId], references: [id])
+  Order       Order[]
 
   @@id([id, userId])
 }
@@ -40,8 +40,8 @@ model Account {
 model Analytics {
   activityCount Int      @default(0)
   updatedAt     DateTime @updatedAt
-  User          User     @relation(fields: [userId], references: [id])
   userId        String   @id
+  User          User     @relation(fields: [userId], references: [id])
 }
 
 model AuthDevice {
@@ -51,8 +51,8 @@ model AuthDevice {
   counter             Int
   id                  String   @id @default(uuid())
   updatedAt           DateTime @updatedAt
-  User                User     @relation(fields: [userId], references: [id])
   userId              String
+  User                User     @relation(fields: [userId], references: [id])
 }
 
 model MarketData {
@@ -64,11 +64,10 @@ model MarketData {
   marketPrice Float
 
   @@unique([date, symbol])
-  @@index(fields: [symbol])
+  @@index([symbol])
 }
 
 model Order {
-  Account         Account?      @relation(fields: [accountId, accountUserId], references: [id, userId])
   accountId       String?
   accountUserId   String?
   comment         String?
@@ -78,21 +77,22 @@ model Order {
   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
+  Account         Account?      @relation(fields: [accountId, accountUserId], references: [id, userId])
+  SymbolProfile   SymbolProfile @relation(fields: [symbolProfileId], references: [id])
+  User            User          @relation(fields: [userId], references: [id])
+  tags            Tag[]
 }
 
 model Platform {
-  Account Account[]
   id      String    @id @default(uuid())
   name    String?
   url     String    @unique
+  Account Account[]
 }
 
 model Property {
@@ -105,8 +105,8 @@ model Settings {
   settings  Json?
   updatedAt DateTime  @updatedAt
   viewMode  ViewMode?
-  User      User      @relation(fields: [userId], references: [id])
   userId    String    @id
+  User      User      @relation(fields: [userId], references: [id])
 }
 
 model SymbolProfile {
@@ -118,14 +118,14 @@ model SymbolProfile {
   dataSource             DataSource
   id                     String                  @id @default(uuid())
   name                   String?
-  Order                  Order[]
   updatedAt              DateTime                @updatedAt
   scraperConfiguration   Json?
   sectors                Json?
   symbol                 String
   symbolMapping          Json?
-  SymbolProfileOverrides SymbolProfileOverrides?
   url                    String?
+  Order                  Order[]
+  SymbolProfileOverrides SymbolProfileOverrides?
 
   @@unique([dataSource, symbol])
 }
@@ -133,12 +133,13 @@ model SymbolProfile {
 model SymbolProfileOverrides {
   assetClass      AssetClass?
   assetSubClass   AssetSubClass?
-  countries       Json?
+  countries       Json?          @default("[]")
   name            String?
-  sectors         Json?
-  SymbolProfile   SymbolProfile  @relation(fields: [symbolProfileId], references: [id])
+  sectors         Json?          @default("[]")
+  url             String?
   symbolProfileId String         @id
   updatedAt       DateTime       @updatedAt
+  SymbolProfile   SymbolProfile  @relation(fields: [symbolProfileId], references: [id])
 }
 
 model Subscription {
@@ -146,8 +147,8 @@ model Subscription {
   expiresAt DateTime
   id        String   @id @default(uuid())
   updatedAt DateTime @updatedAt
-  User      User     @relation(fields: [userId], references: [id])
   userId    String
+  User      User     @relation(fields: [userId], references: [id])
 }
 
 model Tag {
@@ -157,23 +158,23 @@ model Tag {
 }
 
 model User {
-  Access        Access[]       @relation("accessGet")
-  AccessGive    Access[]       @relation(name: "accessGive")
   accessToken   String?
-  Account       Account[]
   alias         String?
-  Analytics     Analytics?
   authChallenge String?
-  AuthDevice    AuthDevice[]
   createdAt     DateTime       @default(now())
   id            String         @id @default(uuid())
-  Order         Order[]
   provider      Provider       @default(ANONYMOUS)
   role          Role           @default(USER)
-  Settings      Settings?
-  Subscription  Subscription[]
   thirdPartyId  String?
   updatedAt     DateTime       @updatedAt
+  Access        Access[]       @relation("accessGet")
+  AccessGive    Access[]       @relation("accessGive")
+  Account       Account[]
+  Analytics     Analytics?
+  AuthDevice    AuthDevice[]
+  Order         Order[]
+  Settings      Settings?
+  Subscription  Subscription[]
 }
 
 enum AccountType {