Release 1.17.0 (#171)

* Upgrade frontend dependencies

* Update changelog

.env

@@ -5,12 +5,12 @@ REDIS_HOST=localhost
 REDIS_PORT=6379
 
 # POSTGRES
+POSTGRES_DB=ghostfolio-db
 POSTGRES_USER=user
 POSTGRES_PASSWORD=password
-POSTGRES_DB=ghostfolio-db
 
 ACCESS_TOKEN_SALT=GHOSTFOLIO
 ALPHA_VANTAGE_API_KEY=
-DATABASE_URL=postgresql://user:password@localhost:5432/ghostfolio-db?sslmode=prefer
+DATABASE_URL=postgresql://${POSTGRES_USER}:${POSTGRES_PASSWORD}@localhost:5432/${POSTGRES_DB}?sslmode=prefer
 JWT_SECRET_KEY=123456
 PORT=3333

.travis.yml

@@ -0,0 +1,11 @@
+language: node_js
+git:
+  depth: false
+node_js:
+  - 14
+before_script:
+  - yarn
+script:
+  - yarn format:check
+  - yarn test
+  - yarn build:all

CHANGELOG.md

@@ -5,6 +5,248 @@ 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.17.0 - 15.06.2021
+
+### Changed
+
+- Improved the error page of the sign in with fingerprint
+- Disable the sign in with fingerprint selector for the demo user
+- Upgraded `angular` from version `11.2.4` to `12.0.4`
+- Upgraded `angular-material-css-vars` from version `1.1.2` to `1.2.0`
+- Upgraded `chart.js` from version `3.2.1` to `3.3.2`
+- Upgraded `date-fns` from version `2.19.0` to `2.22.1`
+- Upgraded `eslint` and `prettier` dependencies
+- Upgraded `ngx-device-detector` from version `2.0.6` to `2.1.1`
+- Upgraded `ngx-markdown` from version `11.1.2` to `12.0.1`
+
+## 1.16.0 - 14.06.2021
+
+### Changed
+
+- Improved the sign in with fingerprint
+
+## 1.15.0 - 14.06.2021
+
+### Added
+
+- Added a counter column to the transactions table
+- Added a label to indicate the default account in the accounts table
+- Added an option to limit the items in pie charts
+- Added sign in with fingerprint
+
+### Changed
+
+- Cleaned up the analysis page with an unused chart module
+- Improved the cell alignment in the users table of the admin control panel
+
+### Fixed
+
+- Fixed the last activity column of users in the admin control panel
+
+## 1.14.0 - 09.06.2021
+
+### Added
+
+- Added a connect or create symbol profile model logic on creating a new transaction
+
+### Changed
+
+- Improved the global heat map to visualize investments by country
+
+## 1.13.0 - 08.06.2021
+
+### Added
+
+- Added a global heat map to visualize investments by country
+
+## 1.12.0 - 06.06.2021
+
+### Added
+
+- Added a symbol profile model with additional data
+- Added new pie charts: Investments by continent and country
+
+## 1.11.0 - 05.06.2021
+
+### Added
+
+- Added a dedicated page for the account registration
+- Rendered the average buy prices in the position detail chart (useful for recurring transactions)
+- Introduced the initial prisma migration
+
+### Changed
+
+- Changed the buttons to links (`<a>`) on the tools page
+- Upgraded `prisma` from version `2.20.1` to `2.24.1`
+
+## 1.10.1 - 02.06.2021
+
+### Fixed
+
+- Fixed an optional type in the user interface
+
+## 1.10.0 - 02.06.2021
+
+### Changed
+
+- Moved the tools to a sub path (`/tools`)
+- Extended the pricing page and aligned with the subscription model
+
+## 1.9.0 - 01.06.2021
+
+### Added
+
+- Added the year labels to the investment chart on the x-axis
+
+### Changed
+
+- Respected the data source attribute of the transactions model in the data management for historical data
+- Prettified the generic scraper symbols in the transaction filtering component
+- Changed to the strict mode of distance formatting between two given dates
+
+### Fixed
+
+- Fixed the sorting in various tables
+- Made the order of the rules in the _X-ray_ section consistent
+
+## 1.8.0 - 24.05.2021
+
+### Added
+
+- Added a section for _Analysis_, _X-ray_ and upcoming tools
+
+### Changed
+
+- Introduced a user service implemented as an observable store (single source of truth for state)
+
+### Fixed
+
+- Fixed the performance chart by considering the investment
+- Fixed missing header of public pages (_About_, _Pricing_, _Resources_)
+
+## 1.7.0 - 22.05.2021
+
+### Changed
+
+- Hid footer on mobile (except on landing page)
+
+### Fixed
+
+- Fixed the internal navigation of the _Zen Mode_ in combination with a query parameter
+
+## 1.6.0 - 22.05.2021
+
+### Added
+
+- Added an index in the users table of the admin control panel
+
+### Changed
+
+- Improved the alignment in the users table of the admin control panel
+
+## 1.5.0 - 22.05.2021
+
+### Added
+
+- Added _Zen Mode_: the distraction-free view
+
+## 1.4.0 - 20.05.2021
+
+### Added
+
+- Added filtering by year in the transaction filtering component
+
+### Changed
+
+- Renamed _Ghostfolio Account_ to _My Ghostfolio_
+- Hid unknown exchange in the position overview
+- Disable the base currency selector for the demo user
+- Refactored the portfolio unit tests to work without database
+- Refactored the search functionality of the data management (aligned with data source)
+- Renamed shared helper to `@ghostfolio/common/helper`
+- Moved shared interfaces to `@ghostfolio/common/interfaces`
+- Moved shared types to `@ghostfolio/common/types`
+
+## 1.3.0 - 15.05.2021
+
+### Changed
+
+- Refactored the active menu item state by parsing the current url
+- Used a desaturated background color for unknown types in pie charts
+- Renamed the columns _Initial Share_ and _Current Share_ to _Initial Allocation_ and _Current Allocation_ in the positions table
+
+### Fixed
+
+- Fixed the link to the pricing page
+
+## 1.2.1 - 14.05.2021
+
+### Changed
+
+- Updated the sitemap
+
+## 1.2.0 - 14.05.2021
+
+### Changed
+
+- Harmonized the style of various tables
+- Keep the color per type when switching between _Initial_ and _Current_ in pie charts
+- Upgraded `chart.js` from version `3.0.2` to `3.2.1`
+- Moved the pricing section to a dedicated page
+- Improved the style of the transaction filtering component
+
+### Fixed
+
+- Fixed the tooltips when switching between _Initial_ and _Current_ in pie charts
+
+## 1.1.0 - 11.05.2021
+
+### Added
+
+- Added a button to fetch the current market price in the create or edit transaction dialog
+
+### Changed
+
+- Improved the transaction filtering with multi filter support
+
+### Fixed
+
+- Fixed the filtering by account name in the transactions table
+- Fixed the active menu item state when a modal has opened
+
+## 1.0.0 - 05.05.2021
+
+### Added
+
+- Added the functionality to clone a transaction
+- Added a _Google Play_ badge on the landing page
+
+### Changed
+
+- Changed to maskable icons
+
+## 0.99.0 - 03.05.2021
+
+### Added
+
+- Added support for deleting users in the admin control panel
+
+### Changed
+
+- Eliminated the platform attribute from the transaction model
+
+## 0.98.0 - 02.05.2021
+
+### Added
+
+- Added the logic to create and update accounts
+
+## 0.97.0 - 01.05.2021
+
+### Added
+
+- Added an account page as a preparation for the multi accounts support
+
 ## 0.96.0 - 30.04.2021
 
 ### Added
@@ -32,7 +274,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 
-- Improved the user table styling of the admin control panel
+- Improved the users table styling of the admin control panel
 - Improved the background colors in the dark mode
 
 ## 0.92.0 - 25.04.2021
@@ -40,7 +282,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - Prepared further for multi accounts support: store account for new transactions
-- Added a horizontal scrollbar to the user table of the admin control panel
+- Added a horizontal scrollbar to the users table of the admin control panel
 
 ### Fixed
 
@@ -67,7 +309,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 
-- Improved the user table of the admin control panel
+- Improved the users table of the admin control panel
 
 ## 0.89.0 - 21.04.2021
 
@@ -98,7 +340,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
-- Fixed an issue in the user table of the admin control panel with missing data
+- Fixed an issue in the users table of the admin control panel with missing data
 
 ## 0.86.1 - 18.04.2021
 
@@ -113,7 +355,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Changed the about page for the new license
 - Optimized the data management for historical data
 - Optimized the exchange rate service
-- Improved the user table of the admin control panel
+- Improved the users table of the admin control panel
 
 ### Fixed
 

README.md

@@ -7,13 +7,15 @@
     <a href="https://ghostfol.io"><strong>Live Demo</strong></a>
   </p>
   <p>
+    <img src="https://img.shields.io/badge/contributions-welcome-orange.svg"/>
+    <a href="https://travis-ci.org/github/ghostfolio/ghostfolio" rel="nofollow">
+      <img src="https://travis-ci.org/ghostfolio/ghostfolio.svg?branch=main" alt="Build Status"/></a>
     <a href="https://www.gnu.org/licenses/agpl-3.0" rel="nofollow">
-      <img src="https://img.shields.io/badge/License-AGPL%20v3-blue.svg" alt="License: AGPL v3">
-    </a>
+      <img src="https://img.shields.io/badge/License-AGPL%20v3-blue.svg" alt="License: AGPL v3"/></a>
   </p>
 </div>
 
-**Ghostfolio** is an open source portfolio tracker. The software empowers busy folks to have a sharp look of their financial assets and to make solid, data-driven investment decisions by evaluating automated static portfolio analysis rules.
+**Ghostfolio** is an open source portfolio tracker based on web technology. The software empowers busy folks to have a sharp look of their financial assets and to make solid, data-driven investment decisions by evaluating automated static portfolio analysis rules.
 
 ## Why Ghostfolio?
 
@@ -40,10 +42,13 @@ Ghostfolio is for you if you are...
 ## Features
 
 - ✅ Create, update and delete transactions
+- ✅ Multi account management
 - ✅ Portfolio performance (`Today`, `YTD`, `1Y`, `5Y`, `Max`)
 - ✅ Various charts
 - ✅ Static analysis to identify potential risks in your portfolio
 - ✅ Dark Mode
+- ✅ Zen Mode
+- ✅ Mobile-first design
 
 ## Technology Stack
 
@@ -51,11 +56,11 @@ Ghostfolio is a modern web application written in [TypeScript](https://www.types
 
 ### Backend
 
-The backend is based on [NestJS](https://nestjs.com) using [PostgreSQL](https://www.postgresql.org) as a database and [Redis](https://redis.io) for caching.
+The backend is based on [NestJS](https://nestjs.com) using [PostgreSQL](https://www.postgresql.org) as a database together with [Prisma](https://www.prisma.io) and [Redis](https://redis.io) for caching.
 
 ### Frontend
 
-The frontend is built with [Angular](https://angular.io).
+The frontend is built with [Angular](https://angular.io) and uses [Angular Material](https://material.angular.io) with utility classes from [Bootstrap](https://getbootstrap.com).
 
 ## Getting Started
 
@@ -68,28 +73,29 @@ The frontend is built with [Angular](https://angular.io).
 ### Setup
 
 1. Run `yarn install`
-2. Run `cd docker`
-3. Run `docker compose build`
-4. Run `docker compose up -d` to start [PostgreSQL](https://www.postgresql.org) and [Redis](https://redis.io)
-5. Run `cd -` to go back to the project root directory
-6. Run `yarn setup:database` to initialize the database schema and populate your database with (example) data
-7. Start server and client (see _Development_)
-8. Login as _Admin_ with the following _Security Token_: `ae76872ae8f3419c6d6f64bf51888ecbcc703927a342d815fafe486acdb938da07d0cf44fca211a0be74a423238f535362d390a41e81e633a9ce668a6e31cdf9`
-9. Go to the _Admin Control Panel_ and press _Gather All Data_ to fetch historical data
-10. Press _Sign out_ and check out the _Live Demo_
+1. Run `cd docker`
+1. Run `docker compose up -d` to start [PostgreSQL](https://www.postgresql.org) and [Redis](https://redis.io)
+1. Run `cd -` to go back to the project root directory
+1. Run `yarn setup:database` to initialize the database schema and populate your database with (example) data
+1. Start server and client (see [_Development_](#Development))
+1. Login as _Admin_ with the following _Security Token_: `ae76872ae8f3419c6d6f64bf51888ecbcc703927a342d815fafe486acdb938da07d0cf44fca211a0be74a423238f535362d390a41e81e633a9ce668a6e31cdf9`
+1. Go to the _Admin Control Panel_ and press _Gather All Data_ to fetch historical data
+1. Press _Sign out_ and check out the _Live Demo_
 
 ## Development
 
-Please make sure you have completed the instructions from _Setup_
+Please make sure you have completed the instructions from [_Setup_](#Setup)
 
 ### Start server
 
-- Debug: Run `yarn watch:server` and click "Launch Program" in _Visual Studio Code_
-- Serve: Run `yarn start:server`
+<ol type="a">
+  <li>Debug: Run <code>yarn watch:server</code> and click "Launch Program" in <i>Visual Studio Code</i></li>
+  <li>Serve: Run <code>yarn start:server</code></li>
+</ol>
 
 ### Start client
 
-- Run `yarn start:client`
+Run `yarn start:client`
 
 ## Testing
 

angular.json

@@ -86,7 +86,6 @@
             "main": "apps/client/src/main.ts",
             "polyfills": "apps/client/src/polyfills.ts",
             "tsConfig": "apps/client/tsconfig.app.json",
-            "aot": true,
             "assets": [
               "apps/client/src/assets",
               {
@@ -121,7 +120,13 @@
               }
             ],
             "styles": ["apps/client/src/styles.scss"],
-            "scripts": ["node_modules/marked/lib/marked.js"]
+            "scripts": ["node_modules/marked/lib/marked.js"],
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
@@ -152,7 +157,8 @@
               ]
             }
           },
-          "outputs": ["{options.outputPath}"]
+          "outputs": ["{options.outputPath}"],
+          "defaultConfiguration": ""
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
@@ -208,22 +214,22 @@
         }
       }
     },
-    "helper": {
-      "root": "libs/helper",
-      "sourceRoot": "libs/helper/src",
+    "common": {
+      "root": "libs/common",
+      "sourceRoot": "libs/common/src",
       "projectType": "library",
       "architect": {
         "lint": {
           "builder": "@nrwl/linter:eslint",
           "options": {
-            "lintFilePatterns": ["libs/helper/**/*.ts"]
+            "lintFilePatterns": ["libs/common/**/*.ts"]
           }
         },
         "test": {
           "builder": "@nrwl/jest:jest",
-          "outputs": ["coverage/libs/helper"],
+          "outputs": ["coverage/libs/common"],
           "options": {
-            "jestConfig": "libs/helper/jest.config.js",
+            "jestConfig": "libs/common/jest.config.js",
             "passWithNoTests": true
           }
         }

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

@@ -1,10 +1,10 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
+import { Access } from '@ghostfolio/common/interfaces';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import { Controller, Get, Inject, UseGuards } from '@nestjs/common';
 import { REQUEST } from '@nestjs/core';
 import { AuthGuard } from '@nestjs/passport';
 
 import { AccessService } from './access.service';
-import { Access } from './interfaces/access.interface';
 
 @Controller('access')
 export class AccessController {

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

@@ -1,9 +1,8 @@
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { AccessWithGranteeUser } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
 import { Prisma } from '@prisma/client';
 
-import { AccessWithGranteeUser } from './interfaces/access-with-grantee-user.type';
-
 @Injectable()
 export class AccessService {
   public constructor(private prisma: PrismaService) {}

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

@@ -0,0 +1,241 @@
+import { nullifyValuesInObjects } from '@ghostfolio/api/helper/object.helper';
+import { ImpersonationService } from '@ghostfolio/api/services/impersonation.service';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
+import {
+  Body,
+  Controller,
+  Delete,
+  Get,
+  Headers,
+  HttpException,
+  Inject,
+  Param,
+  Post,
+  Put,
+  UseGuards
+} from '@nestjs/common';
+import { REQUEST } from '@nestjs/core';
+import { AuthGuard } from '@nestjs/passport';
+import { Account as AccountModel } from '@prisma/client';
+import { StatusCodes, getReasonPhrase } from 'http-status-codes';
+
+import { AccountService } from './account.service';
+import { CreateAccountDto } from './create-account.dto';
+import { UpdateAccountDto } from './update-account.dto';
+
+@Controller('account')
+export class AccountController {
+  public constructor(
+    private readonly accountService: AccountService,
+    private readonly impersonationService: ImpersonationService,
+    @Inject(REQUEST) private readonly request: RequestWithUser
+  ) {}
+
+  @Delete(':id')
+  @UseGuards(AuthGuard('jwt'))
+  public async deleteAccount(@Param('id') id: string): Promise<AccountModel> {
+    if (
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.deleteAccount
+      )
+    ) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    const account = await this.accountService.accountWithOrders(
+      {
+        id_userId: {
+          id,
+          userId: this.request.user.id
+        }
+      },
+      { Order: true }
+    );
+
+    if (account?.isDefault || account?.Order.length > 0) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    return this.accountService.deleteAccount(
+      {
+        id_userId: {
+          id,
+          userId: this.request.user.id
+        }
+      },
+      this.request.user.id
+    );
+  }
+
+  @Get()
+  @UseGuards(AuthGuard('jwt'))
+  public async getAllAccounts(
+    @Headers('impersonation-id') impersonationId
+  ): Promise<AccountModel[]> {
+    const impersonationUserId = await this.impersonationService.validateImpersonationId(
+      impersonationId,
+      this.request.user.id
+    );
+
+    let accounts = await this.accountService.accounts({
+      include: { Order: true, Platform: true },
+      orderBy: { name: 'asc' },
+      where: { userId: impersonationUserId || this.request.user.id }
+    });
+
+    if (
+      impersonationUserId &&
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.readForeignPortfolio
+      )
+    ) {
+      accounts = nullifyValuesInObjects(accounts, [
+        'fee',
+        'quantity',
+        'unitPrice'
+      ]);
+    }
+
+    return accounts;
+  }
+
+  @Get(':id')
+  @UseGuards(AuthGuard('jwt'))
+  public async getAccountById(@Param('id') id: string): Promise<AccountModel> {
+    return this.accountService.account({
+      id_userId: {
+        id,
+        userId: this.request.user.id
+      }
+    });
+  }
+
+  @Post()
+  @UseGuards(AuthGuard('jwt'))
+  public async createAccount(
+    @Body() data: CreateAccountDto
+  ): Promise<AccountModel> {
+    if (
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.createAccount
+      )
+    ) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    if (data.platformId) {
+      const platformId = data.platformId;
+      delete data.platformId;
+
+      return this.accountService.createAccount(
+        {
+          ...data,
+          Platform: { connect: { id: platformId } },
+          User: { connect: { id: this.request.user.id } }
+        },
+        this.request.user.id
+      );
+    } else {
+      delete data.platformId;
+
+      return this.accountService.createAccount(
+        {
+          ...data,
+          User: { connect: { id: this.request.user.id } }
+        },
+        this.request.user.id
+      );
+    }
+  }
+
+  @Put(':id')
+  @UseGuards(AuthGuard('jwt'))
+  public async update(@Param('id') id: string, @Body() data: UpdateAccountDto) {
+    if (
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.updateAccount
+      )
+    ) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    const originalAccount = await this.accountService.account({
+      id_userId: {
+        id,
+        userId: this.request.user.id
+      }
+    });
+
+    if (!originalAccount) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    if (data.platformId) {
+      const platformId = data.platformId;
+      delete data.platformId;
+
+      return this.accountService.updateAccount(
+        {
+          data: {
+            ...data,
+            Platform: { connect: { id: platformId } },
+            User: { connect: { id: this.request.user.id } }
+          },
+          where: {
+            id_userId: {
+              id,
+              userId: this.request.user.id
+            }
+          }
+        },
+        this.request.user.id
+      );
+    } else {
+      // platformId is null, remove it
+      delete data.platformId;
+
+      return this.accountService.updateAccount(
+        {
+          data: {
+            ...data,
+            Platform: originalAccount.platformId
+              ? { disconnect: true }
+              : undefined,
+            User: { connect: { id: this.request.user.id } }
+          },
+          where: {
+            id_userId: {
+              id,
+              userId: this.request.user.id
+            }
+          }
+        },
+        this.request.user.id
+      );
+    }
+  }
+}

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

@@ -0,0 +1,30 @@
+import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
+import { DataProviderService } from '@ghostfolio/api/services/data-provider.service';
+import { AlphaVantageService } from '@ghostfolio/api/services/data-provider/alpha-vantage/alpha-vantage.service';
+import { GhostfolioScraperApiService } from '@ghostfolio/api/services/data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service';
+import { RakutenRapidApiService } from '@ghostfolio/api/services/data-provider/rakuten-rapid-api/rakuten-rapid-api.service';
+import { YahooFinanceService } from '@ghostfolio/api/services/data-provider/yahoo-finance/yahoo-finance.service';
+import { ImpersonationService } from '@ghostfolio/api/services/impersonation.service';
+import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { Module } from '@nestjs/common';
+
+import { RedisCacheModule } from '../redis-cache/redis-cache.module';
+import { AccountController } from './account.controller';
+import { AccountService } from './account.service';
+
+@Module({
+  imports: [RedisCacheModule],
+  controllers: [AccountController],
+  providers: [
+    AccountService,
+    AlphaVantageService,
+    ConfigurationService,
+    DataProviderService,
+    GhostfolioScraperApiService,
+    ImpersonationService,
+    PrismaService,
+    RakutenRapidApiService,
+    YahooFinanceService
+  ]
+})
+export class AccountModule {}

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

@@ -0,0 +1,89 @@
+import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { Injectable } from '@nestjs/common';
+import { Account, Order, Prisma } from '@prisma/client';
+
+import { RedisCacheService } from '../redis-cache/redis-cache.service';
+
+@Injectable()
+export class AccountService {
+  public constructor(
+    private readonly redisCacheService: RedisCacheService,
+    private prisma: PrismaService
+  ) {}
+
+  public async account(
+    accountWhereUniqueInput: Prisma.AccountWhereUniqueInput
+  ): Promise<Account | null> {
+    return this.prisma.account.findUnique({
+      where: accountWhereUniqueInput
+    });
+  }
+
+  public async accountWithOrders(
+    accountWhereUniqueInput: Prisma.AccountWhereUniqueInput,
+    accountInclude: Prisma.AccountInclude
+  ): Promise<
+    Account & {
+      Order?: Order[];
+    }
+  > {
+    return this.prisma.account.findUnique({
+      include: accountInclude,
+      where: accountWhereUniqueInput
+    });
+  }
+
+  public async accounts(params: {
+    include?: Prisma.AccountInclude;
+    skip?: number;
+    take?: number;
+    cursor?: Prisma.AccountWhereUniqueInput;
+    where?: Prisma.AccountWhereInput;
+    orderBy?: Prisma.AccountOrderByInput;
+  }): Promise<Account[]> {
+    const { include, skip, take, cursor, where, orderBy } = params;
+
+    return this.prisma.account.findMany({
+      cursor,
+      include,
+      orderBy,
+      skip,
+      take,
+      where
+    });
+  }
+
+  public async createAccount(
+    data: Prisma.AccountCreateInput,
+    aUserId: string
+  ): Promise<Account> {
+    return this.prisma.account.create({
+      data
+    });
+  }
+
+  public async deleteAccount(
+    where: Prisma.AccountWhereUniqueInput,
+    aUserId: string
+  ): Promise<Account> {
+    this.redisCacheService.remove(`${aUserId}.portfolio`);
+
+    return this.prisma.account.delete({
+      where
+    });
+  }
+
+  public async updateAccount(
+    params: {
+      where: Prisma.AccountWhereUniqueInput;
+      data: Prisma.AccountUpdateInput;
+    },
+    aUserId: string
+  ): Promise<Account> {
+    const { data, where } = params;
+    return this.prisma.account.update({
+      data,
+      where
+    });
+  }
+}

apps/api/src/app/account/create-account.dto.ts

@@ -0,0 +1,14 @@
+import { AccountType } from '@prisma/client';
+import { IsString, ValidateIf } from 'class-validator';
+
+export class CreateAccountDto {
+  @IsString()
+  accountType: AccountType;
+
+  @IsString()
+  name: string;
+
+  @IsString()
+  @ValidateIf((object, value) => value !== null)
+  platformId: string | null;
+}

apps/api/src/app/account/update-account.dto.ts

@@ -0,0 +1,17 @@
+import { AccountType } from '@prisma/client';
+import { IsString, ValidateIf } from 'class-validator';
+
+export class UpdateAccountDto {
+  @IsString()
+  accountType: AccountType;
+
+  @IsString()
+  id: string;
+
+  @IsString()
+  name: string;
+
+  @IsString()
+  @ValidateIf((object, value) => value !== null)
+  platformId: string | null;
+}

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

@@ -1,6 +1,11 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
 import { DataGatheringService } from '@ghostfolio/api/services/data-gathering.service';
-import { getPermissions, hasPermission, permissions } from '@ghostfolio/helper';
+import { AdminData } from '@ghostfolio/common/interfaces';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Controller,
   Get,
@@ -14,7 +19,6 @@ import { AuthGuard } from '@nestjs/passport';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';
 
 import { AdminService } from './admin.service';
-import { AdminData } from './interfaces/admin-data.interface';
 
 @Controller('admin')
 export class AdminController {

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

@@ -1,10 +1,9 @@
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { AdminData } from '@ghostfolio/common/interfaces';
 import { Injectable } from '@nestjs/common';
 import { Currency } from '@prisma/client';
 
-import { AdminData } from './interfaces/admin-data.interface';
-
 @Injectable()
 export class AdminService {
   public constructor(
@@ -109,7 +108,7 @@ export class AdminService {
         createdAt: true,
         id: true
       },
-      take: 20,
+      take: 30,
       where: {
         NOT: {
           Analytics: null

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

@@ -1,5 +1,6 @@
 import { join } from 'path';
 
+import { AuthDeviceModule } from '@ghostfolio/api/app/auth-device/auth-device.module';
 import { Module } from '@nestjs/common';
 import { ConfigModule } from '@nestjs/config';
 import { ScheduleModule } from '@nestjs/schedule';
@@ -16,6 +17,7 @@ import { YahooFinanceService } from '../services/data-provider/yahoo-finance/yah
 import { ExchangeRateDataService } from '../services/exchange-rate-data.service';
 import { PrismaService } from '../services/prisma.service';
 import { AccessModule } from './access/access.module';
+import { AccountModule } from './account/account.module';
 import { AdminModule } from './admin/admin.module';
 import { AppController } from './app.controller';
 import { AuthModule } from './auth/auth.module';
@@ -32,6 +34,8 @@ import { UserModule } from './user/user.module';
   imports: [
     AdminModule,
     AccessModule,
+    AccountModule,
+    AuthDeviceModule,
     AuthModule,
     CacheModule,
     ConfigModule.forRoot(),

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

@@ -0,0 +1,44 @@
+import { AuthDeviceService } from '@ghostfolio/api/app/auth-device/auth-device.service';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
+import {
+  Controller,
+  Delete,
+  HttpException,
+  Inject,
+  Param,
+  UseGuards
+} from '@nestjs/common';
+import { REQUEST } from '@nestjs/core';
+import { AuthGuard } from '@nestjs/passport';
+import { StatusCodes, getReasonPhrase } from 'http-status-codes';
+
+@Controller('auth-device')
+export class AuthDeviceController {
+  public constructor(
+    private readonly authDeviceService: AuthDeviceService,
+    @Inject(REQUEST) private readonly request: RequestWithUser
+  ) {}
+
+  @Delete(':id')
+  @UseGuards(AuthGuard('jwt'))
+  public async deleteAuthDevice(@Param('id') id: string): Promise<void> {
+    if (
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.deleteAuthDevice
+      )
+    ) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    await this.authDeviceService.deleteAuthDevice({ id });
+  }
+}

apps/api/src/app/auth-device/auth-device.dto.ts

@@ -0,0 +1,4 @@
+export interface AuthDeviceDto {
+  createdAt: string;
+  id: string;
+}

apps/api/src/app/auth-device/auth-device.module.ts

@@ -0,0 +1,18 @@
+import { AuthDeviceController } from '@ghostfolio/api/app/auth-device/auth-device.controller';
+import { AuthDeviceService } from '@ghostfolio/api/app/auth-device/auth-device.service';
+import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
+import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { Module } from '@nestjs/common';
+import { JwtModule } from '@nestjs/jwt';
+
+@Module({
+  controllers: [AuthDeviceController],
+  imports: [
+    JwtModule.register({
+      secret: process.env.JWT_SECRET_KEY,
+      signOptions: { expiresIn: '180 days' }
+    })
+  ],
+  providers: [AuthDeviceService, ConfigurationService, PrismaService]
+})
+export class AuthDeviceModule {}

apps/api/src/app/auth-device/auth-device.service.ts

@@ -0,0 +1,65 @@
+import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
+import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { Injectable } from '@nestjs/common';
+import { AuthDevice, Prisma } from '@prisma/client';
+
+@Injectable()
+export class AuthDeviceService {
+  public constructor(
+    private readonly configurationService: ConfigurationService,
+    private prisma: PrismaService
+  ) {}
+
+  public async authDevice(
+    where: Prisma.AuthDeviceWhereUniqueInput
+  ): Promise<AuthDevice | null> {
+    return this.prisma.authDevice.findUnique({
+      where
+    });
+  }
+
+  public async authDevices(params: {
+    skip?: number;
+    take?: number;
+    cursor?: Prisma.AuthDeviceWhereUniqueInput;
+    where?: Prisma.AuthDeviceWhereInput;
+    orderBy?: Prisma.AuthDeviceOrderByInput;
+  }): Promise<AuthDevice[]> {
+    const { skip, take, cursor, where, orderBy } = params;
+    return this.prisma.authDevice.findMany({
+      skip,
+      take,
+      cursor,
+      where,
+      orderBy
+    });
+  }
+
+  public async createAuthDevice(
+    data: Prisma.AuthDeviceCreateInput
+  ): Promise<AuthDevice> {
+    return this.prisma.authDevice.create({
+      data
+    });
+  }
+
+  public async updateAuthDevice(params: {
+    data: Prisma.AuthDeviceUpdateInput;
+    where: Prisma.AuthDeviceWhereUniqueInput;
+  }): Promise<AuthDevice> {
+    const { data, where } = params;
+
+    return this.prisma.authDevice.update({
+      data,
+      where
+    });
+  }
+
+  public async deleteAuthDevice(
+    where: Prisma.AuthDeviceWhereUniqueInput
+  ): Promise<AuthDevice> {
+    return this.prisma.authDevice.delete({
+      where
+    });
+  }
+}

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

@@ -1,9 +1,12 @@
+import { WebAuthService } from '@ghostfolio/api/app/auth/web-auth.service';
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import {
+  Body,
   Controller,
   Get,
   HttpException,
   Param,
+  Post,
   Req,
   Res,
   UseGuards
@@ -12,12 +15,17 @@ import { AuthGuard } from '@nestjs/passport';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';
 
 import { AuthService } from './auth.service';
+import {
+  AssertionCredentialJSON,
+  AttestationCredentialJSON
+} from './interfaces/simplewebauthn';
 
 @Controller('auth')
 export class AuthController {
   public constructor(
     private readonly authService: AuthService,
-    private readonly configurationService: ConfigurationService
+    private readonly configurationService: ConfigurationService,
+    private readonly webAuthService: WebAuthService
   ) {}
 
   @Get('anonymous/:accessToken')
@@ -53,4 +61,44 @@ export class AuthController {
       res.redirect(`${this.configurationService.get('ROOT_URL')}/auth`);
     }
   }
+
+  @Get('webauthn/generate-attestation-options')
+  @UseGuards(AuthGuard('jwt'))
+  public async generateAttestationOptions() {
+    return this.webAuthService.generateAttestationOptions();
+  }
+
+  @Post('webauthn/verify-attestation')
+  @UseGuards(AuthGuard('jwt'))
+  public async verifyAttestation(
+    @Body() body: { deviceName: string; credential: AttestationCredentialJSON }
+  ) {
+    return this.webAuthService.verifyAttestation(
+      body.deviceName,
+      body.credential
+    );
+  }
+
+  @Post('webauthn/generate-assertion-options')
+  public async generateAssertionOptions(@Body() body: { deviceId: string }) {
+    return this.webAuthService.generateAssertionOptions(body.deviceId);
+  }
+
+  @Post('webauthn/verify-assertion')
+  public async verifyAssertion(
+    @Body() body: { deviceId: string; credential: AssertionCredentialJSON }
+  ) {
+    try {
+      const authToken = await this.webAuthService.verifyAssertion(
+        body.deviceId,
+        body.credential
+      );
+      return { authToken };
+    } catch {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+  }
 }

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

@@ -1,3 +1,5 @@
+import { AuthDeviceService } from '@ghostfolio/api/app/auth-device/auth-device.service';
+import { WebAuthService } from '@ghostfolio/api/app/auth/web-auth.service';
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
 import { Module } from '@nestjs/common';
@@ -18,12 +20,14 @@ import { JwtStrategy } from './jwt.strategy';
     })
   ],
   providers: [
+    AuthDeviceService,
     AuthService,
     ConfigurationService,
     GoogleStrategy,
     JwtStrategy,
     PrismaService,
-    UserService
+    UserService,
+    WebAuthService
   ]
 })
 export class AuthModule {}

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

@@ -1,5 +1,10 @@
+import { AuthDeviceDto } from '@ghostfolio/api/app/auth-device/auth-device.dto';
 import { Provider } from '@prisma/client';
 
+export interface AuthDeviceDialogParams {
+  authDevice: AuthDeviceDto;
+}
+
 export interface ValidateOAuthLoginParams {
   provider: Provider;
   thirdPartyId: string;

apps/api/src/app/auth/interfaces/simplewebauthn.ts

@@ -0,0 +1,226 @@
+export interface AuthenticatorAssertionResponse extends AuthenticatorResponse {
+  readonly authenticatorData: ArrayBuffer;
+  readonly signature: ArrayBuffer;
+  readonly userHandle: ArrayBuffer | null;
+}
+export interface AuthenticatorAttestationResponse
+  extends AuthenticatorResponse {
+  readonly attestationObject: ArrayBuffer;
+}
+export interface AuthenticationExtensionsClientInputs {
+  appid?: string;
+  appidExclude?: string;
+  credProps?: boolean;
+  uvm?: boolean;
+}
+export interface AuthenticationExtensionsClientOutputs {
+  appid?: boolean;
+  credProps?: CredentialPropertiesOutput;
+  uvm?: UvmEntries;
+}
+export interface AuthenticatorSelectionCriteria {
+  authenticatorAttachment?: AuthenticatorAttachment;
+  requireResidentKey?: boolean;
+  residentKey?: ResidentKeyRequirement;
+  userVerification?: UserVerificationRequirement;
+}
+export interface PublicKeyCredential extends Credential {
+  readonly rawId: ArrayBuffer;
+  readonly response: AuthenticatorResponse;
+  getClientExtensionResults(): AuthenticationExtensionsClientOutputs;
+}
+export interface PublicKeyCredentialCreationOptions {
+  attestation?: AttestationConveyancePreference;
+  authenticatorSelection?: AuthenticatorSelectionCriteria;
+  challenge: BufferSource;
+  excludeCredentials?: PublicKeyCredentialDescriptor[];
+  extensions?: AuthenticationExtensionsClientInputs;
+  pubKeyCredParams: PublicKeyCredentialParameters[];
+  rp: PublicKeyCredentialRpEntity;
+  timeout?: number;
+  user: PublicKeyCredentialUserEntity;
+}
+export interface PublicKeyCredentialDescriptor {
+  id: BufferSource;
+  transports?: AuthenticatorTransport[];
+  type: PublicKeyCredentialType;
+}
+export interface PublicKeyCredentialParameters {
+  alg: COSEAlgorithmIdentifier;
+  type: PublicKeyCredentialType;
+}
+export interface PublicKeyCredentialRequestOptions {
+  allowCredentials?: PublicKeyCredentialDescriptor[];
+  challenge: BufferSource;
+  extensions?: AuthenticationExtensionsClientInputs;
+  rpId?: string;
+  timeout?: number;
+  userVerification?: UserVerificationRequirement;
+}
+export interface PublicKeyCredentialUserEntity
+  extends PublicKeyCredentialEntity {
+  displayName: string;
+  id: BufferSource;
+}
+export interface AuthenticatorResponse {
+  readonly clientDataJSON: ArrayBuffer;
+}
+export interface CredentialPropertiesOutput {
+  rk?: boolean;
+}
+export interface Credential {
+  readonly id: string;
+  readonly type: string;
+}
+export interface PublicKeyCredentialRpEntity extends PublicKeyCredentialEntity {
+  id?: string;
+}
+export interface PublicKeyCredentialEntity {
+  name: string;
+}
+export declare type AttestationConveyancePreference =
+  | 'direct'
+  | 'enterprise'
+  | 'indirect'
+  | 'none';
+export declare type AuthenticatorTransport = 'ble' | 'internal' | 'nfc' | 'usb';
+export declare type COSEAlgorithmIdentifier = number;
+export declare type UserVerificationRequirement =
+  | 'discouraged'
+  | 'preferred'
+  | 'required';
+export declare type UvmEntries = UvmEntry[];
+export declare type AuthenticatorAttachment = 'cross-platform' | 'platform';
+export declare type ResidentKeyRequirement =
+  | 'discouraged'
+  | 'preferred'
+  | 'required';
+export declare type BufferSource = ArrayBufferView | ArrayBuffer;
+export declare type PublicKeyCredentialType = 'public-key';
+export declare type UvmEntry = number[];
+
+export interface PublicKeyCredentialCreationOptionsJSON
+  extends Omit<
+    PublicKeyCredentialCreationOptions,
+    'challenge' | 'user' | 'excludeCredentials'
+  > {
+  user: PublicKeyCredentialUserEntityJSON;
+  challenge: Base64URLString;
+  excludeCredentials: PublicKeyCredentialDescriptorJSON[];
+  extensions?: AuthenticationExtensionsClientInputs;
+}
+/**
+ * A variant of PublicKeyCredentialRequestOptions suitable for JSON transmission to the browser to
+ * (eventually) get passed into navigator.credentials.get(...) in the browser.
+ */
+export interface PublicKeyCredentialRequestOptionsJSON
+  extends Omit<
+    PublicKeyCredentialRequestOptions,
+    'challenge' | 'allowCredentials'
+  > {
+  challenge: Base64URLString;
+  allowCredentials?: PublicKeyCredentialDescriptorJSON[];
+  extensions?: AuthenticationExtensionsClientInputs;
+}
+export interface PublicKeyCredentialDescriptorJSON
+  extends Omit<PublicKeyCredentialDescriptor, 'id'> {
+  id: Base64URLString;
+}
+export interface PublicKeyCredentialUserEntityJSON
+  extends Omit<PublicKeyCredentialUserEntity, 'id'> {
+  id: string;
+}
+/**
+ * The value returned from navigator.credentials.create()
+ */
+export interface AttestationCredential extends PublicKeyCredential {
+  response: AuthenticatorAttestationResponseFuture;
+}
+/**
+ * A slightly-modified AttestationCredential to simplify working with ArrayBuffers that
+ * are Base64URL-encoded in the browser so that they can be sent as JSON to the server.
+ */
+export interface AttestationCredentialJSON
+  extends Omit<
+    AttestationCredential,
+    'response' | 'rawId' | 'getClientExtensionResults'
+  > {
+  rawId: Base64URLString;
+  response: AuthenticatorAttestationResponseJSON;
+  clientExtensionResults: AuthenticationExtensionsClientOutputs;
+  transports?: AuthenticatorTransport[];
+}
+/**
+ * The value returned from navigator.credentials.get()
+ */
+export interface AssertionCredential extends PublicKeyCredential {
+  response: AuthenticatorAssertionResponse;
+}
+/**
+ * A slightly-modified AssertionCredential to simplify working with ArrayBuffers that
+ * are Base64URL-encoded in the browser so that they can be sent as JSON to the server.
+ */
+export interface AssertionCredentialJSON
+  extends Omit<
+    AssertionCredential,
+    'response' | 'rawId' | 'getClientExtensionResults'
+  > {
+  rawId: Base64URLString;
+  response: AuthenticatorAssertionResponseJSON;
+  clientExtensionResults: AuthenticationExtensionsClientOutputs;
+}
+/**
+ * A slightly-modified AuthenticatorAttestationResponse to simplify working with ArrayBuffers that
+ * are Base64URL-encoded in the browser so that they can be sent as JSON to the server.
+ */
+export interface AuthenticatorAttestationResponseJSON
+  extends Omit<
+    AuthenticatorAttestationResponseFuture,
+    'clientDataJSON' | 'attestationObject'
+  > {
+  clientDataJSON: Base64URLString;
+  attestationObject: Base64URLString;
+}
+/**
+ * A slightly-modified AuthenticatorAssertionResponse to simplify working with ArrayBuffers that
+ * are Base64URL-encoded in the browser so that they can be sent as JSON to the server.
+ */
+export interface AuthenticatorAssertionResponseJSON
+  extends Omit<
+    AuthenticatorAssertionResponse,
+    'authenticatorData' | 'clientDataJSON' | 'signature' | 'userHandle'
+  > {
+  authenticatorData: Base64URLString;
+  clientDataJSON: Base64URLString;
+  signature: Base64URLString;
+  userHandle?: string;
+}
+/**
+ * A WebAuthn-compatible device and the information needed to verify assertions by it
+ */
+export declare type AuthenticatorDevice = {
+  credentialPublicKey: Buffer;
+  credentialID: Buffer;
+  counter: number;
+  transports?: AuthenticatorTransport[];
+};
+/**
+ * An attempt to communicate that this isn't just any string, but a Base64URL-encoded string
+ */
+export declare type Base64URLString = string;
+/**
+ * AuthenticatorAttestationResponse in TypeScript's DOM lib is outdated (up through v3.9.7).
+ * Maintain an augmented version here so we can implement additional properties as the WebAuthn
+ * spec evolves.
+ *
+ * See https://www.w3.org/TR/webauthn-2/#iface-authenticatorattestationresponse
+ *
+ * Properties marked optional are not supported in all browsers.
+ */
+export interface AuthenticatorAttestationResponseFuture
+  extends AuthenticatorAttestationResponse {
+  getTransports?: () => AuthenticatorTransport[];
+  getAuthenticatorData?: () => ArrayBuffer;
+  getPublicKey?: () => ArrayBuffer;
+  getPublicKeyAlgorithm?: () => COSEAlgorithmIdentifier[];
+}

apps/api/src/app/auth/web-auth.service.ts

@@ -0,0 +1,216 @@
+import { AuthDeviceDto } from '@ghostfolio/api/app/auth-device/auth-device.dto';
+import { AuthDeviceService } from '@ghostfolio/api/app/auth-device/auth-device.service';
+import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
+import { RequestWithUser } from '@ghostfolio/common/types';
+import {
+  Inject,
+  Injectable,
+  InternalServerErrorException
+} from '@nestjs/common';
+import { REQUEST } from '@nestjs/core';
+import { JwtService } from '@nestjs/jwt';
+import {
+  GenerateAssertionOptionsOpts,
+  GenerateAttestationOptionsOpts,
+  VerifiedAssertion,
+  VerifiedAttestation,
+  VerifyAssertionResponseOpts,
+  VerifyAttestationResponseOpts,
+  generateAssertionOptions,
+  generateAttestationOptions,
+  verifyAssertionResponse,
+  verifyAttestationResponse
+} from '@simplewebauthn/server';
+
+import { UserService } from '../user/user.service';
+import {
+  AssertionCredentialJSON,
+  AttestationCredentialJSON
+} from './interfaces/simplewebauthn';
+
+@Injectable()
+export class WebAuthService {
+  public constructor(
+    private readonly configurationService: ConfigurationService,
+    private readonly deviceService: AuthDeviceService,
+    private readonly jwtService: JwtService,
+    private readonly userService: UserService,
+    @Inject(REQUEST) private readonly request: RequestWithUser
+  ) {}
+
+  get rpID() {
+    return this.configurationService.get('WEB_AUTH_RP_ID');
+  }
+
+  get expectedOrigin() {
+    return this.configurationService.get('ROOT_URL');
+  }
+
+  public async generateAttestationOptions() {
+    const user = this.request.user;
+
+    const opts: GenerateAttestationOptionsOpts = {
+      rpName: 'Ghostfolio',
+      rpID: this.rpID,
+      userID: user.id,
+      userName: user.alias,
+      timeout: 60000,
+      attestationType: 'indirect',
+      authenticatorSelection: {
+        authenticatorAttachment: 'platform',
+        requireResidentKey: false,
+        userVerification: 'required'
+      }
+    };
+
+    const options = generateAttestationOptions(opts);
+
+    await this.userService.updateUser({
+      data: {
+        authChallenge: options.challenge
+      },
+      where: {
+        id: user.id
+      }
+    });
+
+    return options;
+  }
+
+  public async verifyAttestation(
+    deviceName: string,
+    credential: AttestationCredentialJSON
+  ): Promise<AuthDeviceDto> {
+    const user = this.request.user;
+    const expectedChallenge = user.authChallenge;
+
+    let verification: VerifiedAttestation;
+    try {
+      const opts: VerifyAttestationResponseOpts = {
+        credential,
+        expectedChallenge,
+        expectedOrigin: this.expectedOrigin,
+        expectedRPID: this.rpID
+      };
+      verification = await verifyAttestationResponse(opts);
+    } catch (error) {
+      console.error(error);
+      throw new InternalServerErrorException(error.message);
+    }
+
+    const { verified, attestationInfo } = verification;
+
+    const devices = await this.deviceService.authDevices({
+      where: { userId: user.id }
+    });
+    if (verified && attestationInfo) {
+      const { credentialPublicKey, credentialID, counter } = attestationInfo;
+
+      let existingDevice = devices.find(
+        (device) => device.credentialId === credentialID
+      );
+
+      if (!existingDevice) {
+        /**
+         * Add the returned device to the user's list of devices
+         */
+        existingDevice = await this.deviceService.createAuthDevice({
+          credentialPublicKey,
+          credentialId: credentialID,
+          counter,
+          User: { connect: { id: user.id } }
+        });
+      }
+
+      return {
+        createdAt: existingDevice.createdAt.toISOString(),
+        id: existingDevice.id
+      };
+    }
+
+    throw new InternalServerErrorException('An unknown error occurred');
+  }
+
+  public async generateAssertionOptions(deviceId: string) {
+    const device = await this.deviceService.authDevice({ id: deviceId });
+
+    if (!device) {
+      throw new Error('Device not found');
+    }
+
+    const opts: GenerateAssertionOptionsOpts = {
+      timeout: 60000,
+      allowCredentials: [
+        {
+          id: device.credentialId,
+          type: 'public-key',
+          transports: ['internal']
+        }
+      ],
+      userVerification: 'preferred',
+      rpID: this.rpID
+    };
+
+    const options = generateAssertionOptions(opts);
+
+    await this.userService.updateUser({
+      data: {
+        authChallenge: options.challenge
+      },
+      where: {
+        id: device.userId
+      }
+    });
+
+    return options;
+  }
+
+  public async verifyAssertion(
+    deviceId: string,
+    credential: AssertionCredentialJSON
+  ) {
+    const device = await this.deviceService.authDevice({ id: deviceId });
+
+    if (!device) {
+      throw new Error('Device not found');
+    }
+
+    const user = await this.userService.user({ id: device.userId });
+
+    let verification: VerifiedAssertion;
+    try {
+      const opts: VerifyAssertionResponseOpts = {
+        credential,
+        expectedChallenge: `${user.authChallenge}`,
+        expectedOrigin: this.expectedOrigin,
+        expectedRPID: this.rpID,
+        authenticator: {
+          credentialID: device.credentialId,
+          credentialPublicKey: device.credentialPublicKey,
+          counter: device.counter
+        }
+      };
+      verification = verifyAssertionResponse(opts);
+    } catch (error) {
+      console.error(error);
+      throw new InternalServerErrorException({ error: error.message });
+    }
+
+    const { verified, assertionInfo } = verification;
+
+    if (verified) {
+      device.counter = assertionInfo.newCounter;
+
+      await this.deviceService.updateAuthDevice({
+        data: device,
+        where: { id: device.id }
+      });
+
+      return this.jwtService.sign({
+        id: user.id
+      });
+    }
+
+    throw new Error();
+  }
+}

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

@@ -1,5 +1,5 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
-import { Controller, Inject, Param, Post, UseGuards } from '@nestjs/common';
+import { RequestWithUser } from '@ghostfolio/common/types';
+import { Controller, Inject, Post, UseGuards } from '@nestjs/common';
 import { REQUEST } from '@nestjs/core';
 import { AuthGuard } from '@nestjs/passport';
 

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

@@ -1,9 +1,6 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
-import {
-  baseCurrency,
-  benchmarks,
-  isApiTokenAuthorized
-} from '@ghostfolio/helper';
+import { baseCurrency, benchmarks } from '@ghostfolio/common/config';
+import { isApiTokenAuthorized } from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Body,
   Controller,
@@ -40,7 +37,9 @@ export class ExperimentalController {
       );
     }
 
-    return benchmarks;
+    return benchmarks.map(({ symbol }) => {
+      return symbol;
+    });
   }
 
   @Get('benchmarks/:symbol')

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

@@ -3,11 +3,11 @@ import { DataProviderService } from '@ghostfolio/api/services/data-provider.serv
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
 import { RulesService } from '@ghostfolio/api/services/rules.service';
+import { OrderWithAccount } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
 import { Currency, Type } from '@prisma/client';
 import { parseISO } from 'date-fns';
 
-import { OrderWithPlatform } from '../order/interfaces/order-with-platform.type';
 import { CreateOrderDto } from './create-order.dto';
 import { Data } from './interfaces/data.interface';
 
@@ -33,7 +33,7 @@ export class ExperimentalService {
     aDate: Date,
     aBaseCurrency: Currency
   ): Promise<Data> {
-    const ordersWithPlatform: OrderWithPlatform[] = aOrders.map((order) => {
+    const ordersWithPlatform: OrderWithAccount[] = aOrders.map((order) => {
       return {
         ...order,
         accountId: undefined,
@@ -44,6 +44,7 @@ export class ExperimentalService {
         fee: 0,
         id: undefined,
         platformId: undefined,
+        symbolProfileId: undefined,
         type: Type.BUY,
         updatedAt: undefined,
         userId: undefined

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

@@ -1,7 +1,7 @@
+import { InfoItem } from '@ghostfolio/common/interfaces';
 import { Controller, Get } from '@nestjs/common';
 
 import { InfoService } from './info.service';
-import { InfoItem } from './interfaces/info-item.interface';
 
 @Controller('info')
 export class InfoController {

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

@@ -1,12 +1,11 @@
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
-import { permissions } from '@ghostfolio/helper';
+import { InfoItem } from '@ghostfolio/common/interfaces';
+import { permissions } from '@ghostfolio/common/permissions';
 import { Injectable } from '@nestjs/common';
 import { JwtService } from '@nestjs/jwt';
 import { Currency } from '@prisma/client';
 
-import { InfoItem } from './interfaces/info-item.interface';
-
 @Injectable()
 export class InfoService {
   private static DEMO_USER_ID = '9b112b4d-3b7d-4bad-9bdd-3b0f7b4dac2f';

apps/api/src/app/interfaces/user-with-settings.ts

@@ -1,6 +0,0 @@
-import { Account, Settings, User } from '@prisma/client';
-
-export type UserWithSettings = User & {
-  Account: Account[];
-  Settings: Settings;
-};

apps/api/src/app/order/create-order.dto.ts

@@ -17,10 +17,6 @@ export class CreateOrderDto {
   @IsNumber()
   fee: number;
 
-  @IsString()
-  @ValidateIf((object, value) => value !== null)
-  platformId: string | null;
-
   @IsNumber()
   quantity: number;
 

apps/api/src/app/order/interfaces/order-with-platform.type.ts

@@ -1,3 +0,0 @@
-import { Order, Platform } from '@prisma/client';
-
-export type OrderWithPlatform = Order & { Platform?: Platform };

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

@@ -1,7 +1,11 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
 import { nullifyValuesInObjects } from '@ghostfolio/api/helper/object.helper';
 import { ImpersonationService } from '@ghostfolio/api/services/impersonation.service';
-import { getPermissions, hasPermission, permissions } from '@ghostfolio/helper';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Body,
   Controller,
@@ -71,7 +75,11 @@ export class OrderController {
 
     let orders = await this.orderService.orders({
       include: {
-        Platform: true
+        Account: {
+          include: {
+            Platform: true
+          }
+        }
       },
       orderBy: { date: 'desc' },
       where: { userId: impersonationUserId || this.request.user.id }
@@ -121,41 +129,33 @@ export class OrderController {
     const accountId = data.accountId;
     delete data.accountId;
 
-    if (data.platformId) {
-      const platformId = data.platformId;
-      delete data.platformId;
-
-      return this.orderService.createOrder(
-        {
-          ...data,
-          date,
-          Account: {
-            connect: {
-              id_userId: { id: accountId, userId: this.request.user.id }
-            }
-          },
-          Platform: { connect: { id: platformId } },
-          User: { connect: { id: this.request.user.id } }
+    return this.orderService.createOrder(
+      {
+        ...data,
+        Account: {
+          connect: {
+            id_userId: { id: accountId, userId: this.request.user.id }
+          }
         },
-        this.request.user.id
-      );
-    } else {
-      delete data.platformId;
-
-      return this.orderService.createOrder(
-        {
-          ...data,
-          date,
-          Account: {
-            connect: {
-              id_userId: { id: accountId, userId: this.request.user.id }
+        date,
+        SymbolProfile: {
+          connectOrCreate: {
+            where: {
+              dataSource_symbol: {
+                dataSource: data.dataSource,
+                symbol: data.symbol
+              }
+            },
+            create: {
+              dataSource: data.dataSource,
+              symbol: data.symbol
             }
-          },
-          User: { connect: { id: this.request.user.id } }
+          }
         },
-        this.request.user.id
-      );
-    }
+        User: { connect: { id: this.request.user.id } }
+      },
+      this.request.user.id
+    );
   }
 
   @Put(':id')
@@ -180,65 +180,38 @@ export class OrderController {
       }
     });
 
+    if (!originalOrder) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
     const date = parseISO(data.date);
 
     const accountId = data.accountId;
     delete data.accountId;
 
-    if (data.platformId) {
-      const platformId = data.platformId;
-      delete data.platformId;
-
-      return this.orderService.updateOrder(
-        {
-          data: {
-            ...data,
-            date,
-            Account: {
-              connect: {
-                id_userId: { id: accountId, userId: this.request.user.id }
-              }
-            },
-            Platform: { connect: { id: platformId } },
-            User: { connect: { id: this.request.user.id } }
-          },
-          where: {
-            id_userId: {
-              id,
-              userId: this.request.user.id
+    return this.orderService.updateOrder(
+      {
+        data: {
+          ...data,
+          date,
+          Account: {
+            connect: {
+              id_userId: { id: accountId, userId: this.request.user.id }
             }
-          }
-        },
-        this.request.user.id
-      );
-    } else {
-      // platformId is null, remove it
-      delete data.platformId;
-
-      return this.orderService.updateOrder(
-        {
-          data: {
-            ...data,
-            date,
-            Account: {
-              connect: {
-                id_userId: { id: accountId, userId: this.request.user.id }
-              }
-            },
-            Platform: originalOrder.platformId
-              ? { disconnect: true }
-              : undefined,
-            User: { connect: { id: this.request.user.id } }
           },
-          where: {
-            id_userId: {
-              id,
-              userId: this.request.user.id
-            }
-          }
+          User: { connect: { id: this.request.user.id } }
         },
-        this.request.user.id
-      );
-    }
+        where: {
+          id_userId: {
+            id,
+            userId: this.request.user.id
+          }
+        }
+      },
+      this.request.user.id
+    );
   }
 }

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

@@ -1,11 +1,11 @@
 import { DataGatheringService } from '@ghostfolio/api/services/data-gathering.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
+import { OrderWithAccount } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
-import { Order, Prisma } from '@prisma/client';
+import { DataSource, Order, Prisma } from '@prisma/client';
 
 import { CacheService } from '../cache/cache.service';
 import { RedisCacheService } from '../redis-cache/redis-cache.service';
-import { OrderWithPlatform } from './interfaces/order-with-platform.type';
 
 @Injectable()
 export class OrderService {
@@ -31,7 +31,7 @@ export class OrderService {
     cursor?: Prisma.OrderWhereUniqueInput;
     where?: Prisma.OrderWhereInput;
     orderBy?: Prisma.OrderOrderByInput;
-  }): Promise<OrderWithPlatform[]> {
+  }): Promise<OrderWithAccount[]> {
     const { include, skip, take, cursor, where, orderBy } = params;
 
     return this.prisma.order.findMany({
@@ -53,6 +53,7 @@ export class OrderService {
     // Gather symbol data of order in the background
     this.dataGatheringService.gatherSymbols([
       {
+        dataSource: data.dataSource,
         date: <Date>data.date,
         symbol: data.symbol
       }
@@ -90,6 +91,7 @@ export class OrderService {
     // Gather symbol data of order in the background
     this.dataGatheringService.gatherSymbols([
       {
+        dataSource: <DataSource>data.dataSource,
         date: <Date>data.date,
         symbol: <string>data.symbol
       }

apps/api/src/app/order/update-order.dto.ts

@@ -17,10 +17,6 @@ export class UpdateOrderDto {
   @IsNumber()
   fee: number;
 
-  @IsString()
-  @ValidateIf((object, value) => value !== null)
-  platformId: string | null;
-
   @IsString()
   id: string;
 

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

@@ -4,7 +4,19 @@ import {
 } from '@ghostfolio/api/helper/object.helper';
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { ImpersonationService } from '@ghostfolio/api/services/impersonation.service';
-import { getPermissions, hasPermission, permissions } from '@ghostfolio/helper';
+import {
+  PortfolioItem,
+  PortfolioOverview,
+  PortfolioPerformance,
+  PortfolioPosition,
+  PortfolioReport
+} from '@ghostfolio/common/interfaces';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Controller,
   Get,
@@ -21,16 +33,10 @@ import { AuthGuard } from '@nestjs/passport';
 import { Response } from 'express';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';
 
-import { RequestWithUser } from '../interfaces/request-with-user.type';
-import { PortfolioItem } from './interfaces/portfolio-item.interface';
-import { PortfolioOverview } from './interfaces/portfolio-overview.interface';
-import { PortfolioPerformance } from './interfaces/portfolio-performance.interface';
 import {
   HistoricalDataItem,
   PortfolioPositionDetail
 } from './interfaces/portfolio-position-detail.interface';
-import { PortfolioPosition } from './interfaces/portfolio-position.interface';
-import { PortfolioReport } from './interfaces/portfolio-report.interface';
 import { PortfolioService } from './portfolio.service';
 
 @Controller('portfolio')
@@ -185,11 +191,11 @@ export class PortfolioController {
         portfolioPosition.investment =
           portfolioPosition.investment / totalInvestment;
 
-        for (const [platform, { current, original }] of Object.entries(
-          portfolioPosition.platforms
+        for (const [account, { current, original }] of Object.entries(
+          portfolioPosition.accounts
         )) {
-          portfolioPosition.platforms[platform].current = current / totalValue;
-          portfolioPosition.platforms[platform].original =
+          portfolioPosition.accounts[account].current = current / totalValue;
+          portfolioPosition.accounts[account].original =
             original / totalInvestment;
         }
 
@@ -309,18 +315,6 @@ export class PortfolioController {
       impersonationUserId || this.request.user.id
     );
 
-    let report = await portfolio.getReport();
-
-    if (
-      impersonationId &&
-      !hasPermission(
-        getPermissions(this.request.user.role),
-        permissions.readForeignPortfolio
-      )
-    ) {
-      // TODO: Filter out absolute numbers
-    }
-
-    return report;
+    return await portfolio.getReport();
   }
 }

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

@@ -1,12 +1,17 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
 import { Portfolio } from '@ghostfolio/api/models/portfolio';
 import { DataProviderService } from '@ghostfolio/api/services/data-provider.service';
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
 import { ImpersonationService } from '@ghostfolio/api/services/impersonation.service';
 import { IOrder } from '@ghostfolio/api/services/interfaces/interfaces';
 import { RulesService } from '@ghostfolio/api/services/rules.service';
+import {
+  PortfolioItem,
+  PortfolioOverview
+} from '@ghostfolio/common/interfaces';
+import { DateRange, RequestWithUser } from '@ghostfolio/common/types';
 import { Inject, Injectable } from '@nestjs/common';
 import { REQUEST } from '@nestjs/core';
+import { DataSource } from '@prisma/client';
 import {
   add,
   format,
@@ -15,6 +20,7 @@ import {
   getYear,
   isAfter,
   isSameDay,
+  parse,
   parseISO,
   setDate,
   setMonth,
@@ -26,9 +32,6 @@ import * as roundTo from 'round-to';
 import { OrderService } from '../order/order.service';
 import { RedisCacheService } from '../redis-cache/redis-cache.service';
 import { UserService } from '../user/user.service';
-import { DateRange } from './interfaces/date-range.type';
-import { PortfolioItem } from './interfaces/portfolio-item.interface';
-import { PortfolioOverview } from './interfaces/portfolio-overview.interface';
 import {
   HistoricalDataItem,
   PortfolioPositionDetail
@@ -73,7 +76,8 @@ export class PortfolioService {
       // Get portfolio from database
       const orders = await this.orderService.orders({
         include: {
-          Platform: true
+          Account: true,
+          SymbolProfile: true
         },
         orderBy: { date: 'asc' },
         where: { userId: aUserId }
@@ -157,8 +161,8 @@ export class PortfolioService {
         return {
           date: format(parseISO(portfolioItem.date), 'yyyy-MM-dd'),
           grossPerformancePercent: portfolioItem.grossPerformancePercent,
-          marketPrice: portfolioItem.value || null,
-          value: portfolioItem.value || null
+          marketPrice: portfolioItem.value ?? null,
+          value: portfolioItem.value - portfolioItem.investment ?? null
         };
       });
   }
@@ -213,6 +217,8 @@ export class PortfolioService {
         transactionCount
       } = portfolio.getPositions(new Date())[aSymbol];
 
+      const orders = portfolio.getOrders(aSymbol);
+
       const historicalData = await this.dataProviderService.getHistorical(
         [aSymbol],
         'day',
@@ -225,6 +231,7 @@ export class PortfolioService {
       }
 
       const historicalDataArray: HistoricalDataItem[] = [];
+      let currentAveragePrice: number;
       let maxPrice = marketPrice;
       let minPrice = marketPrice;
 
@@ -232,9 +239,24 @@ export class PortfolioService {
         for (const [date, { marketPrice }] of Object.entries(
           historicalData[aSymbol]
         )) {
+          const currentDate = parse(date, 'yyyy-MM-dd', new Date());
+          if (
+            isSameDay(currentDate, parseISO(orders[0]?.getDate())) ||
+            isAfter(currentDate, parseISO(orders[0]?.getDate()))
+          ) {
+            // Get snapshot of first day of month
+            const snapshot = portfolio.get(setDate(currentDate, 1))[0]
+              .positions[aSymbol];
+            orders.shift();
+
+            if (snapshot?.averagePrice) {
+              currentAveragePrice = snapshot?.averagePrice;
+            }
+          }
+
           historicalDataArray.push({
-            averagePrice,
             date,
+            averagePrice: currentAveragePrice,
             value: marketPrice
           });
 
@@ -288,7 +310,7 @@ export class PortfolioService {
 
       if (isEmpty(historicalData)) {
         historicalData = await this.dataProviderService.getHistoricalRaw(
-          [aSymbol],
+          [{ dataSource: DataSource.YAHOO, symbol: aSymbol }],
           portfolio.getMinDate(),
           new Date()
         );

apps/api/src/app/symbol/interfaces/lookup-item.interface.ts

@@ -1,4 +1,7 @@
+import { DataSource } from '@prisma/client';
+
 export interface LookupItem {
+  dataSource: DataSource;
   name: string;
   symbol: string;
 }

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

@@ -1,4 +1,4 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Controller,
   Get,
@@ -28,9 +28,12 @@ export class SymbolController {
    */
   @Get('lookup')
   @UseGuards(AuthGuard('jwt'))
-  public async lookupSymbol(@Query() { query }): Promise<LookupItem[]> {
+  public async lookupSymbol(
+    @Query() { query = '' }
+  ): Promise<{ items: LookupItem[] }> {
     try {
-      return this.symbolService.lookup(query);
+      const encodedQuery = encodeURIComponent(query.toLowerCase());
+      return this.symbolService.lookup(encodedQuery);
     } catch {
       throw new HttpException(
         getReasonPhrase(StatusCodes.INTERNAL_SERVER_ERROR),

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

@@ -1,10 +1,8 @@
-import { DataGatheringService } from '@ghostfolio/api/services/data-gathering.service';
 import { DataProviderService } from '@ghostfolio/api/services/data-provider.service';
 import { GhostfolioScraperApiService } from '@ghostfolio/api/services/data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service';
 import { convertFromYahooSymbol } from '@ghostfolio/api/services/data-provider/yahoo-finance/yahoo-finance.service';
 import { Injectable } from '@nestjs/common';
-import { Currency } from '@prisma/client';
-import * as bent from 'bent';
+import { Currency, DataSource } from '@prisma/client';
 
 import { LookupItem } from './interfaces/lookup-item.interface';
 import { SymbolItem } from './interfaces/symbol-item.interface';
@@ -27,62 +25,30 @@ export class SymbolService {
     };
   }
 
-  public async lookup(aQuery = ''): Promise<LookupItem[]> {
-    const query = aQuery.toLowerCase();
-    const results: LookupItem[] = [];
+  public async lookup(aQuery: string): Promise<{ items: LookupItem[] }> {
+    const results: { items: LookupItem[] } = { items: [] };
 
-    if (!query) {
+    if (!aQuery) {
       return results;
     }
 
-    const get = bent(
-      `https://query1.finance.yahoo.com/v1/finance/search?q=${query}&lang=en-US&region=US&quotesCount=8&newsCount=0&enableFuzzyQuery=false&quotesQueryId=tss_match_phrase_query&multiQuoteQueryId=multi_quote_single_token_query&newsQueryId=news_cie_vespa&enableCb=true&enableNavLinks=false&enableEnhancedTrivialQuery=true`,
-      'GET',
-      'json',
-      200
-    );
-
-    // Add custom symbols
-    const scraperConfigurations = await this.ghostfolioScraperApiService.getScraperConfigurations();
-    scraperConfigurations.forEach((scraperConfiguration) => {
-      if (scraperConfiguration.name.toLowerCase().startsWith(query)) {
-        results.push({
-          name: scraperConfiguration.name,
-          symbol: scraperConfiguration.symbol
-        });
-      }
-    });
-
     try {
-      const { quotes } = await get();
+      const { items } = await this.dataProviderService.search(aQuery);
+      results.items = items;
 
-      const searchResult = quotes
-        .filter(({ isYahooFinance }) => {
-          return isYahooFinance;
-        })
-        .filter(({ quoteType }) => {
-          return (
-            quoteType === 'CRYPTOCURRENCY' ||
-            quoteType === 'EQUITY' ||
-            quoteType === 'ETF'
-          );
-        })
-        .filter(({ quoteType, symbol }) => {
-          if (quoteType === 'CRYPTOCURRENCY') {
-            // Only allow cryptocurrencies in USD
-            return symbol.includes('USD');
-          }
+      // Add custom symbols
+      const scraperConfigurations = await this.ghostfolioScraperApiService.getScraperConfigurations();
+      scraperConfigurations.forEach((scraperConfiguration) => {
+        if (scraperConfiguration.name.toLowerCase().startsWith(aQuery)) {
+          results.items.push({
+            dataSource: DataSource.GHOSTFOLIO,
+            name: scraperConfiguration.name,
+            symbol: scraperConfiguration.symbol
+          });
+        }
+      });
 
-          return true;
-        })
-        .map(({ longname, shortname, symbol }) => {
-          return {
-            name: longname || shortname,
-            symbol: convertFromYahooSymbol(symbol)
-          };
-        });
-
-      return results.concat(searchResult);
+      return results;
     } catch (error) {
       console.error(error);
 

apps/api/src/app/user/interfaces/user.interface.ts

@@ -1,21 +0,0 @@
-import { Account, Currency } from '@prisma/client';
-
-import { Access } from './access.interface';
-
-export interface User {
-  access: Access[];
-  accounts: Account[];
-  alias?: string;
-  id: string;
-  permissions: string[];
-  settings: UserSettings;
-  subscription: {
-    expiresAt: Date;
-    type: 'Trial';
-  };
-}
-
-export interface UserSettings {
-  baseCurrency: Currency;
-  locale: string;
-}

apps/api/src/app/user/update-user-settings.dto.ts

@@ -1,7 +1,10 @@
-import { Currency } from '@prisma/client';
+import { Currency, ViewMode } from '@prisma/client';
 import { IsString } from 'class-validator';
 
 export class UpdateUserSettingsDto {
   @IsString()
-  currency: Currency;
+  baseCurrency: Currency;
+
+  @IsString()
+  viewMode: ViewMode;
 }

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

@@ -1,8 +1,14 @@
-import { RequestWithUser } from '@ghostfolio/api/app/interfaces/request-with-user.type';
-import { getPermissions, hasPermission, permissions } from '@ghostfolio/helper';
+import { User } from '@ghostfolio/common/interfaces';
+import {
+  getPermissions,
+  hasPermission,
+  permissions
+} from '@ghostfolio/common/permissions';
+import { RequestWithUser } from '@ghostfolio/common/types';
 import {
   Body,
   Controller,
+  Delete,
   Get,
   HttpException,
   Inject,
@@ -15,10 +21,10 @@ import { REQUEST } from '@nestjs/core';
 import { JwtService } from '@nestjs/jwt';
 import { AuthGuard } from '@nestjs/passport';
 import { Provider } from '@prisma/client';
+import { User as UserModel } from '@prisma/client';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';
 
 import { UserItem } from './interfaces/user-item.interface';
-import { User } from './interfaces/user.interface';
 import { UpdateUserSettingsDto } from './update-user-settings.dto';
 import { UserService } from './user.service';
 
@@ -30,6 +36,27 @@ export class UserController {
     private readonly userService: UserService
   ) {}
 
+  @Delete(':id')
+  @UseGuards(AuthGuard('jwt'))
+  public async deleteUser(@Param('id') id: string): Promise<UserModel> {
+    if (
+      !hasPermission(
+        getPermissions(this.request.user.role),
+        permissions.deleteUser
+      ) ||
+      id === this.request.user.id
+    ) {
+      throw new HttpException(
+        getReasonPhrase(StatusCodes.FORBIDDEN),
+        StatusCodes.FORBIDDEN
+      );
+    }
+
+    return this.userService.deleteUser({
+      id
+    });
+  }
+
   @Get()
   @UseGuards(AuthGuard('jwt'))
   public async getUser(@Param('id') id: string): Promise<User> {
@@ -66,8 +93,9 @@ export class UserController {
     }
 
     return await this.userService.updateUserSettings({
-      currency: data.currency,
-      userId: this.request.user.id
+      currency: data.baseCurrency,
+      userId: this.request.user.id,
+      viewMode: data.viewMode
     });
   }
 }

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

@@ -1,17 +1,13 @@
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { PrismaService } from '@ghostfolio/api/services/prisma.service';
-import {
-  getPermissions,
-  locale,
-  permissions,
-  resetHours
-} from '@ghostfolio/helper';
+import { locale } from '@ghostfolio/common/config';
+import { resetHours } from '@ghostfolio/common/helper';
+import { User as IUser, UserWithSettings } from '@ghostfolio/common/interfaces';
+import { getPermissions, permissions } from '@ghostfolio/common/permissions';
+import { SubscriptionType } from '@ghostfolio/common/types/subscription.type';
 import { Injectable } from '@nestjs/common';
-import { Currency, Prisma, Provider, User } from '@prisma/client';
-import { add } from 'date-fns';
-
-import { UserWithSettings } from '../interfaces/user-with-settings';
-import { User as IUser } from './interfaces/user.interface';
+import { Currency, Prisma, Provider, User, ViewMode } from '@prisma/client';
+import { add, isBefore } from 'date-fns';
 
 const crypto = require('crypto');
 
@@ -29,7 +25,8 @@ export class UserService {
     alias,
     id,
     role,
-    Settings
+    Settings,
+    subscription
   }: UserWithSettings): Promise<IUser> {
     const access = await this.prisma.access.findMany({
       include: {
@@ -48,6 +45,7 @@ export class UserService {
     return {
       alias,
       id,
+      subscription,
       access: access.map((accessItem) => {
         return {
           alias: accessItem.User.alias,
@@ -57,12 +55,9 @@ export class UserService {
       accounts: Account,
       permissions: currentPermissions,
       settings: {
-        baseCurrency: Settings?.currency || UserService.DEFAULT_CURRENCY,
-        locale
-      },
-      subscription: {
-        expiresAt: resetHours(add(new Date(), { days: 7 })),
-        type: 'Trial'
+        locale,
+        baseCurrency: Settings?.currency ?? UserService.DEFAULT_CURRENCY,
+        viewMode: Settings?.viewMode ?? ViewMode.DEFAULT
       }
     };
   }
@@ -70,25 +65,49 @@ export class UserService {
   public async user(
     userWhereUniqueInput: Prisma.UserWhereUniqueInput
   ): Promise<UserWithSettings | null> {
-    const user = await this.prisma.user.findUnique({
-      include: { Account: true, Settings: true },
+    const userFromDatabase = await this.prisma.user.findUnique({
+      include: { Account: true, Settings: true, Subscription: true },
       where: userWhereUniqueInput
     });
 
-    if (user?.Settings) {
-      if (!user.Settings.currency) {
+    const user: UserWithSettings = userFromDatabase;
+
+    if (userFromDatabase?.Settings) {
+      if (!userFromDatabase.Settings.currency) {
         // Set default currency if needed
-        user.Settings.currency = UserService.DEFAULT_CURRENCY;
+        userFromDatabase.Settings.currency = UserService.DEFAULT_CURRENCY;
       }
-    } else if (user) {
+    } else if (userFromDatabase) {
       // Set default settings if needed
-      user.Settings = {
+      userFromDatabase.Settings = {
         currency: UserService.DEFAULT_CURRENCY,
         updatedAt: new Date(),
-        userId: user?.id
+        userId: userFromDatabase?.id,
+        viewMode: ViewMode.DEFAULT
       };
     }
 
+    if (this.configurationService.get('ENABLE_FEATURE_SUBSCRIPTION')) {
+      if (userFromDatabase?.Subscription?.length > 0) {
+        const latestSubscription = userFromDatabase.Subscription.reduce(
+          (a, b) => {
+            return new Date(a.expiresAt) > new Date(b.expiresAt) ? a : b;
+          }
+        );
+
+        user.subscription = {
+          expiresAt: latestSubscription.expiresAt,
+          type: isBefore(new Date(), latestSubscription.expiresAt)
+            ? SubscriptionType.Premium
+            : SubscriptionType.Basic
+        };
+      } else {
+        user.subscription = {
+          type: SubscriptionType.Basic
+        };
+      }
+    }
+
     return user;
   }
 
@@ -163,6 +182,28 @@ export class UserService {
   }
 
   public async deleteUser(where: Prisma.UserWhereUniqueInput): Promise<User> {
+    await this.prisma.access.deleteMany({
+      where: { OR: [{ granteeUserId: where.id }, { userId: where.id }] }
+    });
+
+    await this.prisma.account.deleteMany({
+      where: { userId: where.id }
+    });
+
+    await this.prisma.analytics.delete({
+      where: { userId: where.id }
+    });
+
+    await this.prisma.order.deleteMany({
+      where: { userId: where.id }
+    });
+
+    try {
+      await this.prisma.settings.delete({
+        where: { userId: where.id }
+      });
+    } catch {}
+
     return this.prisma.user.delete({
       where
     });
@@ -170,10 +211,12 @@ export class UserService {
 
   public async updateUserSettings({
     currency,
-    userId
+    userId,
+    viewMode
   }: {
-    currency: Currency;
+    currency?: Currency;
     userId: string;
+    viewMode?: ViewMode;
   }) {
     await this.prisma.settings.upsert({
       create: {
@@ -182,10 +225,12 @@ export class UserService {
           connect: {
             id: userId
           }
-        }
+        },
+        viewMode
       },
       update: {
-        currency
+        currency,
+        viewMode
       },
       where: {
         userId: userId

apps/api/src/models/interfaces/portfolio.interface.ts

@@ -1,7 +1,4 @@
-import {
-  PortfolioItem,
-  Position
-} from '@ghostfolio/api/app/portfolio/interfaces/portfolio-item.interface';
+import { PortfolioItem, Position } from '@ghostfolio/common/interfaces';
 
 import { Order } from '../order';
 

apps/api/src/models/interfaces/rule.interface.ts

@@ -1,4 +1,4 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 
 import { EvaluationResult } from './evaluation-result.interface';
 

apps/api/src/models/order.ts

@@ -1,35 +1,41 @@
-import { Currency, Platform } from '@prisma/client';
+import { Account, Currency, Platform, SymbolProfile } from '@prisma/client';
 import { v4 as uuidv4 } from 'uuid';
 
 import { IOrder } from '../services/interfaces/interfaces';
 import { OrderType } from './order-type';
 
 export class Order {
+  private account: Account;
   private currency: Currency;
   private fee: number;
   private date: string;
   private id: string;
   private quantity: number;
-  private platform: Platform;
   private symbol: string;
+  private symbolProfile: SymbolProfile;
   private total: number;
   private type: OrderType;
   private unitPrice: number;
 
   public constructor(data: IOrder) {
+    this.account = data.account;
     this.currency = data.currency;
     this.fee = data.fee;
     this.date = data.date;
     this.id = data.id || uuidv4();
-    this.platform = data.platform;
     this.quantity = data.quantity;
     this.symbol = data.symbol;
+    this.symbolProfile = data.symbolProfile;
     this.type = data.type;
     this.unitPrice = data.unitPrice;
 
     this.total = this.quantity * data.unitPrice;
   }
 
+  public getAccount() {
+    return this.account;
+  }
+
   public getCurrency() {
     return this.currency;
   }
@@ -46,10 +52,6 @@ export class Order {
     return this.id;
   }
 
-  public getPlatform() {
-    return this.platform;
-  }
-
   public getQuantity() {
     return this.quantity;
   }
@@ -58,6 +60,10 @@ export class Order {
     return this.symbol;
   }
 
+  getSymbolProfile() {
+    return this.symbolProfile;
+  }
+
   public getTotal() {
     return this.total;
   }

apps/api/src/models/portfolio.spec.ts

@@ -1,65 +1,102 @@
-import { baseCurrency, getUtc, getYesterday } from '@ghostfolio/helper';
-import { Test } from '@nestjs/testing';
-import { Currency, Role, Type } from '@prisma/client';
+import { UNKNOWN_KEY, baseCurrency } from '@ghostfolio/common/config';
+import { getUtc, getYesterday } from '@ghostfolio/common/helper';
+import {
+  AccountType,
+  Currency,
+  DataSource,
+  Role,
+  Type,
+  ViewMode
+} from '@prisma/client';
+import { format } from 'date-fns';
 
-import { ConfigurationService } from '../services/configuration.service';
 import { DataProviderService } from '../services/data-provider.service';
-import { AlphaVantageService } from '../services/data-provider/alpha-vantage/alpha-vantage.service';
-import { GhostfolioScraperApiService } from '../services/data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service';
-import { RakutenRapidApiService } from '../services/data-provider/rakuten-rapid-api/rakuten-rapid-api.service';
-import { YahooFinanceService } from '../services/data-provider/yahoo-finance/yahoo-finance.service';
 import { ExchangeRateDataService } from '../services/exchange-rate-data.service';
 import { MarketState } from '../services/interfaces/interfaces';
-import { PrismaService } from '../services/prisma.service';
 import { RulesService } from '../services/rules.service';
 import { Portfolio } from './portfolio';
 
+jest.mock('../services/data-provider.service', () => {
+  return {
+    DataProviderService: jest.fn().mockImplementation(() => {
+      const today = format(new Date(), 'yyyy-MM-dd');
+      const yesterday = format(getYesterday(), 'yyyy-MM-dd');
+
+      return {
+        get: () => {
+          return Promise.resolve({
+            BTCUSD: {
+              currency: Currency.USD,
+              dataSource: DataSource.YAHOO,
+              exchange: UNKNOWN_KEY,
+              marketPrice: 57973.008,
+              marketState: MarketState.open,
+              name: 'Bitcoin USD',
+              type: 'Cryptocurrency'
+            },
+            ETHUSD: {
+              currency: Currency.USD,
+              dataSource: DataSource.YAHOO,
+              exchange: UNKNOWN_KEY,
+              marketPrice: 3915.337,
+              marketState: MarketState.open,
+              name: 'Ethereum USD',
+              type: 'Cryptocurrency'
+            }
+          });
+        },
+        getHistorical: () => {
+          return Promise.resolve({
+            BTCUSD: {
+              [yesterday]: 56710.122,
+              [today]: 57973.008
+            },
+            ETHUSD: {
+              [yesterday]: 3641.984,
+              [today]: 3915.337
+            }
+          });
+        }
+      };
+    })
+  };
+});
+
+jest.mock('../services/exchange-rate-data.service', () => {
+  return {
+    ExchangeRateDataService: jest.fn().mockImplementation(() => {
+      return {
+        initialize: () => Promise.resolve(),
+        toCurrency: (value: number) => value
+      };
+    })
+  };
+});
+
+jest.mock('../services/data-provider.service');
+jest.mock('../services/exchange-rate-data.service');
+jest.mock('../services/rules.service');
+
 const DEFAULT_ACCOUNT_ID = '693a834b-eb89-42c9-ae47-35196c25d269';
 const USER_ID = 'ca6ce867-5d31-495a-bce9-5942bbca9237';
 
 describe('Portfolio', () => {
-  let alphaVantageService: AlphaVantageService;
-  let configurationService: ConfigurationService;
   let dataProviderService: DataProviderService;
   let exchangeRateDataService: ExchangeRateDataService;
-  let ghostfolioScraperApiService: GhostfolioScraperApiService;
   let portfolio: Portfolio;
-  let prismaService: PrismaService;
-  let rakutenRapidApiService: RakutenRapidApiService;
   let rulesService: RulesService;
-  let yahooFinanceService: YahooFinanceService;
 
   beforeAll(async () => {
-    const app = await Test.createTestingModule({
-      imports: [],
-      providers: [
-        AlphaVantageService,
-        ConfigurationService,
-        DataProviderService,
-        ExchangeRateDataService,
-        GhostfolioScraperApiService,
-        PrismaService,
-        RakutenRapidApiService,
-        RulesService,
-        YahooFinanceService
-      ]
-    }).compile();
-
-    alphaVantageService = app.get<AlphaVantageService>(AlphaVantageService);
-    configurationService = app.get<ConfigurationService>(ConfigurationService);
-    dataProviderService = app.get<DataProviderService>(DataProviderService);
-    exchangeRateDataService = app.get<ExchangeRateDataService>(
-      ExchangeRateDataService
+    dataProviderService = new DataProviderService(
+      null,
+      null,
+      null,
+      null,
+      null,
+      null
     );
-    ghostfolioScraperApiService = app.get<GhostfolioScraperApiService>(
-      GhostfolioScraperApiService
-    );
-    prismaService = app.get<PrismaService>(PrismaService);
-    rakutenRapidApiService = app.get<RakutenRapidApiService>(
-      RakutenRapidApiService
-    );
-    rulesService = app.get<RulesService>(RulesService);
-    yahooFinanceService = app.get<YahooFinanceService>(YahooFinanceService);
+    exchangeRateDataService = new ExchangeRateDataService(null);
+    rulesService = new RulesService();
 
     await exchangeRateDataService.initialize();
 
@@ -70,7 +107,20 @@ describe('Portfolio', () => {
     );
     portfolio.setUser({
       accessToken: null,
+      Account: [
+        {
+          accountType: AccountType.SECURITIES,
+          createdAt: new Date(),
+          id: DEFAULT_ACCOUNT_ID,
+          isDefault: true,
+          name: 'Default Account',
+          platformId: null,
+          updatedAt: new Date(),
+          userId: USER_ID
+        }
+      ],
       alias: 'Test',
+      authChallenge: null,
       createdAt: new Date(),
       id: USER_ID,
       provider: null,
@@ -78,7 +128,8 @@ describe('Portfolio', () => {
       Settings: {
         currency: Currency.CHF,
         updatedAt: new Date(),
-        userId: USER_ID
+        userId: USER_ID,
+        viewMode: ViewMode.DEFAULT
       },
       thirdPartyId: null,
       updatedAt: new Date()
@@ -133,12 +184,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 0,
           date: new Date(),
           id: '8d999347-dee2-46ee-88e1-26b344e71fcc',
-          platformId: null,
           quantity: 1,
           symbol: 'BTCUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 49631.24,
           updatedAt: null,
@@ -157,20 +209,8 @@ describe('Portfolio', () => {
       const details = await portfolio.getDetails('1d');
       expect(details).toMatchObject({
         BTCUSD: {
-          currency: Currency.USD,
-          exchange: 'Other',
-          grossPerformance: 0,
-          grossPerformancePercent: 0,
-          investment: exchangeRateDataService.toCurrency(
-            1 * 49631.24,
-            Currency.USD,
-            baseCurrency
-          ),
-          // marketPrice: 57973.008,
-          marketState: MarketState.open,
-          name: 'Bitcoin USD',
-          platforms: {
-            Other: {
+          accounts: {
+            [UNKNOWN_KEY]: {
               /*current: exchangeRateDataService.toCurrency(
                 1 * 49631.24,
                 Currency.USD,
@@ -183,10 +223,24 @@ describe('Portfolio', () => {
               )
             }
           },
+          allocationCurrent: 1,
+          allocationInvestment: 1,
+          countries: [],
+          currency: Currency.USD,
+          exchange: UNKNOWN_KEY,
+          grossPerformance: 0,
+          grossPerformancePercent: 0,
+          investment: exchangeRateDataService.toCurrency(
+            1 * 49631.24,
+            Currency.USD,
+            baseCurrency
+          ),
+          marketPrice: 57973.008,
+          marketState: MarketState.open,
+          name: 'Bitcoin USD',
           quantity: 1,
-          // shareCurrent: 0.9999999559148652,
-          shareInvestment: 1,
           symbol: 'BTCUSD',
+          transactionCount: 1,
           type: 'Cryptocurrency'
         }
       });
@@ -233,12 +287,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 0,
           date: new Date(getUtc('2018-01-05')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fb',
-          platformId: null,
           quantity: 0.2,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 991.49,
           updatedAt: null,
@@ -257,19 +312,8 @@ describe('Portfolio', () => {
       const details = await portfolio.getDetails('1d');
       expect(details).toMatchObject({
         ETHUSD: {
-          currency: Currency.USD,
-          exchange: 'Other',
-          // grossPerformance: 0,
-          // grossPerformancePercent: 0,
-          investment: exchangeRateDataService.toCurrency(
-            0.2 * 991.49,
-            Currency.USD,
-            baseCurrency
-          ),
-          // marketPrice: 57973.008,
-          name: 'Ethereum USD',
-          platforms: {
-            Other: {
+          accounts: {
+            [UNKNOWN_KEY]: {
               /*current: exchangeRateDataService.toCurrency(
                 0.2 * 991.49,
                 Currency.USD,
@@ -282,9 +326,22 @@ describe('Portfolio', () => {
               )
             }
           },
+          // allocationCurrent: 1,
+          allocationInvestment: 1,
+          countries: [],
+          currency: Currency.USD,
+          exchange: UNKNOWN_KEY,
+          // grossPerformance: 0,
+          // grossPerformancePercent: 0,
+          investment: exchangeRateDataService.toCurrency(
+            0.2 * 991.49,
+            Currency.USD,
+            baseCurrency
+          ),
+          marketPrice: 3915.337,
+          name: 'Ethereum USD',
           quantity: 0.2,
-          // shareCurrent: 1,
-          shareInvestment: 1,
+          transactionCount: 1,
           symbol: 'ETHUSD',
           type: 'Cryptocurrency'
         }
@@ -312,7 +369,7 @@ describe('Portfolio', () => {
             baseCurrency
           ),
           investmentInOriginalCurrency: 0.2 * 991.49,
-          // marketPrice: 0,
+          // marketPrice: 3915.337,
           quantity: 0.2
         }
       });
@@ -327,12 +384,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 0,
           date: new Date(getUtc('2018-01-05')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fb',
-          platformId: null,
           quantity: 0.2,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 991.49,
           updatedAt: null,
@@ -343,12 +401,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 0,
           date: new Date(getUtc('2018-01-28')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fc',
-          platformId: null,
           quantity: 0.3,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 1050,
           updatedAt: null,
@@ -388,7 +447,7 @@ describe('Portfolio', () => {
               baseCurrency
             ),
           investmentInOriginalCurrency: 0.2 * 991.49 + 0.3 * 1050,
-          // marketPrice: 0,
+          // marketPrice: 3641.984,
           quantity: 0.5
         }
       });
@@ -403,12 +462,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.EUR,
+          dataSource: DataSource.YAHOO,
           date: new Date(getUtc('2017-08-16')),
           fee: 2.99,
           id: 'd96795b2-6ae6-420e-aa21-fabe5e45d475',
-          platformId: null,
           quantity: 0.05614682,
           symbol: 'BTCUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 3562.089535970158,
           updatedAt: null,
@@ -419,12 +479,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 2.99,
           date: new Date(getUtc('2018-01-05')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fb',
-          platformId: null,
           quantity: 0.2,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 991.49,
           updatedAt: null,
@@ -492,12 +553,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 1.0,
           date: new Date(getUtc('2018-01-05')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fb',
-          platformId: null,
           quantity: 0.2,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 991.49,
           updatedAt: null,
@@ -508,12 +570,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 1.0,
           date: new Date(getUtc('2018-01-28')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fc',
-          platformId: null,
           quantity: 0.1,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.SELL,
           unitPrice: 1050,
           updatedAt: null,
@@ -524,12 +587,13 @@ describe('Portfolio', () => {
           accountUserId: USER_ID,
           createdAt: null,
           currency: Currency.USD,
+          dataSource: DataSource.YAHOO,
           fee: 1.0,
           date: new Date(getUtc('2018-01-31')),
           id: '4a5a5c6e-659d-45cc-9fd4-fd6c873b50fc',
-          platformId: null,
           quantity: 0.2,
           symbol: 'ETHUSD',
+          symbolProfileId: null,
           type: Type.BUY,
           unitPrice: 1050,
           updatedAt: null,
@@ -537,8 +601,7 @@ describe('Portfolio', () => {
         }
       ]);
 
-      // TODO: Fix
-      /*expect(portfolio.getCommittedFunds()).toEqual(
+      expect(portfolio.getCommittedFunds()).toEqual(
         exchangeRateDataService.toCurrency(
           0.2 * 991.49,
           Currency.USD,
@@ -554,7 +617,7 @@ describe('Portfolio', () => {
             Currency.USD,
             baseCurrency
           )
-      );*/
+      );
 
       expect(portfolio.getFees()).toEqual(
         exchangeRateDataService.toCurrency(3, Currency.USD, baseCurrency)
@@ -566,12 +629,11 @@ describe('Portfolio', () => {
             (0.2 * 991.49 - 0.1 * 1050 + 0.2 * 1050) / (0.2 - 0.1 + 0.2),
           currency: Currency.USD,
           firstBuyDate: '2018-01-05T00:00:00.000Z',
-          // TODO: Fix
-          /*investment: exchangeRateDataService.toCurrency(
+          investment: exchangeRateDataService.toCurrency(
             0.2 * 991.49 - 0.1 * 1050 + 0.2 * 1050,
             Currency.USD,
             baseCurrency
-          ),*/
+          ),
           investmentInOriginalCurrency: 0.2 * 991.49 - 0.1 * 1050 + 0.2 * 1050,
           // marketPrice: 0,
           quantity: 0.2 - 0.1 + 0.2
@@ -581,8 +643,4 @@ describe('Portfolio', () => {
       expect(portfolio.getSymbols(getYesterday())).toEqual(['ETHUSD']);
     });
   });
-
-  afterAll(async () => {
-    prismaService.$disconnect();
-  });
 });

apps/api/src/models/portfolio.ts

@@ -1,8 +1,17 @@
+import { UNKNOWN_KEY } from '@ghostfolio/common/config';
+import { getToday, getYesterday, resetHours } from '@ghostfolio/common/helper';
 import {
   PortfolioItem,
-  Position
-} from '@ghostfolio/api/app/portfolio/interfaces/portfolio-item.interface';
-import { getToday, getYesterday, resetHours } from '@ghostfolio/helper';
+  PortfolioPerformance,
+  PortfolioPosition,
+  PortfolioReport,
+  Position,
+  UserWithSettings
+} from '@ghostfolio/common/interfaces';
+import { Country } from '@ghostfolio/common/interfaces/country.interface';
+import { DateRange, OrderWithAccount } from '@ghostfolio/common/types';
+import { Prisma } from '@prisma/client';
+import { continents, countries } from 'countries-list';
 import {
   add,
   format,
@@ -22,26 +31,21 @@ import {
 import { cloneDeep, isEmpty } from 'lodash';
 import * as roundTo from 'round-to';
 
-import { UserWithSettings } from '../app/interfaces/user-with-settings';
-import { OrderWithPlatform } from '../app/order/interfaces/order-with-platform.type';
-import { DateRange } from '../app/portfolio/interfaces/date-range.type';
-import { PortfolioPerformance } from '../app/portfolio/interfaces/portfolio-performance.interface';
-import { PortfolioPosition } from '../app/portfolio/interfaces/portfolio-position.interface';
-import { PortfolioReport } from '../app/portfolio/interfaces/portfolio-report.interface';
 import { DataProviderService } from '../services/data-provider.service';
 import { ExchangeRateDataService } from '../services/exchange-rate-data.service';
 import { IOrder } from '../services/interfaces/interfaces';
 import { RulesService } from '../services/rules.service';
 import { PortfolioInterface } from './interfaces/portfolio.interface';
 import { Order } from './order';
+import { OrderType } from './order-type';
+import { AccountClusterRiskCurrentInvestment } from './rules/account-cluster-risk/current-investment';
+import { AccountClusterRiskInitialInvestment } from './rules/account-cluster-risk/initial-investment';
+import { AccountClusterRiskSingleAccount } from './rules/account-cluster-risk/single-account';
 import { CurrencyClusterRiskBaseCurrencyCurrentInvestment } from './rules/currency-cluster-risk/base-currency-current-investment';
 import { CurrencyClusterRiskBaseCurrencyInitialInvestment } from './rules/currency-cluster-risk/base-currency-initial-investment';
 import { CurrencyClusterRiskCurrentInvestment } from './rules/currency-cluster-risk/current-investment';
 import { CurrencyClusterRiskInitialInvestment } from './rules/currency-cluster-risk/initial-investment';
 import { FeeRatioInitialInvestment } from './rules/fees/fee-ratio-initial-investment';
-import { PlatformClusterRiskCurrentInvestment } from './rules/platform-cluster-risk/current-investment';
-import { PlatformClusterRiskInitialInvestment } from './rules/platform-cluster-risk/initial-investment';
-import { PlatformClusterRiskSinglePlatform } from './rules/platform-cluster-risk/single-platform';
 
 export class Portfolio implements PortfolioInterface {
   private orders: Order[] = [];
@@ -119,25 +123,27 @@ export class Portfolio implements PortfolioInterface {
   }): Portfolio {
     orders.forEach(
       ({
+        account,
         currency,
         fee,
         date,
         id,
-        platform,
         quantity,
         symbol,
+        symbolProfile,
         type,
         unitPrice
       }) => {
         this.orders.push(
           new Order({
+            account,
             currency,
             fee,
             date,
             id,
-            platform,
             quantity,
             symbol,
+            symbolProfile,
             type,
             unitPrice
           })
@@ -202,7 +208,8 @@ export class Portfolio implements PortfolioInterface {
     const data = await this.dataProviderService.get(symbols);
 
     symbols.forEach((symbol) => {
-      const platforms: PortfolioPosition['platforms'] = {};
+      const accounts: PortfolioPosition['accounts'] = {};
+      let countriesOfSymbol: Country[];
       const [portfolioItem] = portfolioItems;
 
       const ordersBySymbol = this.getOrders().filter((order) => {
@@ -227,19 +234,36 @@ export class Portfolio implements PortfolioInterface {
           originalValueOfSymbol *= -1;
         }
 
-        if (platforms[orderOfSymbol.getPlatform()?.name || 'Other']?.current) {
-          platforms[
-            orderOfSymbol.getPlatform()?.name || 'Other'
+        if (
+          accounts[orderOfSymbol.getAccount()?.name || UNKNOWN_KEY]?.current
+        ) {
+          accounts[
+            orderOfSymbol.getAccount()?.name || UNKNOWN_KEY
           ].current += currentValueOfSymbol;
-          platforms[
-            orderOfSymbol.getPlatform()?.name || 'Other'
+          accounts[
+            orderOfSymbol.getAccount()?.name || UNKNOWN_KEY
           ].original += originalValueOfSymbol;
         } else {
-          platforms[orderOfSymbol.getPlatform()?.name || 'Other'] = {
+          accounts[orderOfSymbol.getAccount()?.name || UNKNOWN_KEY] = {
             current: currentValueOfSymbol,
             original: originalValueOfSymbol
           };
         }
+
+        countriesOfSymbol = (
+          (orderOfSymbol.getSymbolProfile()?.countries as Prisma.JsonArray) ??
+          []
+        ).map((country) => {
+          const { code, weight } = country as Prisma.JsonObject;
+
+          return {
+            code: code as string,
+            continent:
+              continents[countries[code as string]?.continent] ?? UNKNOWN_KEY,
+            name: countries[code as string]?.name ?? UNKNOWN_KEY,
+            weight: weight as number
+          };
+        });
       });
 
       let now = portfolioItemsNow.positions[symbol].marketPrice;
@@ -276,8 +300,17 @@ export class Portfolio implements PortfolioInterface {
 
       details[symbol] = {
         ...data[symbol],
-        platforms,
+        accounts,
         symbol,
+        allocationCurrent:
+          this.exchangeRateDataService.toCurrency(
+            portfolioItem.positions[symbol].quantity * now,
+            data[symbol]?.currency,
+            this.user.Settings.currency
+          ) / value,
+        allocationInvestment:
+          portfolioItem.positions[symbol].investment / investment,
+        countries: countriesOfSymbol,
         grossPerformance: roundTo(
           portfolioItemsNow.positions[symbol].quantity * (now - before),
           2
@@ -285,15 +318,12 @@ export class Portfolio implements PortfolioInterface {
         grossPerformancePercent: roundTo((now - before) / before, 4),
         investment: portfolioItem.positions[symbol].investment,
         quantity: portfolioItem.positions[symbol].quantity,
-        shareCurrent:
-          this.exchangeRateDataService.toCurrency(
-            portfolioItem.positions[symbol].quantity * now,
-            data[symbol]?.currency,
-            this.user.Settings.currency
-          ) / value,
-        shareInvestment:
-          portfolioItem.positions[symbol].investment / investment,
-        transactionCount: portfolioItem.positions[symbol].transactionCount
+        transactionCount: portfolioItem.positions[symbol].transactionCount,
+        value: this.exchangeRateDataService.toCurrency(
+          portfolioItem.positions[symbol].quantity * now,
+          data[symbol]?.currency,
+          this.user.Settings.currency
+        )
       };
     });
 
@@ -396,6 +426,19 @@ export class Portfolio implements PortfolioInterface {
 
     return {
       rules: {
+        accountClusterRisk: await this.rulesService.evaluate(
+          this,
+          [
+            new AccountClusterRiskInitialInvestment(
+              this.exchangeRateDataService
+            ),
+            new AccountClusterRiskCurrentInvestment(
+              this.exchangeRateDataService
+            ),
+            new AccountClusterRiskSingleAccount(this.exchangeRateDataService)
+          ],
+          { baseCurrency: this.user.Settings.currency }
+        ),
         currencyClusterRisk: await this.rulesService.evaluate(
           this,
           [
@@ -414,19 +457,6 @@ export class Portfolio implements PortfolioInterface {
           ],
           { baseCurrency: this.user.Settings.currency }
         ),
-        platformClusterRisk: await this.rulesService.evaluate(
-          this,
-          [
-            new PlatformClusterRiskSinglePlatform(this.exchangeRateDataService),
-            new PlatformClusterRiskInitialInvestment(
-              this.exchangeRateDataService
-            ),
-            new PlatformClusterRiskCurrentInvestment(
-              this.exchangeRateDataService
-            )
-          ],
-          { baseCurrency: this.user.Settings.currency }
-        ),
         fees: await this.rulesService.evaluate(
           this,
           [new FeeRatioInitialInvestment(this.exchangeRateDataService)],
@@ -483,7 +513,13 @@ export class Portfolio implements PortfolioInterface {
       .reduce((previous, current) => previous + current, 0);
   }
 
-  public getOrders() {
+  public getOrders(aSymbol?: string) {
+    if (aSymbol) {
+      return this.orders.filter((order) => {
+        return order.getSymbol() === aSymbol;
+      });
+    }
+
     return this.orders;
   }
 
@@ -522,20 +558,21 @@ export class Portfolio implements PortfolioInterface {
     return isFinite(value) ? value : null;
   }
 
-  public async setOrders(aOrders: OrderWithPlatform[]) {
+  public async setOrders(aOrders: OrderWithAccount[]) {
     this.orders = [];
 
     // Map data
     aOrders.forEach((order) => {
       this.orders.push(
         new Order({
-          currency: <any>order.currency,
+          account: order.Account,
+          currency: order.currency,
           date: order.date.toISOString(),
           fee: order.fee,
-          platform: order.Platform,
           quantity: order.quantity,
           symbol: order.symbol,
-          type: <any>order.type,
+          symbolProfile: order.SymbolProfile,
+          type: <OrderType>order.type,
           unitPrice: order.unitPrice
         })
       );

apps/api/src/models/rule.ts

@@ -1,7 +1,7 @@
-import { groupBy } from '@ghostfolio/helper';
+import { groupBy } from '@ghostfolio/common/helper';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { Currency } from '@prisma/client';
 
-import { PortfolioPosition } from '../app/portfolio/interfaces/portfolio-position.interface';
 import { ExchangeRateDataService } from '../services/exchange-rate-data.service';
 import { EvaluationResult } from './interfaces/evaluation-result.interface';
 import { RuleInterface } from './interfaces/rule.interface';

apps/api/src/models/rules/account-cluster-risk/current-investment.ts

@@ -1,9 +1,9 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 
 import { Rule } from '../../rule';
 
-export class PlatformClusterRiskCurrentInvestment extends Rule {
+export class AccountClusterRiskCurrentInvestment extends Rule {
   public constructor(public exchangeRateDataService: ExchangeRateDataService) {
     super(exchangeRateDataService, {
       name: 'Current Investment'
@@ -18,24 +18,22 @@ export class PlatformClusterRiskCurrentInvestment extends Rule {
     }
   ) {
     const ruleSettings =
-      aRuleSettingsMap[PlatformClusterRiskCurrentInvestment.name];
+      aRuleSettingsMap[AccountClusterRiskCurrentInvestment.name];
 
-    const platforms: {
+    const accounts: {
       [symbol: string]: Pick<PortfolioPosition, 'name'> & {
         investment: number;
       };
     } = {};
 
     Object.values(aPositions).forEach((position) => {
-      for (const [platform, { current }] of Object.entries(
-        position.platforms
-      )) {
-        if (platforms[platform]?.investment) {
-          platforms[platform].investment += current;
+      for (const [account, { current }] of Object.entries(position.accounts)) {
+        if (accounts[account]?.investment) {
+          accounts[account].investment += current;
         } else {
-          platforms[platform] = {
+          accounts[account] = {
             investment: current,
-            name: platform
+            name: account
           };
         }
       }
@@ -44,17 +42,17 @@ export class PlatformClusterRiskCurrentInvestment extends Rule {
     let maxItem;
     let totalInvestment = 0;
 
-    Object.values(platforms).forEach((platform) => {
+    Object.values(accounts).forEach((account) => {
       if (!maxItem) {
-        maxItem = platform;
+        maxItem = account;
       }
 
       // Calculate total investment
-      totalInvestment += platform.investment;
+      totalInvestment += account.investment;
 
       // Find maximum
-      if (platform.investment > maxItem?.investment) {
-        maxItem = platform;
+      if (account.investment > maxItem?.investment) {
+        maxItem = account;
       }
     });
 

apps/api/src/models/rules/account-cluster-risk/initial-investment.ts

@@ -1,9 +1,9 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';
 
-export class PlatformClusterRiskInitialInvestment extends Rule {
+export class AccountClusterRiskInitialInvestment extends Rule {
   public constructor(public exchangeRateDataService: ExchangeRateDataService) {
     super(exchangeRateDataService, {
       name: 'Initial Investment'
@@ -18,7 +18,7 @@ export class PlatformClusterRiskInitialInvestment extends Rule {
     }
   ) {
     const ruleSettings =
-      aRuleSettingsMap[PlatformClusterRiskInitialInvestment.name];
+      aRuleSettingsMap[AccountClusterRiskInitialInvestment.name];
 
     const platforms: {
       [symbol: string]: Pick<PortfolioPosition, 'name'> & {
@@ -27,15 +27,13 @@ export class PlatformClusterRiskInitialInvestment extends Rule {
     } = {};
 
     Object.values(aPositions).forEach((position) => {
-      for (const [platform, { original }] of Object.entries(
-        position.platforms
-      )) {
-        if (platforms[platform]?.investment) {
-          platforms[platform].investment += original;
+      for (const [account, { original }] of Object.entries(position.accounts)) {
+        if (platforms[account]?.investment) {
+          platforms[account].investment += original;
         } else {
-          platforms[platform] = {
+          platforms[account] = {
             investment: original,
-            name: platform
+            name: account
           };
         }
       }

apps/api/src/models/rules/account-cluster-risk/single-account.ts

@@ -1,35 +1,35 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';
 
-export class PlatformClusterRiskSinglePlatform extends Rule {
+export class AccountClusterRiskSingleAccount extends Rule {
   public constructor(public exchangeRateDataService: ExchangeRateDataService) {
     super(exchangeRateDataService, {
-      name: 'Single Platform'
+      name: 'Single Account'
     });
   }
 
   public evaluate(positions: { [symbol: string]: PortfolioPosition }) {
-    const platforms: string[] = [];
+    const accounts: string[] = [];
 
     Object.values(positions).forEach((position) => {
-      for (const [platform] of Object.entries(position.platforms)) {
-        if (!platforms.includes(platform)) {
-          platforms.push(platform);
+      for (const [account] of Object.entries(position.accounts)) {
+        if (!accounts.includes(account)) {
+          accounts.push(account);
         }
       }
     });
 
-    if (platforms.length === 1) {
+    if (accounts.length === 1) {
       return {
-        evaluation: `All your investment is managed by a single platform`,
+        evaluation: `All your investment is managed by a single account`,
         value: false
       };
     }
 
     return {
-      evaluation: `Your investment is managed by ${platforms.length} platforms`,
+      evaluation: `Your investment is managed by ${accounts.length} accounts`,
       value: true
     };
   }

apps/api/src/models/rules/currency-cluster-risk/base-currency-current-investment.ts

@@ -1,5 +1,5 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
 import { ExchangeRateDataService } from '@ghostfolio/api/services/exchange-rate-data.service';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 
 import { Rule } from '../../rule';
 

apps/api/src/models/rules/currency-cluster-risk/base-currency-initial-investment.ts

@@ -1,4 +1,4 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';

apps/api/src/models/rules/currency-cluster-risk/current-investment.ts

@@ -1,4 +1,4 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';

apps/api/src/models/rules/currency-cluster-risk/initial-investment.ts

@@ -1,4 +1,4 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';

apps/api/src/models/rules/fees/fee-ratio-initial-investment.ts

@@ -1,4 +1,4 @@
-import { PortfolioPosition } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-position.interface';
+import { PortfolioPosition } from '@ghostfolio/common/interfaces';
 import { ExchangeRateDataService } from 'apps/api/src/services/exchange-rate-data.service';
 
 import { Rule } from '../../rule';

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

@@ -1,5 +1,6 @@
 import { Injectable } from '@nestjs/common';
-import { bool, cleanEnv, num, port, str } from 'envalid';
+import { DataSource } from '@prisma/client';
+import { bool, cleanEnv, host, json, num, port, str } from 'envalid';
 
 import { Environment } from './interfaces/environment.interface';
 
@@ -12,6 +13,7 @@ export class ConfigurationService {
       ACCESS_TOKEN_SALT: str(),
       ALPHA_VANTAGE_API_KEY: str({ default: '' }),
       CACHE_TTL: num({ default: 1 }),
+      DATA_SOURCES: json({ default: JSON.stringify([DataSource.YAHOO]) }),
       ENABLE_FEATURE_CUSTOM_SYMBOLS: bool({ default: false }),
       ENABLE_FEATURE_FEAR_AND_GREED_INDEX: bool({ default: false }),
       ENABLE_FEATURE_SOCIAL_LOGIN: bool({ default: false }),
@@ -24,7 +26,8 @@ export class ConfigurationService {
       RAKUTEN_RAPID_API_KEY: str({ default: '' }),
       REDIS_HOST: str({ default: 'localhost' }),
       REDIS_PORT: port({ default: 6379 }),
-      ROOT_URL: str({ default: 'http://localhost:4200' })
+      ROOT_URL: str({ default: 'http://localhost:4200' }),
+      WEB_AUTH_RP_ID: host({ default: 'localhost' })
     });
   }
 

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

@@ -1,11 +1,11 @@
+import { benchmarks, currencyPairs } from '@ghostfolio/common/config';
 import {
-  benchmarks,
-  currencyPairs,
   getUtc,
   isGhostfolioScraperApiSymbol,
   resetHours
-} from '@ghostfolio/helper';
+} from '@ghostfolio/common/helper';
 import { Injectable } from '@nestjs/common';
+import { DataSource } from '@prisma/client';
 import {
   differenceInHours,
   format,
@@ -19,6 +19,7 @@ import {
 import { ConfigurationService } from './configuration.service';
 import { DataProviderService } from './data-provider.service';
 import { GhostfolioScraperApiService } from './data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service';
+import { IDataGatheringItem } from './interfaces/interfaces';
 import { PrismaService } from './prisma.service';
 
 @Injectable()
@@ -116,15 +117,13 @@ export class DataGatheringService {
     }
   }
 
-  public async gatherSymbols(
-    aSymbolsWithStartDate: { date: Date; symbol: string }[]
-  ) {
+  public async gatherSymbols(aSymbolsWithStartDate: IDataGatheringItem[]) {
     let hasError = false;
 
-    for (const { date, symbol } of aSymbolsWithStartDate) {
+    for (const { dataSource, date, symbol } of aSymbolsWithStartDate) {
       try {
         const historicalData = await this.dataProviderService.getHistoricalRaw(
-          [symbol],
+          [{ dataSource, symbol }],
           date,
           new Date()
         );
@@ -185,20 +184,24 @@ export class DataGatheringService {
     }
   }
 
-  public async getCustomSymbolsToGather(startDate?: Date) {
+  public async getCustomSymbolsToGather(
+    startDate?: Date
+  ): Promise<IDataGatheringItem[]> {
     const scraperConfigurations = await this.ghostfolioScraperApi.getScraperConfigurations();
 
     return scraperConfigurations.map((scraperConfiguration) => {
       return {
+        dataSource: DataSource.GHOSTFOLIO,
         date: startDate,
         symbol: scraperConfiguration.symbol
       };
     });
   }
 
-  private getBenchmarksToGather(startDate: Date) {
-    const benchmarksToGather = benchmarks.map((symbol) => {
+  private getBenchmarksToGather(startDate: Date): IDataGatheringItem[] {
+    const benchmarksToGather = benchmarks.map(({ dataSource, symbol }) => {
       return {
+        dataSource,
         symbol,
         date: startDate
       };
@@ -206,6 +209,7 @@ export class DataGatheringService {
 
     if (this.configurationService.get('ENABLE_FEATURE_FEAR_AND_GREED_INDEX')) {
       benchmarksToGather.push({
+        dataSource: DataSource.RAKUTEN,
         date: startDate,
         symbol: 'GF.FEAR_AND_GREED_INDEX'
       });
@@ -214,16 +218,16 @@ export class DataGatheringService {
     return benchmarksToGather;
   }
 
-  private async getSymbols7D(): Promise<{ date: Date; symbol: string }[]> {
+  private async getSymbols7D(): Promise<IDataGatheringItem[]> {
     const startDate = subDays(resetHours(new Date()), 7);
 
     const distinctOrders = await this.prisma.order.findMany({
       distinct: ['symbol'],
       orderBy: [{ symbol: 'asc' }],
-      select: { symbol: true }
+      select: { dataSource: true, symbol: true }
     });
 
-    const distinctOrdersWithDate = distinctOrders
+    const distinctOrdersWithDate: IDataGatheringItem[] = distinctOrders
       .filter((distinctOrder) => {
         return !isGhostfolioScraperApiSymbol(distinctOrder.symbol);
       })
@@ -234,12 +238,15 @@ export class DataGatheringService {
         };
       });
 
-    const currencyPairsToGather = currencyPairs.map((symbol) => {
-      return {
-        symbol,
-        date: startDate
-      };
-    });
+    const currencyPairsToGather = currencyPairs.map(
+      ({ dataSource, symbol }) => {
+        return {
+          dataSource,
+          symbol,
+          date: startDate
+        };
+      }
+    );
 
     const customSymbolsToGather = await this.getCustomSymbolsToGather(
       startDate
@@ -253,24 +260,27 @@ export class DataGatheringService {
     ];
   }
 
-  private async getSymbolsMax() {
+  private async getSymbolsMax(): Promise<IDataGatheringItem[]> {
     const startDate = new Date(getUtc('2015-01-01'));
 
     const customSymbolsToGather = await this.getCustomSymbolsToGather(
       startDate
     );
 
-    const currencyPairsToGather = currencyPairs.map((symbol) => {
-      return {
-        symbol,
-        date: startDate
-      };
-    });
+    const currencyPairsToGather = currencyPairs.map(
+      ({ dataSource, symbol }) => {
+        return {
+          dataSource,
+          symbol,
+          date: startDate
+        };
+      }
+    );
 
     const distinctOrders = await this.prisma.order.findMany({
       distinct: ['symbol'],
       orderBy: [{ date: 'asc' }],
-      select: { date: true, symbol: true }
+      select: { dataSource: true, date: true, symbol: true }
     });
 
     return [

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

@@ -1,10 +1,10 @@
 import {
-  isCrypto,
   isGhostfolioScraperApiSymbol,
   isRakutenRapidApiSymbol
-} from '@ghostfolio/helper';
+} from '@ghostfolio/common/helper';
+import { Granularity } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
-import { MarketData } from '@prisma/client';
+import { DataSource, MarketData } from '@prisma/client';
 import { format } from 'date-fns';
 
 import { ConfigurationService } from './configuration.service';
@@ -12,16 +12,15 @@ import { AlphaVantageService } from './data-provider/alpha-vantage/alpha-vantage
 import { GhostfolioScraperApiService } from './data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service';
 import { RakutenRapidApiService } from './data-provider/rakuten-rapid-api/rakuten-rapid-api.service';
 import { YahooFinanceService } from './data-provider/yahoo-finance/yahoo-finance.service';
-import { DataProviderInterface } from './interfaces/data-provider.interface';
-import { Granularity } from './interfaces/granularity.type';
 import {
+  IDataGatheringItem,
   IDataProviderHistoricalResponse,
   IDataProviderResponse
 } from './interfaces/interfaces';
 import { PrismaService } from './prisma.service';
 
 @Injectable()
-export class DataProviderService implements DataProviderInterface {
+export class DataProviderService {
   public constructor(
     private readonly alphaVantageService: AlphaVantageService,
     private readonly configurationService: ConfigurationService,
@@ -120,68 +119,57 @@ export class DataProviderService implements DataProviderInterface {
   }
 
   public async getHistoricalRaw(
-    aSymbols: string[],
+    aDataGatheringItems: IDataGatheringItem[],
     from: Date,
     to: Date
   ): Promise<{
     [symbol: string]: { [date: string]: IDataProviderHistoricalResponse };
   }> {
-    const filteredSymbols = aSymbols.filter((symbol) => {
-      return !isGhostfolioScraperApiSymbol(symbol);
-    });
+    const result: {
+      [symbol: string]: { [date: string]: IDataProviderHistoricalResponse };
+    } = {};
 
-    const dataOfYahoo = await this.yahooFinanceService.getHistorical(
-      filteredSymbols,
-      undefined,
-      from,
-      to
-    );
-
-    if (aSymbols.length === 1) {
-      const symbol = aSymbols[0];
-
-      if (
-        isCrypto(symbol) &&
-        this.configurationService.get('ALPHA_VANTAGE_API_KEY')
-      ) {
-        // Merge data from Yahoo with data from Alpha Vantage
-        const dataOfAlphaVantage = await this.alphaVantageService.getHistorical(
-          [symbol],
-          undefined,
-          from,
-          to
+    const promises: Promise<{
+      data: { [date: string]: IDataProviderHistoricalResponse };
+      symbol: string;
+    }>[] = [];
+    for (const { dataSource, symbol } of aDataGatheringItems) {
+      const dataProvider = this.getDataProvider(dataSource);
+      if (dataProvider.canHandle(symbol)) {
+        promises.push(
+          dataProvider
+            .getHistorical([symbol], undefined, from, to)
+            .then((data) => ({ data: data?.[symbol], symbol }))
         );
-
-        return {
-          [symbol]: {
-            ...dataOfYahoo[symbol],
-            ...dataOfAlphaVantage[symbol]
-          }
-        };
-      } else if (isGhostfolioScraperApiSymbol(symbol)) {
-        const dataOfGhostfolioScraperApi = await this.ghostfolioScraperApiService.getHistorical(
-          [symbol],
-          undefined,
-          from,
-          to
-        );
-
-        return dataOfGhostfolioScraperApi;
-      } else if (
-        isRakutenRapidApiSymbol(symbol) &&
-        this.configurationService.get('RAKUTEN_RAPID_API_KEY')
-      ) {
-        const dataOfRakutenRapidApi = await this.rakutenRapidApiService.getHistorical(
-          [symbol],
-          undefined,
-          from,
-          to
-        );
-
-        return dataOfRakutenRapidApi;
       }
     }
 
-    return dataOfYahoo;
+    const allData = await Promise.all(promises);
+    for (const { data, symbol } of allData) {
+      result[symbol] = data;
+    }
+
+    return result;
+  }
+
+  public async search(aSymbol: string) {
+    return this.getDataProvider(
+      <DataSource>this.configurationService.get('DATA_SOURCES')[0]
+    ).search(aSymbol);
+  }
+
+  private getDataProvider(providerName: DataSource) {
+    switch (providerName) {
+      case DataSource.ALPHA_VANTAGE:
+        return this.alphaVantageService;
+      case DataSource.GHOSTFOLIO:
+        return this.ghostfolioScraperApiService;
+      case DataSource.RAKUTEN:
+        return this.rakutenRapidApiService;
+      case DataSource.YAHOO:
+        return this.yahooFinanceService;
+      default:
+        throw new Error('No data provider has been found.');
+    }
   }
 }

apps/api/src/services/data-provider/alpha-vantage/alpha-vantage.service.ts

@@ -1,9 +1,11 @@
+import { LookupItem } from '@ghostfolio/api/app/symbol/interfaces/lookup-item.interface';
+import { Granularity } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
+import { DataSource } from '@prisma/client';
 import { isAfter, isBefore, parse } from 'date-fns';
 
 import { ConfigurationService } from '../../configuration.service';
 import { DataProviderInterface } from '../../interfaces/data-provider.interface';
-import { Granularity } from '../../interfaces/granularity.type';
 import {
   IDataProviderHistoricalResponse,
   IDataProviderResponse
@@ -22,6 +24,10 @@ export class AlphaVantageService implements DataProviderInterface {
     });
   }
 
+  public canHandle(symbol: string) {
+    return !!this.configurationService.get('ALPHA_VANTAGE_API_KEY');
+  }
+
   public async get(
     aSymbols: string[]
   ): Promise<{ [symbol: string]: IDataProviderResponse }> {
@@ -77,7 +83,17 @@ export class AlphaVantageService implements DataProviderInterface {
     }
   }
 
-  public search(aSymbol: string) {
-    return this.alphaVantage.data.search(aSymbol);
+  public async search(aSymbol: string): Promise<{ items: LookupItem[] }> {
+    const result = await this.alphaVantage.data.search(aSymbol);
+
+    return {
+      items: result?.bestMatches?.map((bestMatch) => {
+        return {
+          dataSource: DataSource.ALPHA_VANTAGE,
+          name: bestMatch['2. name'],
+          symbol: bestMatch['1. symbol']
+        };
+      })
+    };
   }
 }

apps/api/src/services/data-provider/ghostfolio-scraper-api/ghostfolio-scraper-api.service.ts

@@ -1,12 +1,15 @@
-import { DataSource } from '.prisma/client';
-import { getYesterday } from '@ghostfolio/helper';
+import {
+  getYesterday,
+  isGhostfolioScraperApiSymbol
+} from '@ghostfolio/common/helper';
+import { Granularity } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
+import { DataSource } from '@prisma/client';
 import * as bent from 'bent';
 import * as cheerio from 'cheerio';
 import { format } from 'date-fns';
 
 import { DataProviderInterface } from '../../interfaces/data-provider.interface';
-import { Granularity } from '../../interfaces/granularity.type';
 import {
   IDataProviderHistoricalResponse,
   IDataProviderResponse,
@@ -21,6 +24,10 @@ export class GhostfolioScraperApiService implements DataProviderInterface {
 
   public constructor(private prisma: PrismaService) {}
 
+  public canHandle(symbol: string) {
+    return isGhostfolioScraperApiSymbol(symbol);
+  }
+
   public async get(
     aSymbols: string[]
   ): Promise<{ [symbol: string]: IDataProviderResponse }> {
@@ -117,6 +124,10 @@ export class GhostfolioScraperApiService implements DataProviderInterface {
     return [];
   }
 
+  public async search(aSymbol: string) {
+    return { items: [] };
+  }
+
   private extractNumberFromString(aString: string): number {
     try {
       const [numberString] = aString.match(

apps/api/src/services/data-provider/ghostfolio-scraper-api/interfaces/scraper-config.interface.ts

@@ -1,4 +1,4 @@
-import { Currency } from '.prisma/client';
+import { Currency } from '@prisma/client';
 
 export interface ScraperConfig {
   currency: Currency;

apps/api/src/services/data-provider/rakuten-rapid-api/rakuten-rapid-api.service.ts

@@ -1,12 +1,16 @@
-import { DataSource } from '.prisma/client';
-import { getToday, getYesterday } from '@ghostfolio/helper';
+import {
+  getToday,
+  getYesterday,
+  isRakutenRapidApiSymbol
+} from '@ghostfolio/common/helper';
+import { Granularity } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
+import { DataSource } from '@prisma/client';
 import * as bent from 'bent';
 import { format, subMonths, subWeeks, subYears } from 'date-fns';
 
 import { ConfigurationService } from '../../configuration.service';
 import { DataProviderInterface } from '../../interfaces/data-provider.interface';
-import { Granularity } from '../../interfaces/granularity.type';
 import {
   IDataProviderHistoricalResponse,
   IDataProviderResponse,
@@ -24,6 +28,13 @@ export class RakutenRapidApiService implements DataProviderInterface {
     private readonly configurationService: ConfigurationService
   ) {}
 
+  public canHandle(symbol: string) {
+    return (
+      isRakutenRapidApiSymbol(symbol) &&
+      !!this.configurationService.get('RAKUTEN_RAPID_API_KEY')
+    );
+  }
+
   public async get(
     aSymbols: string[]
   ): Promise<{ [symbol: string]: IDataProviderResponse }> {
@@ -117,6 +128,14 @@ export class RakutenRapidApiService implements DataProviderInterface {
     return {};
   }
 
+  public async search(aSymbol: string) {
+    return { items: [] };
+  }
+
+  public setPrisma(aPrismaService: PrismaService) {
+    this.prisma = aPrismaService;
+  }
+
   private async getFearAndGreedIndex(): Promise<{
     now: { value: number; valueText: string };
     previousClose: { value: number; valueText: string };
@@ -147,8 +166,4 @@ export class RakutenRapidApiService implements DataProviderInterface {
       return undefined;
     }
   }
-
-  public setPrisma(aPrismaService: PrismaService) {
-    this.prisma = aPrismaService;
-  }
 }

apps/api/src/services/data-provider/yahoo-finance/yahoo-finance.service.spec.ts___

@@ -1,24 +0,0 @@
-/*
-  import { Test } from '@nestjs/testing';
-
-  import { YahooFinanceService } from './yahoo-finance.service';
-
-  describe('AppService', () => {
-    let service: YahooFinanceService;
-
-    beforeAll(async () => {
-      const app = await Test.createTestingModule({
-        imports: [],
-        providers: [YahooFinanceService]
-      }).compile();
-
-      service = app.get<YahooFinanceService>(YahooFinanceService);
-    });
-
-    describe('get', () => {
-      it('should return data for USDCHF', () => {
-        expect(service.get(['USDCHF'])).toEqual('{}');
-      });
-    });
-  });
-*/

apps/api/src/services/data-provider/yahoo-finance/yahoo-finance.service.ts

@@ -1,11 +1,14 @@
-import { DataSource } from '.prisma/client';
-import { isCrypto, isCurrency, parseCurrency } from '@ghostfolio/helper';
+import { LookupItem } from '@ghostfolio/api/app/symbol/interfaces/lookup-item.interface';
+import { UNKNOWN_KEY } from '@ghostfolio/common/config';
+import { isCrypto, isCurrency, parseCurrency } from '@ghostfolio/common/helper';
+import { Granularity } from '@ghostfolio/common/types';
 import { Injectable } from '@nestjs/common';
+import { DataSource } from '@prisma/client';
+import * as bent from 'bent';
 import { format } from 'date-fns';
 import * as yahooFinance from 'yahoo-finance';
 
 import { DataProviderInterface } from '../../interfaces/data-provider.interface';
-import { Granularity } from '../../interfaces/granularity.type';
 import {
   IDataProviderHistoricalResponse,
   IDataProviderResponse,
@@ -21,8 +24,14 @@ import {
 
 @Injectable()
 export class YahooFinanceService implements DataProviderInterface {
+  private yahooFinanceHostname = 'https://query1.finance.yahoo.com';
+
   public constructor() {}
 
+  public canHandle(symbol: string) {
+    return true;
+  }
+
   public async get(
     aSymbols: string[]
   ): Promise<{ [symbol: string]: IDataProviderResponse }> {
@@ -135,6 +144,49 @@ export class YahooFinanceService implements DataProviderInterface {
     }
   }
 
+  public async search(aSymbol: string): Promise<{ items: LookupItem[] }> {
+    let items = [];
+
+    try {
+      const get = bent(
+        `${this.yahooFinanceHostname}/v1/finance/search?q=${aSymbol}&lang=en-US&region=US&quotesCount=8&newsCount=0&enableFuzzyQuery=false&quotesQueryId=tss_match_phrase_query&multiQuoteQueryId=multi_quote_single_token_query&newsQueryId=news_cie_vespa&enableCb=true&enableNavLinks=false&enableEnhancedTrivialQuery=true`,
+        'GET',
+        'json',
+        200
+      );
+
+      const result = await get();
+      items = result.quotes
+        .filter((quote) => {
+          return quote.isYahooFinance;
+        })
+        .filter(({ quoteType }) => {
+          return (
+            quoteType === 'CRYPTOCURRENCY' ||
+            quoteType === 'EQUITY' ||
+            quoteType === 'ETF'
+          );
+        })
+        .filter(({ quoteType, symbol }) => {
+          if (quoteType === 'CRYPTOCURRENCY') {
+            // Only allow cryptocurrencies in USD
+            return symbol.includes('USD');
+          }
+
+          return true;
+        })
+        .map(({ longname, shortname, symbol }) => {
+          return {
+            dataSource: DataSource.YAHOO,
+            name: longname || shortname,
+            symbol: convertFromYahooSymbol(symbol)
+          };
+        });
+    } catch {}
+
+    return { items };
+  }
+
   /**
    * Converts a symbol to a Yahoo symbol
    *
@@ -170,7 +222,7 @@ export class YahooFinanceService implements DataProviderInterface {
 
   private parseExchange(aString: string): string {
     if (aString?.toLowerCase() === 'ccc') {
-      return 'Other';
+      return UNKNOWN_KEY;
     }
 
     return aString;
@@ -200,7 +252,7 @@ export class YahooFinanceService implements DataProviderInterface {
       return Industry.Software;
     }
 
-    return Industry.Other;
+    return Industry.Unknown;
   }
 
   private parseSector(aString: string): Sector {
@@ -222,7 +274,7 @@ export class YahooFinanceService implements DataProviderInterface {
       return Sector.Technology;
     }
 
-    return Sector.Other;
+    return Sector.Unknown;
   }
 
   private parseType(aString: string): Type {
@@ -234,7 +286,7 @@ export class YahooFinanceService implements DataProviderInterface {
       return Type.Stock;
     }
 
-    return Type.Other;
+    return Type.Unknown;
   }
 }
 

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

@@ -1,4 +1,4 @@
-import { getYesterday } from '@ghostfolio/helper';
+import { getYesterday } from '@ghostfolio/common/helper';
 import { Injectable } from '@nestjs/common';
 import { Currency } from '@prisma/client';
 import { format } from 'date-fns';

apps/api/src/services/interfaces/data-provider.interface.ts

@@ -1,10 +1,14 @@
-import { Granularity } from './granularity.type';
+import { LookupItem } from '@ghostfolio/api/app/symbol/interfaces/lookup-item.interface';
+import { Granularity } from '@ghostfolio/common/types';
+
 import {
   IDataProviderHistoricalResponse,
   IDataProviderResponse
 } from './interfaces';
 
 export interface DataProviderInterface {
+  canHandle(symbol: string): boolean;
+
   get(aSymbols: string[]): Promise<{ [symbol: string]: IDataProviderResponse }>;
 
   getHistorical(
@@ -15,4 +19,6 @@ export interface DataProviderInterface {
   ): Promise<{
     [symbol: string]: { [date: string]: IDataProviderHistoricalResponse };
   }>;
+
+  search(aSymbol: string): Promise<{ items: LookupItem[] }>;
 }

apps/api/src/services/interfaces/environment.interface.ts

@@ -4,6 +4,7 @@ export interface Environment extends CleanedEnvAccessors {
   ACCESS_TOKEN_SALT: string;
   ALPHA_VANTAGE_API_KEY: string;
   CACHE_TTL: number;
+  DATA_SOURCES: string | string[]; // string is not correct, error in envalid?
   ENABLE_FEATURE_CUSTOM_SYMBOLS: boolean;
   ENABLE_FEATURE_FEAR_AND_GREED_INDEX: boolean;
   ENABLE_FEATURE_SOCIAL_LOGIN: boolean;
@@ -17,4 +18,5 @@ export interface Environment extends CleanedEnvAccessors {
   REDIS_HOST: string;
   REDIS_PORT: number;
   ROOT_URL: string;
+  WEB_AUTH_RP_ID: string;
 }

apps/api/src/services/interfaces/interfaces.ts

@@ -1,4 +1,5 @@
-import { Currency, DataSource, Platform } from '@prisma/client';
+import { UNKNOWN_KEY } from '@ghostfolio/common/config';
+import { Account, Currency, DataSource, SymbolProfile } from '@prisma/client';
 
 import { OrderType } from '../../models/order-type';
 
@@ -7,9 +8,9 @@ export const Industry = {
   Biotechnology: 'Biotechnology',
   Food: 'Food',
   Internet: 'Internet',
-  Other: 'Other',
   Pharmaceutical: 'Pharmaceutical',
-  Software: 'Software'
+  Software: 'Software',
+  Unknown: UNKNOWN_KEY
 };
 
 export const MarketState = {
@@ -21,25 +22,26 @@ export const MarketState = {
 export const Sector = {
   Consumer: 'Consumer',
   Healthcare: 'Healthcare',
-  Other: 'Other',
-  Technology: 'Technology'
+  Technology: 'Technology',
+  Unknown: UNKNOWN_KEY
 };
 
 export const Type = {
   Cryptocurrency: 'Cryptocurrency',
   ETF: 'ETF',
-  Other: 'Other',
-  Stock: 'Stock'
+  Stock: 'Stock',
+  Unknown: UNKNOWN_KEY
 };
 
 export interface IOrder {
+  account: Account;
   currency: Currency;
   date: string;
   fee: number;
   id?: string;
-  platform: Platform;
   quantity: number;
   symbol: string;
+  symbolProfile: SymbolProfile;
   type: OrderType;
   unitPrice: number;
 }
@@ -64,6 +66,12 @@ export interface IDataProviderResponse {
   url?: string;
 }
 
+export interface IDataGatheringItem {
+  dataSource: DataSource;
+  date?: Date;
+  symbol: string;
+}
+
 export type Industry = typeof Industry[keyof typeof Industry];
 
 export type MarketState = typeof MarketState[keyof typeof MarketState];

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

@@ -2,14 +2,14 @@ import { Injectable } from '@nestjs/common';
 
 import { Portfolio } from '../models/portfolio';
 import { Rule } from '../models/rule';
+import { AccountClusterRiskCurrentInvestment } from '../models/rules/account-cluster-risk/current-investment';
+import { AccountClusterRiskInitialInvestment } from '../models/rules/account-cluster-risk/initial-investment';
+import { AccountClusterRiskSingleAccount } from '../models/rules/account-cluster-risk/single-account';
 import { CurrencyClusterRiskBaseCurrencyCurrentInvestment } from '../models/rules/currency-cluster-risk/base-currency-current-investment';
 import { CurrencyClusterRiskBaseCurrencyInitialInvestment } from '../models/rules/currency-cluster-risk/base-currency-initial-investment';
 import { CurrencyClusterRiskCurrentInvestment } from '../models/rules/currency-cluster-risk/current-investment';
 import { CurrencyClusterRiskInitialInvestment } from '../models/rules/currency-cluster-risk/initial-investment';
 import { FeeRatioInitialInvestment } from '../models/rules/fees/fee-ratio-initial-investment';
-import { PlatformClusterRiskCurrentInvestment } from '../models/rules/platform-cluster-risk/current-investment';
-import { PlatformClusterRiskInitialInvestment } from '../models/rules/platform-cluster-risk/initial-investment';
-import { PlatformClusterRiskSinglePlatform } from '../models/rules/platform-cluster-risk/single-platform';
 
 @Injectable()
 export class RulesService {
@@ -39,6 +39,17 @@ export class RulesService {
 
   private getDefaultRuleSettings(aUserSettings: { baseCurrency: string }) {
     return {
+      [AccountClusterRiskCurrentInvestment.name]: {
+        baseCurrency: aUserSettings.baseCurrency,
+        isActive: true,
+        threshold: 0.5
+      },
+      [AccountClusterRiskInitialInvestment.name]: {
+        baseCurrency: aUserSettings.baseCurrency,
+        isActive: true,
+        threshold: 0.5
+      },
+      [AccountClusterRiskSingleAccount.name]: { isActive: true },
       [CurrencyClusterRiskBaseCurrencyInitialInvestment.name]: {
         baseCurrency: aUserSettings.baseCurrency,
         isActive: true
@@ -61,18 +72,7 @@ export class RulesService {
         baseCurrency: aUserSettings.baseCurrency,
         isActive: true,
         threshold: 0.01
-      },
-      [PlatformClusterRiskCurrentInvestment.name]: {
-        baseCurrency: aUserSettings.baseCurrency,
-        isActive: true,
-        threshold: 0.5
-      },
-      [PlatformClusterRiskInitialInvestment.name]: {
-        baseCurrency: aUserSettings.baseCurrency,
-        isActive: true,
-        threshold: 0.5
-      },
-      [PlatformClusterRiskSinglePlatform.name]: { isActive: true }
+      }
     };
   }
 }

apps/client/jest.config.js

@@ -16,8 +16,8 @@ module.exports = {
   },
   coverageDirectory: '../../coverage/apps/client',
   snapshotSerializers: [
-    'jest-preset-angular/build/AngularNoNgAttributesSnapshotSerializer.js',
-    'jest-preset-angular/build/AngularSnapshotSerializer.js',
-    'jest-preset-angular/build/HTMLCommentSerializer.js'
+    'jest-preset-angular/build/serializers/no-ng-attributes',
+    'jest-preset-angular/build/serializers/ng-snapshot',
+    'jest-preset-angular/build/serializers/html-comment'
   ]
 };

apps/client/src/app/adapter/date-formats.ts

@@ -1,7 +1,7 @@
 import {
   DEFAULT_DATE_FORMAT,
   DEFAULT_DATE_FORMAT_MONTH_YEAR
-} from '@ghostfolio/helper';
+} from '@ghostfolio/common/config';
 
 export const DateFormats = {
   display: {

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

@@ -9,11 +9,6 @@ const routes: Routes = [
     loadChildren: () =>
       import('./pages/about/about-page.module').then((m) => m.AboutPageModule)
   },
-  {
-    path: 'admin',
-    loadChildren: () =>
-      import('./pages/admin/admin-page.module').then((m) => m.AdminPageModule)
-  },
   {
     path: 'account',
     loadChildren: () =>
@@ -21,28 +16,40 @@ const routes: Routes = [
         (m) => m.AccountPageModule
       )
   },
+  {
+    path: 'accounts',
+    loadChildren: () =>
+      import('./pages/accounts/accounts-page.module').then(
+        (m) => m.AccountsPageModule
+      )
+  },
+  {
+    path: 'admin',
+    loadChildren: () =>
+      import('./pages/admin/admin-page.module').then((m) => m.AdminPageModule)
+  },
   {
     path: 'auth',
     loadChildren: () =>
       import('./pages/auth/auth-page.module').then((m) => m.AuthPageModule)
   },
-  {
-    path: 'analysis',
-    loadChildren: () =>
-      import('./pages/analysis/analysis-page.module').then(
-        (m) => m.AnalysisPageModule
-      )
-  },
   {
     path: 'home',
     loadChildren: () =>
       import('./pages/home/home-page.module').then((m) => m.HomePageModule)
   },
   {
-    path: 'report',
+    path: 'pricing',
     loadChildren: () =>
-      import('./pages/report/report-page.module').then(
-        (m) => m.ReportPageModule
+      import('./pages/pricing/pricing-page.module').then(
+        (m) => m.PricingPageModule
+      )
+  },
+  {
+    path: 'register',
+    loadChildren: () =>
+      import('./pages/register/register-page.module').then(
+        (m) => m.RegisterPageModule
       )
   },
   {
@@ -55,7 +62,28 @@ const routes: Routes = [
   {
     path: 'start',
     loadChildren: () =>
-      import('./pages/login/login-page.module').then((m) => m.LoginPageModule)
+      import('./pages/landing/landing-page.module').then(
+        (m) => m.LandingPageModule
+      )
+  },
+  {
+    path: 'tools',
+    loadChildren: () =>
+      import('./pages/tools/tools-page.module').then((m) => m.ToolsPageModule)
+  },
+  {
+    path: 'tools/analysis',
+    loadChildren: () =>
+      import('./pages/tools/analysis/analysis-page.module').then(
+        (m) => m.AnalysisPageModule
+      )
+  },
+  {
+    path: 'tools/report',
+    loadChildren: () =>
+      import('./pages/tools/report/report-page.module').then(
+        (m) => m.ReportPageModule
+      )
   },
   {
     path: 'transactions',
@@ -64,11 +92,23 @@ const routes: Routes = [
         (m) => m.TransactionsPageModule
       )
   },
+  {
+    path: 'webauthn',
+    loadChildren: () =>
+      import('./pages/webauthn/webauthn-page.module').then(
+        (m) => m.WebauthnPageModule
+      )
+  },
+  {
+    path: 'zen',
+    loadChildren: () =>
+      import('./pages/zen/zen-page.module').then((m) => m.ZenPageModule)
+  },
   {
     // wildcard, if requested url doesn't match any paths for routes defined
     // earlier
     path: '**',
-    redirectTo: '/home',
+    redirectTo: 'home',
     pathMatch: 'full'
   }
 ];

apps/client/src/app/app.component.html

@@ -4,6 +4,7 @@
     [currentRoute]="currentRoute"
     [info]="info"
     [user]="user"
+    (signOut)="onSignOut()"
   ></gf-header>
 </header>
 
@@ -11,13 +12,15 @@
   <div *ngIf="canCreateAccount" class="container create-account-container">
     <div class="row mb-5">
       <div class="col-md-6 offset-md-3">
-        <div
-          class="create-account-box p-2 text-center"
-          (click)="onCreateAccount()"
+        <a [routerLink]="['/']">
+          <mat-card
+            class="create-account-box p-2 text-center"
+            (click)="onCreateAccount()"
+          >
+            <div class="mt-1" i18n>You are using the Live Demo.</div>
+            <button mat-button color="primary" i18n>Create Account</button>
+          </mat-card></a
         >
-          <div class="mt-1" i18n>You are using the Live Demo.</div>
-          <button mat-button color="primary" i18n>Create Account</button>
-        </div>
       </div>
     </div>
   </div>
@@ -25,7 +28,10 @@
   <router-outlet></router-outlet>
 </main>
 
-<footer class="footer d-flex justify-content-center position-absolute w-100">
+<footer
+  *ngIf="currentRoute === 'start' || deviceType !== 'mobile'"
+  class="footer d-flex justify-content-center position-absolute w-100"
+>
   <div class="container text-center">
     <div>
       © {{ currentYear }} <a href="https://ghostfol.io">Ghostfolio</a>

apps/client/src/app/app.component.scss

@@ -5,8 +5,6 @@
     padding: 5rem 0;
 
     .create-account-box {
-      border: 1px solid rgba(var(--palette-primary-500), 1);
-      border-radius: 0.25rem;
       cursor: pointer;
       font-size: 90%;
 

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

@@ -5,22 +5,19 @@ import {
   OnDestroy,
   OnInit
 } from '@angular/core';
-import { NavigationEnd, Router } from '@angular/router';
-import { InfoItem } from '@ghostfolio/api/app/info/interfaces/info-item.interface';
-import { User } from '@ghostfolio/api/app/user/interfaces/user.interface';
-import {
-  hasPermission,
-  permissions,
-  primaryColorHex,
-  secondaryColorHex
-} from '@ghostfolio/helper';
+import { NavigationEnd, PRIMARY_OUTLET, Router } from '@angular/router';
+import { primaryColorHex, secondaryColorHex } from '@ghostfolio/common/config';
+import { InfoItem, User } from '@ghostfolio/common/interfaces';
+import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { MaterialCssVarsService } from 'angular-material-css-vars';
+import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject } from 'rxjs';
 import { filter, takeUntil } from 'rxjs/operators';
 
 import { environment } from '../environments/environment';
 import { DataService } from './services/data.service';
 import { TokenStorageService } from './services/token-storage.service';
+import { UserService } from './services/user/user.service';
 
 @Component({
   selector: 'gf-root',
@@ -32,57 +29,70 @@ export class AppComponent implements OnDestroy, OnInit {
   public canCreateAccount: boolean;
   public currentRoute: string;
   public currentYear = new Date().getFullYear();
+  public deviceType: string;
   public info: InfoItem;
-  public isLoggedIn = false;
   public user: User;
   public version = environment.version;
 
   private unsubscribeSubject = new Subject<void>();
 
   public constructor(
-    private cd: ChangeDetectorRef,
+    private changeDetectorRef: ChangeDetectorRef,
     private dataService: DataService,
+    private deviceService: DeviceDetectorService,
     private materialCssVarsService: MaterialCssVarsService,
     private router: Router,
-    private tokenStorageService: TokenStorageService
+    private tokenStorageService: TokenStorageService,
+    private userService: UserService
   ) {
     this.initializeTheme();
     this.user = undefined;
   }
 
   public ngOnInit() {
+    this.deviceType = this.deviceService.getDeviceInfo().deviceType;
+
     this.dataService.fetchInfo().subscribe((info) => {
       this.info = info;
     });
 
     this.router.events
       .pipe(filter((event) => event instanceof NavigationEnd))
-      .subscribe((test) => {
-        this.currentRoute = this.router.url.toString().substring(1);
-        // this.initializeTheme();
-      });
-
-    this.tokenStorageService
-      .onChangeHasToken()
-      .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe(() => {
-        this.isLoggedIn = !!this.tokenStorageService.getToken();
-
-        if (this.isLoggedIn) {
-          this.dataService.fetchUser().subscribe((user) => {
-            this.user = user;
-
-            this.canCreateAccount = hasPermission(
-              this.user.permissions,
-              permissions.createAccount
-            );
-
-            this.cd.markForCheck();
-          });
-        } else {
-          this.user = null;
-        }
+        const urlTree = this.router.parseUrl(this.router.url);
+        const urlSegmentGroup = urlTree.root.children[PRIMARY_OUTLET];
+        const urlSegments = urlSegmentGroup.segments;
+        this.currentRoute = urlSegments[0].path;
       });
+
+    this.userService.stateChanged
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe((state) => {
+        this.user = state.user;
+
+        this.canCreateAccount = hasPermission(
+          this.user?.permissions,
+          permissions.createUserAccount
+        );
+
+        this.changeDetectorRef.markForCheck();
+      });
+  }
+
+  public onCreateAccount() {
+    this.tokenStorageService.signOut();
+  }
+
+  public onSignOut() {
+    this.tokenStorageService.signOut();
+    this.userService.remove();
+
+    window.location.reload();
+  }
+
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
   }
 
   private initializeTheme() {
@@ -97,14 +107,4 @@ export class AppComponent implements OnDestroy, OnInit {
     this.materialCssVarsService.setPrimaryColor(primaryColorHex);
     this.materialCssVarsService.setAccentColor(secondaryColorHex);
   }
-
-  public onCreateAccount() {
-    this.tokenStorageService.signOut();
-    window.location.reload();
-  }
-
-  public ngOnDestroy() {
-    this.unsubscribeSubject.next();
-    this.unsubscribeSubject.complete();
-  }
 }

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

@@ -2,6 +2,7 @@ import { Platform } from '@angular/cdk/platform';
 import { HttpClientModule } from '@angular/common/http';
 import { NgModule } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
+import { MatCardModule } from '@angular/material/card';
 import {
   DateAdapter,
   MAT_DATE_FORMATS,
@@ -22,7 +23,7 @@ import { AppComponent } from './app.component';
 import { GfHeaderModule } from './components/header/header.module';
 import { authInterceptorProviders } from './core/auth.interceptor';
 import { httpResponseInterceptorProviders } from './core/http-response.interceptor';
-import { LanguageManager } from './core/language-manager.service';
+import { LanguageService } from './core/language.service';
 
 @NgModule({
   declarations: [AppComponent],
@@ -34,6 +35,7 @@ import { LanguageManager } from './core/language-manager.service';
     HttpClientModule,
     MarkdownModule.forRoot(),
     MatButtonModule,
+    MatCardModule,
     MaterialCssVarsModule.forRoot({
       darkThemeClass: 'is-dark-theme',
       isAutoContrast: true,
@@ -46,11 +48,11 @@ import { LanguageManager } from './core/language-manager.service';
   providers: [
     authInterceptorProviders,
     httpResponseInterceptorProviders,
-    LanguageManager,
+    LanguageService,
     {
       provide: DateAdapter,
       useClass: CustomDateAdapter,
-      deps: [LanguageManager, MAT_DATE_LOCALE, Platform]
+      deps: [LanguageService, MAT_DATE_LOCALE, Platform]
     },
     { provide: MAT_DATE_FORMATS, useValue: DateFormats }
   ],

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

@@ -1,14 +1,14 @@
-<table mat-table [dataSource]="dataSource" class="w-100">
+<table class="gf-table w-100" mat-table [dataSource]="dataSource">
   <ng-container matColumnDef="granteeAlias">
-    <th mat-header-cell *matHeaderCellDef i18n>User</th>
-    <td mat-cell *matCellDef="let element">
+    <th *matHeaderCellDef class="px-1" i18n mat-header-cell>User</th>
+    <td *matCellDef="let element" class="px-1" mat-cell>
       {{ element.granteeAlias }}
     </td></ng-container
   >
 
   <ng-container matColumnDef="type">
-    <th mat-header-cell *matHeaderCellDef i18n>Type</th>
-    <td mat-cell *matCellDef="let element">
+    <th *matHeaderCellDef class="px-1" i18n mat-header-cell>Type</th>
+    <td *matCellDef="let element" class="px-1" mat-cell>
       <ion-icon class="mr-1" name="lock-closed-outline"></ion-icon>
       Restricted Access
     </td></ng-container

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

@@ -1,3 +1,5 @@
+@import '~apps/client/src/styles/ghostfolio-style';
+
 :host {
   display: block;
 }

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

@@ -6,7 +6,7 @@ import {
   OnInit
 } from '@angular/core';
 import { MatTableDataSource } from '@angular/material/table';
-import { Access } from '@ghostfolio/api/app/access/interfaces/access.interface';
+import { Access } from '@ghostfolio/common/interfaces';
 
 @Component({
   selector: 'gf-access-table',

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

@@ -0,0 +1,77 @@
+<table class="gf-table w-100" mat-table [dataSource]="dataSource">
+  <ng-container matColumnDef="account">
+    <th *matHeaderCellDef class="px-1" i18n mat-header-cell>Name</th>
+    <td *matCellDef="let element" class="px-1" mat-cell>
+      {{ element.name }}
+      <span
+        *ngIf="element.isDefault"
+        class="d-lg-inline-block d-none text-muted"
+        >(Default)</span
+      >
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="platform">
+    <th *matHeaderCellDef class="px-1" i18n mat-header-cell>Platform</th>
+    <td *matCellDef="let element" class="px-1" mat-cell>
+      <div class="d-flex">
+        <gf-symbol-icon
+          *ngIf="element.Platform?.url"
+          class="mr-1"
+          [tooltip]=""
+          [url]="element.Platform?.url"
+        ></gf-symbol-icon>
+        <span>{{ element.Platform?.name }}</span>
+      </div>
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="actions">
+    <th *matHeaderCellDef class="px-1 text-center" i18n mat-header-cell></th>
+    <td *matCellDef="let element" class="px-1 text-center" mat-cell>
+      <button
+        class="mx-1 no-min-width px-2"
+        mat-button
+        [matMenuTriggerFor]="accountMenu"
+        (click)="$event.stopPropagation()"
+      >
+        <ion-icon name="ellipsis-vertical"></ion-icon>
+      </button>
+      <mat-menu #accountMenu="matMenu" xPosition="before">
+        <button i18n mat-menu-item (click)="onUpdateAccount(element)">
+          Edit
+        </button>
+        <button
+          i18n
+          mat-menu-item
+          [disabled]="element.isDefault || element.Order?.length > 0"
+          (click)="onDeleteAccount(element.id)"
+        >
+          Delete
+        </button>
+      </mat-menu>
+    </td>
+  </ng-container>
+
+  <ng-container matColumnDef="transactions">
+    <th *matHeaderCellDef class="text-right" i18n mat-header-cell>
+      Transactions
+    </th>
+    <td *matCellDef="let element" class="text-right" mat-cell>
+      {{ element.Order?.length }}
+    </td>
+  </ng-container>
+
+  <tr *matHeaderRowDef="displayedColumns" mat-header-row></tr>
+  <tr *matRowDef="let row; columns: displayedColumns" mat-row></tr>
+</table>
+
+<ngx-skeleton-loader
+  *ngIf="isLoading"
+  animation="pulse"
+  class="px-4 py-3"
+  [theme]="{
+    height: '1.5rem',
+    width: '100%'
+  }"
+></ngx-skeleton-loader>

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

@@ -0,0 +1,27 @@
+@import '~apps/client/src/styles/ghostfolio-style';
+
+:host {
+  display: block;
+
+  ::ng-deep {
+    .mat-form-field-infix {
+      border-top: 0 solid transparent !important;
+    }
+  }
+
+  .mat-table {
+    th {
+      ::ng-deep {
+        .mat-sort-header-container {
+          justify-content: inherit;
+        }
+      }
+    }
+  }
+}
+
+:host-context(.is-dark-theme) {
+  .mat-form-field {
+    color: rgba(var(--light-primary-text));
+  }
+}

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

@@ -0,0 +1,74 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  OnChanges,
+  OnDestroy,
+  OnInit,
+  Output
+} from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { Account as AccountModel } from '@prisma/client';
+import { Subject, Subscription } from 'rxjs';
+
+@Component({
+  selector: 'gf-accounts-table',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  templateUrl: './accounts-table.component.html',
+  styleUrls: ['./accounts-table.component.scss']
+})
+export class AccountsTableComponent implements OnChanges, OnDestroy, OnInit {
+  @Input() accounts: AccountModel[];
+  @Input() baseCurrency: string;
+  @Input() deviceType: string;
+  @Input() locale: string;
+  @Input() showActions: boolean;
+
+  @Output() accountDeleted = new EventEmitter<string>();
+  @Output() accountToUpdate = new EventEmitter<AccountModel>();
+
+  public dataSource: MatTableDataSource<AccountModel> = new MatTableDataSource();
+  public displayedColumns = [];
+  public isLoading = true;
+  public routeQueryParams: Subscription;
+
+  private unsubscribeSubject = new Subject<void>();
+
+  public constructor() {}
+
+  public ngOnInit() {}
+
+  public ngOnChanges() {
+    this.displayedColumns = ['account', 'platform', 'transactions'];
+
+    if (this.showActions) {
+      this.displayedColumns.push('actions');
+    }
+
+    this.isLoading = true;
+
+    if (this.accounts) {
+      this.dataSource = new MatTableDataSource(this.accounts);
+
+      this.isLoading = false;
+    }
+  }
+
+  public onDeleteAccount(aId: string) {
+    const confirmation = confirm('Do you really want to delete this account?');
+
+    if (confirmation) {
+      this.accountDeleted.emit(aId);
+    }
+  }
+
+  public onUpdateAccount(aAccount: AccountModel) {
+    this.accountToUpdate.emit(aAccount);
+  }
+
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
+  }
+}

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

@@ -0,0 +1,31 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { MatInputModule } from '@angular/material/input';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatTableModule } from '@angular/material/table';
+import { RouterModule } from '@angular/router';
+import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
+
+import { GfSymbolIconModule } from '../symbol-icon/symbol-icon.module';
+import { GfValueModule } from '../value/value.module';
+import { AccountsTableComponent } from './accounts-table.component';
+
+@NgModule({
+  declarations: [AccountsTableComponent],
+  exports: [AccountsTableComponent],
+  imports: [
+    CommonModule,
+    GfSymbolIconModule,
+    GfValueModule,
+    MatButtonModule,
+    MatInputModule,
+    MatMenuModule,
+    MatTableModule,
+    NgxSkeletonLoaderModule,
+    RouterModule
+  ],
+  providers: [],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
+})
+export class GfAccountsTableModule {}

apps/client/src/app/components/fear-and-greed-index/fear-and-greed-index.component.ts

@@ -5,7 +5,7 @@ import {
   OnChanges,
   OnInit
 } from '@angular/core';
-import { resolveFearAndGreedIndex } from '@ghostfolio/helper';
+import { resolveFearAndGreedIndex } from '@ghostfolio/common/helper';
 
 @Component({
   selector: 'gf-fear-and-greed-index',

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

@@ -6,59 +6,100 @@
     <span class="spacer"></span>
     <a
       class="d-none d-sm-block"
-      [routerLink]="['/']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'home' ? 'primary' : null"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'home' || currentRoute === 'zen',
+        'text-decoration-underline':
+          currentRoute === 'home' || currentRoute === 'zen'
+      }"
+      [routerLink]="['/']"
       >Overview</a
     >
     <a
+      *ngIf="user?.settings?.viewMode === 'DEFAULT'"
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/analysis']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'analysis' ? 'primary' : null"
-      >Analysis</a
+      [ngClass]="{
+        'font-weight-bold':
+          currentRoute === 'analysis' ||
+          currentRoute === 'report' ||
+          currentRoute === 'tools',
+        'text-decoration-underline':
+          currentRoute === 'analysis' ||
+          currentRoute === 'report' ||
+          currentRoute === 'tools'
+      }"
+      [routerLink]="['/tools']"
+      >Tools</a
     >
     <a
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/report']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'report' ? 'primary' : null"
-      >X-ray</a
-    >
-    <a
-      class="d-none d-sm-block mx-1"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'transactions',
+        'text-decoration-underline': currentRoute === 'transactions'
+      }"
       [routerLink]="['/transactions']"
+      >Transactions</a
+    >
+    <a
+      class="d-none d-sm-block mx-1"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'transactions' ? 'primary' : null"
-      >Transactions</a
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'accounts',
+        'text-decoration-underline': currentRoute === 'accounts'
+      }"
+      [routerLink]="['/accounts']"
+      >Accounts</a
     >
     <a
       *ngIf="hasPermissionToAccessAdminControl"
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/admin']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'admin' ? 'primary' : null"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'admin',
+        'text-decoration-underline': currentRoute === 'admin'
+      }"
+      [routerLink]="['/admin']"
       >Admin Control</a
     >
     <a
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/resources']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'resources' ? 'primary' : null"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'resources',
+        'text-decoration-underline': currentRoute === 'resources'
+      }"
+      [routerLink]="['/resources']"
       >Resources</a
     >
     <a
+      *ngIf="hasPermissionForSubscription"
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/about']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'about' ? 'primary' : null"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'pricing',
+        'text-decoration-underline': currentRoute === 'pricing'
+      }"
+      [routerLink]="['/pricing']"
+      >Pricing</a
+    >
+    <a
+      class="d-none d-sm-block mx-1"
+      i18n
+      mat-flat-button
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'about',
+        'text-decoration-underline': currentRoute === 'about'
+      }"
+      [routerLink]="['/about']"
       >About</a
     >
     <button
@@ -118,61 +159,80 @@
         <hr class="m-0" />
       </ng-container>
       <a
+        *ngIf="user?.settings?.viewMode === 'DEFAULT'"
         class="d-block d-sm-none"
-        [routerLink]="['/analysis']"
         i18n
         mat-menu-item
-        [ngClass]="{ 'font-weight-bold': currentRoute === 'analysis' }"
-        >Analysis</a
+        [ngClass]="{
+          'font-weight-bold':
+            currentRoute === 'analysis' ||
+            currentRoute === 'report' ||
+            currentRoute === 'tools'
+        }"
+        [routerLink]="['/tools']"
+        >Tools</a
       >
       <a
         class="d-block d-sm-none"
-        [routerLink]="['/report']"
         i18n
         mat-menu-item
-        [ngClass]="{ 'font-weight-bold': currentRoute === 'report' }"
-        >X-ray</a
-      >
-      <a
-        class="d-block d-sm-none"
+        [ngClass]="{
+          'font-weight-bold': currentRoute === 'transactions'
+        }"
         [routerLink]="['/transactions']"
-        i18n
-        mat-menu-item
-        [ngClass]="{ 'font-weight-bold': currentRoute === 'transactions' }"
         >Transactions</a
       >
+      <a
+        class="d-block d-sm-none"
+        i18n
+        mat-menu-item
+        [ngClass]="{ 'font-weight-bold': currentRoute === 'accounts' }"
+        [routerLink]="['/accounts']"
+        >Accounts</a
+      >
       <a
         class="align-items-center d-flex"
-        [routerLink]="['/account']"
         i18n
         mat-menu-item
         [ngClass]="{ 'font-weight-bold': currentRoute === 'account' }"
-        >Account</a
+        [routerLink]="['/account']"
+        >My Ghostfolio</a
       >
       <a
         *ngIf="hasPermissionToAccessAdminControl"
         class="d-block d-sm-none"
-        [routerLink]="['/admin']"
         i18n
         mat-menu-item
         [ngClass]="{ 'font-weight-bold': currentRoute === 'admin' }"
+        [routerLink]="['/admin']"
         >Admin Control</a
       >
       <hr class="m-0" />
       <a
         class="d-block d-sm-none"
-        [routerLink]="['/resources']"
         i18n
         mat-menu-item
-        [ngClass]="{ 'font-weight-bold': currentRoute === 'resources' }"
+        [ngClass]="{
+          'font-weight-bold': currentRoute === 'resources'
+        }"
+        [routerLink]="['/resources']"
         >Resources</a
       >
+      <a
+        *ngIf="hasPermissionForSubscription"
+        class="d-block d-sm-none"
+        i18n
+        mat-menu-item
+        [ngClass]="{ 'font-weight-bold': currentRoute === 'pricing' }"
+        [routerLink]="['/pricing']"
+        >Pricing</a
+      >
       <a
         class="d-block d-sm-none"
-        [routerLink]="['/about']"
         i18n
         mat-menu-item
         [ngClass]="{ 'font-weight-bold': currentRoute === 'about' }"
+        [routerLink]="['/about']"
         >About Ghostfolio</a
       >
       <hr class="d-block d-sm-none m-0" />
@@ -182,27 +242,51 @@
   <ng-container *ngIf="user === null">
     <a
       *ngIf="currentRoute && currentRoute !== 'start'"
-      [routerLink]="['/']"
       class="mx-2 no-min-width px-2"
       mat-button
+      [routerLink]="['/']"
     >
       <gf-logo></gf-logo>
     </a>
     <span class="spacer"></span>
     <a
       class="d-none d-sm-block mx-1"
-      [routerLink]="['/about']"
       i18n
       mat-flat-button
-      [color]="currentRoute === 'about' ? 'primary' : null"
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'about',
+        'text-decoration-underline': currentRoute === 'about'
+      }"
+      [routerLink]="['/about']"
       >About</a
     >
     <a
-      class="d-none d-sm-block mx-1"
+      *ngIf="hasPermissionForSubscription"
+      i18n
+      mat-flat-button
+      [ngClass]="{
+        'font-weight-bold': currentRoute === 'pricing',
+        'text-decoration-underline': currentRoute === 'pricing'
+      }"
+      [routerLink]="['/pricing']"
+      >Pricing</a
+    >
+    <a
+      class="d-none d-sm-block mx-1 no-min-width px-1"
       href="https://github.com/ghostfolio/ghostfolio"
       mat-flat-button
-      >GitHub</a
-    >
-    <button i18n mat-flat-button (click)="openLoginDialog()">Sign in</button>
+      ><ion-icon name="logo-github"></ion-icon
+    ></a>
+    <button class="mx-1" i18n mat-flat-button (click)="openLoginDialog()">
+      Sign In
+    </button>
+    <a
+      class="d-none d-sm-block"
+      color="primary"
+      i18n
+      mat-flat-button
+      [routerLink]="['/register']"
+      >Get Started
+    </a>
   </ng-container>
 </mat-toolbar>

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

@@ -1,18 +1,23 @@
 import {
   ChangeDetectionStrategy,
   Component,
+  EventEmitter,
   Input,
-  OnChanges
+  OnChanges,
+  Output
 } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { Router } from '@angular/router';
-import { InfoItem } from '@ghostfolio/api/app/info/interfaces/info-item.interface';
-import { User } from '@ghostfolio/api/app/user/interfaces/user.interface';
-import { LoginWithAccessTokenDialog } from '@ghostfolio/client/pages/login/login-with-access-token-dialog/login-with-access-token-dialog.component';
+import { LoginWithAccessTokenDialog } from '@ghostfolio/client/components/login-with-access-token-dialog/login-with-access-token-dialog.component';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
+import {
+  STAY_SIGNED_IN,
+  SettingsStorageService
+} from '@ghostfolio/client/services/settings-storage.service';
 import { TokenStorageService } from '@ghostfolio/client/services/token-storage.service';
-import { hasPermission, permissions } from '@ghostfolio/helper';
+import { InfoItem, User } from '@ghostfolio/common/interfaces';
+import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { EMPTY, Subject } from 'rxjs';
 import { catchError, takeUntil } from 'rxjs/operators';
 
@@ -27,8 +32,11 @@ export class HeaderComponent implements OnChanges {
   @Input() info: InfoItem;
   @Input() user: User;
 
-  public hasPermissionToAccessAdminControl: boolean;
+  @Output() signOut = new EventEmitter<void>();
+
   public hasPermissionForSocialLogin: boolean;
+  public hasPermissionForSubscription: boolean;
+  public hasPermissionToAccessAdminControl: boolean;
   public impersonationId: string;
 
   private unsubscribeSubject = new Subject<void>();
@@ -38,6 +46,7 @@ export class HeaderComponent implements OnChanges {
     private dialog: MatDialog,
     private impersonationStorageService: ImpersonationStorageService,
     private router: Router,
+    private settingsStorageService: SettingsStorageService,
     private tokenStorageService: TokenStorageService
   ) {
     this.impersonationStorageService
@@ -48,17 +57,20 @@ export class HeaderComponent implements OnChanges {
   }
 
   public ngOnChanges() {
-    if (this.user) {
-      this.hasPermissionToAccessAdminControl = hasPermission(
-        this.user.permissions,
-        permissions.accessAdminControl
-      );
-    }
-
     this.hasPermissionForSocialLogin = hasPermission(
       this.info?.globalPermissions,
       permissions.enableSocialLogin
     );
+
+    this.hasPermissionForSubscription = hasPermission(
+      this.info?.globalPermissions,
+      permissions.enableSubscription
+    );
+
+    this.hasPermissionToAccessAdminControl = hasPermission(
+      this.user?.permissions,
+      permissions.accessAdminControl
+    );
   }
 
   public impersonateAccount(aId: string) {
@@ -72,8 +84,7 @@ export class HeaderComponent implements OnChanges {
   }
 
   public onSignOut() {
-    this.tokenStorageService.signOut();
-    window.location.reload();
+    this.signOut.next();
   }
 
   public openLoginDialog(): void {
@@ -81,7 +92,8 @@ export class HeaderComponent implements OnChanges {
       autoFocus: false,
       data: {
         accessToken: '',
-        hasPermissionToUseSocialLogin: this.hasPermissionForSocialLogin
+        hasPermissionToUseSocialLogin: this.hasPermissionForSocialLogin,
+        title: 'Sign in'
       },
       width: '30rem'
     });
@@ -106,7 +118,10 @@ export class HeaderComponent implements OnChanges {
   }
 
   public setToken(aToken: string) {
-    this.tokenStorageService.saveToken(aToken);
+    this.tokenStorageService.saveToken(
+      aToken,
+      this.settingsStorageService.getSetting(STAY_SIGNED_IN) === 'true'
+    );
 
     this.router.navigate(['/']);
   }

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

@@ -4,7 +4,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { RouterModule } from '@angular/router';
-import { LoginWithAccessTokenDialogModule } from '@ghostfolio/client/pages/login/login-with-access-token-dialog/login-with-access-token-dialog.module';
+import { LoginWithAccessTokenDialogModule } from '@ghostfolio/client/components/login-with-access-token-dialog/login-with-access-token-dialog.module';
 
 import { GfLogoModule } from '../logo/logo.module';
 import { HeaderComponent } from './header.component';

apps/client/src/app/components/investment-chart/investment-chart.component.ts

@@ -9,8 +9,8 @@ import {
   OnInit,
   ViewChild
 } from '@angular/core';
-import { PortfolioItem } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-item.interface';
-import { primaryColorRgb } from '@ghostfolio/helper';
+import { primaryColorRgb } from '@ghostfolio/common/config';
+import { PortfolioItem } from '@ghostfolio/common/interfaces';
 import {
   LineController,
   LineElement,
@@ -36,10 +36,10 @@ export class InvestmentChartComponent implements OnChanges, OnDestroy, OnInit {
 
   public constructor() {
     Chart.register(
+      LinearScale,
       LineController,
       LineElement,
       PointElement,
-      LinearScale,
       TimeScale
     );
   }
@@ -95,7 +95,7 @@ export class InvestmentChartComponent implements OnChanges, OnDestroy, OnInit {
             responsive: true,
             scales: {
               x: {
-                display: false,
+                display: true,
                 grid: {
                   display: false
                 },

apps/client/src/app/components/line-chart/line-chart.component.ts

@@ -9,7 +9,8 @@ import {
   OnInit,
   ViewChild
 } from '@angular/core';
-import { primaryColorRgb, secondaryColorRgb } from '@ghostfolio/helper';
+import { primaryColorRgb, secondaryColorRgb } from '@ghostfolio/common/config';
+import { getBackgroundColor } from '@ghostfolio/common/helper';
 import {
   Chart,
   Filler,
@@ -62,6 +63,10 @@ export class LineChartComponent implements OnChanges, OnDestroy, OnInit {
     }
   }
 
+  public ngOnDestroy() {
+    this.chart?.destroy();
+  }
+
   private initialize() {
     this.isLoading = true;
     const benchmarkPrices = [];
@@ -76,7 +81,7 @@ export class LineChartComponent implements OnChanges, OnDestroy, OnInit {
 
     const canvas = document.getElementById('chartCanvas');
 
-    var gradient = this.chartCanvas?.nativeElement
+    const gradient = this.chartCanvas?.nativeElement
       ?.getContext('2d')
       .createLinearGradient(
         0,
@@ -88,14 +93,7 @@ export class LineChartComponent implements OnChanges, OnDestroy, OnInit {
       0,
       `rgba(${primaryColorRgb.r}, ${primaryColorRgb.g}, ${primaryColorRgb.b}, 0.01)`
     );
-    gradient.addColorStop(
-      1,
-      getComputedStyle(document.documentElement).getPropertyValue(
-        window.matchMedia('(prefers-color-scheme: dark)').matches
-          ? '--dark-background'
-          : '--light-background'
-      )
-    );
+    gradient.addColorStop(1, getBackgroundColor());
 
     const data = {
       labels,
@@ -181,8 +179,4 @@ export class LineChartComponent implements OnChanges, OnDestroy, OnInit {
 
     this.isLoading = false;
   }
-
-  public ngOnDestroy() {
-    this.chart?.destroy();
-  }
 }

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

@@ -0,0 +1,34 @@
+import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+import {
+  STAY_SIGNED_IN,
+  SettingsStorageService
+} from '@ghostfolio/client/services/settings-storage.service';
+
+@Component({
+  selector: 'gf-login-with-access-token-dialog',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  styleUrls: ['./login-with-access-token-dialog.scss'],
+  templateUrl: 'login-with-access-token-dialog.html'
+})
+export class LoginWithAccessTokenDialog {
+  public constructor(
+    @Inject(MAT_DIALOG_DATA) public data: any,
+    public dialogRef: MatDialogRef<LoginWithAccessTokenDialog>,
+    private settingsStorageService: SettingsStorageService
+  ) {}
+
+  ngOnInit() {}
+
+  public onChangeStaySignedIn(aValue: MatCheckboxChange) {
+    this.settingsStorageService.setSetting(
+      STAY_SIGNED_IN,
+      aValue.checked?.toString()
+    );
+  }
+
+  public onClose() {
+    this.dialogRef.close();
+  }
+}

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

@@ -1,4 +1,9 @@
-<h1 mat-dialog-title i18n>Sign in</h1>
+<gf-dialog-header
+  mat-dialog-title
+  [title]="data.title"
+  (closeButtonClicked)="onClose()"
+></gf-dialog-header>
+
 <div mat-dialog-content>
   <div>
     <ng-container *ngIf="data.hasPermissionToUseSocialLogin">
@@ -21,15 +26,21 @@
     </mat-form-field>
   </div>
 </div>
-<div class="float-right" mat-dialog-actions>
-  <button i18n mat-flat-button [mat-dialog-close]="undefined">Cancel</button>
-  <button
-    color="primary"
-    i18n
-    mat-flat-button
-    [disabled]="!data.accessToken"
-    [mat-dialog-close]="data"
-  >
-    Sign in
-  </button>
+<div mat-dialog-actions>
+  <div class="flex-grow-1">
+    <mat-checkbox i18n (change)="onChangeStaySignedIn($event)"
+      >Stay signed in</mat-checkbox
+    >
+  </div>
+  <div>
+    <button
+      color="primary"
+      i18n
+      mat-flat-button
+      [disabled]="!data.accessToken"
+      [mat-dialog-close]="data"
+    >
+      Sign in
+    </button>
+  </div>
 </div>

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

@@ -3,10 +3,12 @@ import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 
+import { GfDialogHeaderModule } from '../dialog-header/dialog-header.module';
 import { LoginWithAccessTokenDialog } from './login-with-access-token-dialog.component';
 
 @NgModule({
@@ -15,7 +17,9 @@ import { LoginWithAccessTokenDialog } from './login-with-access-token-dialog.com
   imports: [
     CommonModule,
     FormsModule,
+    GfDialogHeaderModule,
     MatButtonModule,
+    MatCheckboxModule,
     MatDialogModule,
     MatFormFieldModule,
     MatInputModule,

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

@@ -0,0 +1,15 @@
+:host {
+  display: block;
+
+  textarea.mat-input-element.cdk-textarea-autosize {
+    box-sizing: content-box;
+  }
+
+  .mat-checkbox {
+    ::ng-deep {
+      label {
+        margin-bottom: 0;
+      }
+    }
+  }
+}

apps/client/src/app/components/performance-chart-dialog/performance-chart-dialog.component.ts

@@ -28,7 +28,7 @@ export class PerformanceChartDialog {
   public title: string;
 
   public constructor(
-    private cd: ChangeDetectorRef,
+    private changeDetectorRef: ChangeDetectorRef,
     private dataService: DataService,
     public dialogRef: MatDialogRef<PerformanceChartDialog>,
     @Inject(MAT_DIALOG_DATA) public data: PositionDetailDialogParams
@@ -46,7 +46,7 @@ export class PerformanceChartDialog {
 
         this.historicalDataItems = this.data.historicalDataItems;
 
-        this.historicalDataItems.forEach((historicalDataItem) => {
+        this.historicalDataItems?.forEach((historicalDataItem) => {
           const benchmarkItem = historicalData.find((item) => {
             return item.date === historicalDataItem.date;
           });
@@ -75,7 +75,7 @@ export class PerformanceChartDialog {
           }
         });
 
-        this.cd.markForCheck();
+        this.changeDetectorRef.markForCheck();
       });
 
     this.title = `Performance vs. ${this.benchmarkLabel}`;

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

@@ -5,7 +5,7 @@ import {
   OnChanges,
   OnInit
 } from '@angular/core';
-import { PortfolioOverview } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-overview.interface';
+import { PortfolioOverview } from '@ghostfolio/common/interfaces';
 import { Currency } from '@prisma/client';
 
 @Component({

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

@@ -7,7 +7,7 @@ import {
   OnInit,
   ViewChild
 } from '@angular/core';
-import { PortfolioPerformance } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-performance.interface';
+import { PortfolioPerformance } from '@ghostfolio/common/interfaces';
 import { Currency } from '@prisma/client';
 import { CountUp } from 'countup.js';
 import { isNumber } from 'lodash';

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

@@ -4,7 +4,7 @@ import {
   Input,
   OnInit
 } from '@angular/core';
-import { PortfolioPerformance } from '@ghostfolio/api/app/portfolio/interfaces/portfolio-performance.interface';
+import { PortfolioPerformance } from '@ghostfolio/common/interfaces';
 import { Currency } from '@prisma/client';
 
 @Component({