Release 2.29.0 (#2733 )

Feature/introduce lazy loaded activities table (#2729 )
* Introduce lazy-loaded activities table * Add icon column * Emit paginator event * Add pagination logic * Integrate total items * Update changelog
2023-12-09 17:14:13 +01:00 · 2023-12-09 17:12:09 +01:00 · 2023-12-08 19:59:06 +01:00 · 2023-12-07 14:13:28 +01:00 · 2023-12-06 18:35:03 +01:00 · 2023-12-05 18:16:03 +01:00
42 changed files with 12907 additions and 8032 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -5,6 +5,26 @@ 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).

+## 2.29.0 - 2023-12-09
+
+### Added
+
+- Introduced a lazy-loaded activities table on the portfolio activities page (experimental)
+
+### Changed
+
+- Set the actions columns of various tables to stick at the end
+- Increased the height of the tabs on mobile
+- Improved the language localization for German (`de`)
+- Improved the language localization for Türkçe (`tr`)
+- Upgraded `marked` from version `4.2.12` to `9.1.6`
+- Upgraded `ngx-markdown` from version `15.1.0` to `17.1.1`
+- Upgraded `ng-extract-i18n-merge` from version `2.8.3` to `2.9.0`
+
+### Fixed
+
+- Fixed an issue in the biometric authentication registration
+
 ## 2.28.0 - 2023-12-02

 ### Added
--- a/apps/api/src/app/access/access.controller.ts
+++ b/apps/api/src/app/access/access.controller.ts
@ -17,7 +17,6 @@ import { AuthGuard } from '@nestjs/passport';
 import { Access as AccessModel } from '@prisma/client';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';

-import { AccessModule } from './access.module';
 import { AccessService } from './access.service';
 import { CreateAccessDto } from './create-access.dto';

@ -83,7 +82,7 @@ export class AccessController {

  @Delete(':id')
  @UseGuards(AuthGuard('jwt'))
-  public async deleteAccess(@Param('id') id: string): Promise<AccessModule> {
+  public async deleteAccess(@Param('id') id: string): Promise<AccessModel> {
    const access = await this.accessService.access({ id });

    if (
--- a/apps/api/src/app/order/interfaces/activities.interface.ts
+++ b/apps/api/src/app/order/interfaces/activities.interface.ts
@ -2,6 +2,7 @@ import { OrderWithAccount } from '@ghostfolio/common/types';

 export interface Activities {
  activities: Activity[];
+  count: number;
 }

 export interface Activity extends OrderWithAccount {
--- a/apps/api/src/app/order/order.controller.ts
+++ b/apps/api/src/app/order/order.controller.ts
@ -24,7 +24,7 @@ import {
 } from '@nestjs/common';
 import { REQUEST } from '@nestjs/core';
 import { AuthGuard } from '@nestjs/passport';
-import { Order as OrderModel } from '@prisma/client';
+import { Order as OrderModel, Prisma } from '@prisma/client';
 import { parseISO } from 'date-fns';
 import { StatusCodes, getReasonPhrase } from 'http-status-codes';

@ -90,6 +90,8 @@ export class OrderController {
    @Query('accounts') filterByAccounts?: string,
    @Query('assetClasses') filterByAssetClasses?: string,
    @Query('skip') skip?: number,
+    @Query('sortColumn') sortColumn?: string,
+    @Query('sortDirection') sortDirection?: Prisma.SortOrder,
    @Query('tags') filterByTags?: string,
    @Query('take') take?: number
  ): Promise<Activities> {
@ -103,8 +105,10 @@ export class OrderController {
      await this.impersonationService.validateImpersonationId(impersonationId);
    const userCurrency = this.request.user.Settings.settings.baseCurrency;

-    const activities = await this.orderService.getOrders({
+    const { activities, count } = await this.orderService.getOrders({
      filters,
+      sortColumn,
+      sortDirection,
      userCurrency,
      includeDrafts: true,
      skip: isNaN(skip) ? undefined : skip,
@ -113,7 +117,7 @@ export class OrderController {
      withExcludedAccounts: true
    });

-    return { activities };
+    return { activities, count };
  }

  @Post()
--- a/apps/api/src/app/order/order.service.ts
+++ b/apps/api/src/app/order/order.service.ts
@ -25,7 +25,7 @@ import { endOfToday, isAfter } from 'date-fns';
 import { groupBy } from 'lodash';
 import { v4 as uuidv4 } from 'uuid';

-import { Activity } from './interfaces/activities.interface';
+import { Activities, Activity } from './interfaces/activities.interface';

@Injectable()
 export class OrderService {
@ -51,7 +51,7 @@ export class OrderService {
    take?: number;
    cursor?: Prisma.OrderWhereUniqueInput;
    where?: Prisma.OrderWhereInput;
-    orderBy?: Prisma.OrderOrderByWithRelationInput;
+    orderBy?: Prisma.Enumerable<Prisma.OrderOrderByWithRelationInput>;
  }): Promise<OrderWithAccount[]> {
    const { include, skip, take, cursor, where, orderBy } = params;

@ -231,6 +231,8 @@ export class OrderService {
    filters,
    includeDrafts = false,
    skip,
+    sortColumn,
+    sortDirection,
    take = Number.MAX_SAFE_INTEGER,
    types,
    userCurrency,
@ -240,12 +242,17 @@ export class OrderService {
    filters?: Filter[];
    includeDrafts?: boolean;
    skip?: number;
+    sortColumn?: string;
+    sortDirection?: Prisma.SortOrder;
    take?: number;
    types?: TypeOfOrder[];
    userCurrency: string;
    userId: string;
    withExcludedAccounts?: boolean;
-  }): Promise<Activity[]> {
+  }): Promise<Activities> {
+    let orderBy: Prisma.Enumerable<Prisma.OrderOrderByWithRelationInput> = [
+      { date: 'asc' }
+    ];
    const where: Prisma.OrderWhereInput = { userId };

    const {
@ -307,6 +314,10 @@ export class OrderService {
      };
    }

+    if (sortColumn) {
+      orderBy = [{ [sortColumn]: sortDirection }];
+    }
+
    if (types) {
      where.OR = types.map((type) => {
        return {
@ -317,8 +328,9 @@ export class OrderService {
      });
    }

-    return (
-      await this.orders({
+    const [orders, count] = await Promise.all([
+      this.orders({
+        orderBy,
        skip,
        take,
        where,
@ -332,10 +344,12 @@ export class OrderService {
          // eslint-disable-next-line @typescript-eslint/naming-convention
          SymbolProfile: true,
          tags: true
-        },
-        orderBy: { date: 'asc' }
-      })
-    )
+        }
+      }),
+      this.prismaService.order.count({ where })
+    ]);
+
+    const activities = orders
      .filter((order) => {
        return (
          withExcludedAccounts ||
@ -361,6 +375,8 @@ export class OrderService {
          )
        };
      });
+
+    return { activities, count };
  }

  public async updateOrder({
--- a/apps/api/src/app/portfolio/portfolio.service.ts
+++ b/apps/api/src/app/portfolio/portfolio.service.ts
@ -225,7 +225,7 @@ export class PortfolioService {
  }): Promise<InvestmentItem[]> {
    const userId = await this.getUserId(impersonationId, this.request.user.id);

-    const activities = await this.orderService.getOrders({
+    const { activities } = await this.orderService.getOrders({
      filters,
      userId,
      types: ['DIVIDEND'],
@ -679,13 +679,13 @@ export class PortfolioService {
    const user = await this.userService.user({ id: userId });
    const userCurrency = this.getUserCurrency(user);

-    const orders = (
-      await this.orderService.getOrders({
-        userCurrency,
-        userId,
-        withExcludedAccounts: true
-      })
-    ).filter(({ SymbolProfile }) => {
+    const { activities } = await this.orderService.getOrders({
+      userCurrency,
+      userId,
+      withExcludedAccounts: true
+    });
+
+    const orders = activities.filter(({ SymbolProfile }) => {
      return (
        SymbolProfile.dataSource === aDataSource &&
        SymbolProfile.symbol === aSymbol
@ -1639,18 +1639,18 @@ export class PortfolioService {
      userId
    });

-    const activities = await this.orderService.getOrders({
+    const { activities } = await this.orderService.getOrders({
      userCurrency,
      userId
    });

-    const excludedActivities = (
-      await this.orderService.getOrders({
-        userCurrency,
-        userId,
-        withExcludedAccounts: true
-      })
-    ).filter(({ Account: account }) => {
+    let { activities: excludedActivities } = await this.orderService.getOrders({
+      userCurrency,
+      userId,
+      withExcludedAccounts: true
+    });
+
+    excludedActivities = excludedActivities.filter(({ Account: account }) => {
      return account?.isExcluded ?? false;
    });

@ -1830,7 +1830,7 @@ export class PortfolioService {
    const userCurrency =
      this.request.user?.Settings?.settings.baseCurrency ?? DEFAULT_CURRENCY;

-    const orders = await this.orderService.getOrders({
+    const { activities, count } = await this.orderService.getOrders({
      filters,
      includeDrafts,
      userCurrency,
@ -1839,11 +1839,11 @@ export class PortfolioService {
      types: ['BUY', 'SELL']
    });

-    if (orders.length <= 0) {
+    if (count <= 0) {
      return { transactionPoints: [], orders: [], portfolioOrders: [] };
    }

-    const portfolioOrders: PortfolioOrder[] = orders.map((order) => ({
+    const portfolioOrders: PortfolioOrder[] = activities.map((order) => ({
      currency: order.SymbolProfile.currency,
      dataSource: order.SymbolProfile.dataSource,
      date: format(order.date, DATE_FORMAT),
@ -1877,8 +1877,8 @@ export class PortfolioService {
    portfolioCalculator.computeTransactionPoints();

    return {
-      orders,
      portfolioOrders,
+      orders: activities,
      transactionPoints: portfolioCalculator.getTransactionPoints()
    };
  }
@ -1913,13 +1913,14 @@ export class PortfolioService {
    userId: string;
    withExcludedAccounts?: boolean;
  }) {
-    const ordersOfTypeItemOrLiability = await this.orderService.getOrders({
-      filters,
-      userCurrency,
-      userId,
-      withExcludedAccounts,
-      types: ['ITEM', 'LIABILITY']
-    });
+    const { activities: ordersOfTypeItemOrLiability } =
+      await this.orderService.getOrders({
+        filters,
+        userCurrency,
+        userId,
+        withExcludedAccounts,
+        types: ['ITEM', 'LIABILITY']
+      });

    const accounts: PortfolioDetails['accounts'] = {};
    const platforms: PortfolioDetails['platforms'] = {};
--- a/apps/client/src/app/components/access-table/access-table.component.html
+++ b/apps/client/src/app/components/access-table/access-table.component.html
@ -37,7 +37,7 @@
    </td>
  </ng-container>

-  <ng-container matColumnDef="actions">
+  <ng-container matColumnDef="actions" stickyEnd>
    <th *matHeaderCellDef class="px-1 text-center" mat-header-cell></th>

    <td *matCellDef="let element" class="px-1 text-center" mat-cell>
--- a/apps/client/src/app/components/accounts-table/accounts-table.component.html
+++ b/apps/client/src/app/components/accounts-table/accounts-table.component.html
@ -241,7 +241,7 @@
    ></td>
  </ng-container>

-  <ng-container matColumnDef="actions">
+  <ng-container matColumnDef="actions" stickyEnd>
    <th *matHeaderCellDef class="px-1 text-center" i18n mat-header-cell></th>
    <td *matCellDef="let element" class="px-1 text-center" mat-cell>
      <button
--- a/apps/client/src/app/components/admin-jobs/admin-jobs.html
+++ b/apps/client/src/app/components/admin-jobs/admin-jobs.html
@ -120,7 +120,7 @@
          </td>
        </ng-container>

-        <ng-container matColumnDef="actions">
+        <ng-container matColumnDef="actions" stickyEnd>
          <th *matHeaderCellDef class="px-1 py-2" mat-header-cell>
            <button
              class="mx-1 no-min-width px-2"
--- a/apps/client/src/app/components/admin-market-data/admin-market-data.html
+++ b/apps/client/src/app/components/admin-market-data/admin-market-data.html
@ -129,7 +129,7 @@
          </td>
        </ng-container>

-        <ng-container matColumnDef="actions">
+        <ng-container matColumnDef="actions" stickyEnd>
          <th *matHeaderCellDef class="px-1 text-center" mat-header-cell>
            <button
              class="mx-1 no-min-width px-2"
--- a/apps/client/src/app/components/admin-platform/admin-platform.component.html
+++ b/apps/client/src/app/components/admin-platform/admin-platform.component.html
@ -68,7 +68,7 @@
          </td>
        </ng-container>

-        <ng-container matColumnDef="actions">
+        <ng-container matColumnDef="actions" stickyEnd>
          <th
            *matHeaderCellDef
            class="px-1 text-center"
--- a/apps/client/src/app/components/admin-tag/admin-tag.component.html
+++ b/apps/client/src/app/components/admin-tag/admin-tag.component.html
@ -48,7 +48,7 @@
          </td>
        </ng-container>

-        <ng-container matColumnDef="actions">
+        <ng-container matColumnDef="actions" stickyEnd>
          <th
            *matHeaderCellDef
            class="px-1 text-center"
--- a/apps/client/src/app/components/admin-users/admin-users.html
+++ b/apps/client/src/app/components/admin-users/admin-users.html
@ -178,7 +178,7 @@
            </td>
          </ng-container>

-          <ng-container matColumnDef="actions">
+          <ng-container matColumnDef="actions" stickyEnd>
            <th
              *matHeaderCellDef
              class="mat-mdc-header-cell px-1 py-2"
--- a/apps/client/src/app/components/header/header.component.ts
+++ b/apps/client/src/app/components/header/header.component.ts
@ -15,7 +15,7 @@ import { LoginWithAccessTokenDialog } from '@ghostfolio/client/components/login-
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import {
-  STAY_SIGNED_IN,
+  KEY_STAY_SIGNED_IN,
  SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { TokenStorageService } from '@ghostfolio/client/services/token-storage.service';
@ -196,7 +196,7 @@ export class HeaderComponent implements OnChanges {
  public setToken(aToken: string) {
    this.tokenStorageService.saveToken(
      aToken,
-      this.settingsStorageService.getSetting(STAY_SIGNED_IN) === 'true'
+      this.settingsStorageService.getSetting(KEY_STAY_SIGNED_IN) === 'true'
    );

    this.router.navigate(['/']);
--- a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.component.ts
+++ b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.component.ts
@ -4,7 +4,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { InternetIdentityService } from '@ghostfolio/client/services/internet-identity.service';
 import {
-  STAY_SIGNED_IN,
+  KEY_STAY_SIGNED_IN,
  SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { TokenStorageService } from '@ghostfolio/client/services/token-storage.service';
@ -31,7 +31,7 @@ export class LoginWithAccessTokenDialog {

  public onChangeStaySignedIn(aValue: MatCheckboxChange) {
    this.settingsStorageService.setSetting(
-      STAY_SIGNED_IN,
+      KEY_STAY_SIGNED_IN,
      aValue.checked?.toString()
    );
  }
--- a/apps/client/src/app/components/user-account-settings/user-account-settings.component.ts
+++ b/apps/client/src/app/components/user-account-settings/user-account-settings.component.ts
@ -8,7 +8,8 @@ import {
 import { MatSlideToggleChange } from '@angular/material/slide-toggle';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import {
-  STAY_SIGNED_IN,
+  KEY_STAY_SIGNED_IN,
+  KEY_TOKEN,
  SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
@ -241,7 +242,8 @@ export class UserAccountSettingsComponent implements OnDestroy, OnInit {
        })
      )
      .subscribe(() => {
-        this.settingsStorageService.removeSetting(STAY_SIGNED_IN);
+        this.settingsStorageService.removeSetting(KEY_STAY_SIGNED_IN);
+        this.settingsStorageService.removeSetting(KEY_TOKEN);

        this.update();
      });
--- a/apps/client/src/app/pages/auth/auth-page.component.ts
+++ b/apps/client/src/app/pages/auth/auth-page.component.ts
@ -1,7 +1,7 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import {
-  STAY_SIGNED_IN,
+  KEY_STAY_SIGNED_IN,
  SettingsStorageService
 } from '@ghostfolio/client/services/settings-storage.service';
 import { TokenStorageService } from '@ghostfolio/client/services/token-storage.service';
@ -31,7 +31,7 @@ export class AuthPageComponent implements OnDestroy, OnInit {

        this.tokenStorageService.saveToken(
          jwt,
-          this.settingsStorageService.getSetting(STAY_SIGNED_IN) === 'true'
+          this.settingsStorageService.getSetting(KEY_STAY_SIGNED_IN) === 'true'
        );

        this.router.navigate(['/']);
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
@ -1,5 +1,7 @@
 import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
+import { PageEvent } from '@angular/material/paginator';
+import { MatTableDataSource } from '@angular/material/table';
 import { ActivatedRoute, Router } from '@angular/router';
 import { CreateOrderDto } from '@ghostfolio/api/app/order/create-order.dto';
 import { Activity } from '@ghostfolio/api/app/order/interfaces/activities.interface';
@ -10,10 +12,11 @@ import { DataService } from '@ghostfolio/client/services/data.service';
 import { IcsService } from '@ghostfolio/client/services/ics/ics.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
+import { DEFAULT_PAGE_SIZE } from '@ghostfolio/common/config';
 import { downloadAsFile } from '@ghostfolio/common/helper';
 import { User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
-import { DataSource, Order as OrderModel } from '@prisma/client';
+import { DataSource, Order as OrderModel, Prisma } from '@prisma/client';
 import { format, parseISO } from 'date-fns';
 import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject, Subscription } from 'rxjs';
@ -30,12 +33,18 @@ import { ImportActivitiesDialogParams } from './import-activities-dialog/interfa
 })
 export class ActivitiesPageComponent implements OnDestroy, OnInit {
  public activities: Activity[];
+  public dataSource: MatTableDataSource<Activity>;
  public defaultAccountId: string;
  public deviceType: string;
  public hasImpersonationId: boolean;
  public hasPermissionToCreateActivity: boolean;
  public hasPermissionToDeleteActivity: boolean;
+  public pageIndex = 0;
+  public pageSize = DEFAULT_PAGE_SIZE;
  public routeQueryParams: Subscription;
+  public sortColumn = 'date';
+  public sortDirection: Prisma.SortOrder = 'desc';
+  public totalItems: number;
  public user: User;

  private unsubscribeSubject = new Subject<void>();
@ -103,21 +112,48 @@ export class ActivitiesPageComponent implements OnDestroy, OnInit {
  }

  public fetchActivities() {
-    this.dataService
-      .fetchActivities({})
-      .pipe(takeUntil(this.unsubscribeSubject))
-      .subscribe(({ activities }) => {
-        this.activities = activities;
+    if (this.user?.settings?.isExperimentalFeatures === true) {
+      this.dataService
+        .fetchActivities({
+          skip: this.pageIndex * this.pageSize,
+          sortColumn: this.sortColumn,
+          sortDirection: this.sortDirection,
+          take: this.pageSize
+        })
+        .pipe(takeUntil(this.unsubscribeSubject))
+        .subscribe(({ activities, count }) => {
+          this.dataSource = new MatTableDataSource(activities);
+          this.totalItems = count;

-        if (
-          this.hasPermissionToCreateActivity &&
-          this.activities?.length <= 0
-        ) {
-          this.router.navigate([], { queryParams: { createDialog: true } });
-        }
+          if (this.hasPermissionToCreateActivity && this.totalItems <= 0) {
+            this.router.navigate([], { queryParams: { createDialog: true } });
+          }

-        this.changeDetectorRef.markForCheck();
-      });
+          this.changeDetectorRef.markForCheck();
+        });
+    } else {
+      this.dataService
+        .fetchActivities({})
+        .pipe(takeUntil(this.unsubscribeSubject))
+        .subscribe(({ activities }) => {
+          this.activities = activities;
+
+          if (
+            this.hasPermissionToCreateActivity &&
+            this.activities?.length <= 0
+          ) {
+            this.router.navigate([], { queryParams: { createDialog: true } });
+          }
+
+          this.changeDetectorRef.markForCheck();
+        });
+    }
+  }
+
+  public onChangePage(page: PageEvent) {
+    this.pageIndex = page.pageIndex;
+
+    this.fetchActivities();
  }

  public onCloneActivity(aActivity: Activity) {
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.html
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.html
@ -2,7 +2,30 @@
  <div class="mb-3 row">
    <div class="col">
      <h1 class="d-none d-sm-block h3 mb-3 text-center" i18n>Activities</h1>
+      <gf-activities-table-lazy
+        *ngIf="user?.settings?.isExperimentalFeatures === true"
+        [baseCurrency]="user?.settings?.baseCurrency"
+        [dataSource]="dataSource"
+        [deviceType]="deviceType"
+        [hasPermissionToCreateActivity]="hasPermissionToCreateActivity"
+        [hasPermissionToExportActivities]="!hasImpersonationId"
+        [locale]="user?.settings?.locale"
+        [pageIndex]="pageIndex"
+        [pageSize]="pageSize"
+        [showActions]="!hasImpersonationId && hasPermissionToDeleteActivity && !user.settings.isRestrictedView"
+        [totalItems]="totalItems"
+        (activityDeleted)="onDeleteActivity($event)"
+        (activityToClone)="onCloneActivity($event)"
+        (activityToUpdate)="onUpdateActivity($event)"
+        (deleteAllActivities)="onDeleteAllActivities()"
+        (export)="onExport($event)"
+        (exportDrafts)="onExportDrafts($event)"
+        (import)="onImport()"
+        (importDividends)="onImportDividends()"
+        (pageChanged)="onChangePage($event)"
+      ></gf-activities-table-lazy>
      <gf-activities-table
+        *ngIf="user?.settings?.isExperimentalFeatures !== true"
        [activities]="activities"
        [baseCurrency]="user?.settings?.baseCurrency"
        [deviceType]="deviceType"
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.module.ts
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.module.ts
@ -4,6 +4,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { RouterModule } from '@angular/router';
 import { ImportActivitiesService } from '@ghostfolio/client/services/import-activities.service';
+import { GfActivitiesTableLazyModule } from '@ghostfolio/ui/activities-table-lazy/activities-table-lazy.module';
 import { GfActivitiesTableModule } from '@ghostfolio/ui/activities-table/activities-table.module';

 import { ActivitiesPageRoutingModule } from './activities-page-routing.module';
@ -17,6 +18,7 @@ import { GfImportActivitiesDialogModule } from './import-activities-dialog/impor
    ActivitiesPageRoutingModule,
    CommonModule,
    GfActivitiesTableModule,
+    GfActivitiesTableLazyModule,
    GfCreateOrUpdateActivityDialogModule,
    GfImportActivitiesDialogModule,
    MatButtonModule,
--- a/apps/client/src/app/services/data.service.ts
+++ b/apps/client/src/app/services/data.service.ts
@ -38,7 +38,7 @@ import {
 } from '@ghostfolio/common/interfaces';
 import { filterGlobalPermissions } from '@ghostfolio/common/permissions';
 import { AccountWithValue, DateRange, GroupBy } from '@ghostfolio/common/types';
-import { DataSource, Order as OrderModel } from '@prisma/client';
+import { DataSource, Order as OrderModel, Prisma } from '@prisma/client';
 import { format, parseISO } from 'date-fns';
 import { cloneDeep, groupBy, isNumber } from 'lodash';
 import { Observable } from 'rxjs';
@ -149,23 +149,45 @@ export class DataService {
  }

  public fetchActivities({
-    filters
+    filters,
+    skip,
+    sortColumn,
+    sortDirection,
+    take
  }: {
    filters?: Filter[];
+    skip?: number;
+    sortColumn?: string;
+    sortDirection?: Prisma.SortOrder;
+    take?: number;
  }): Observable<Activities> {
-    return this.http
-      .get<any>('/api/v1/order', {
-        params: this.buildFiltersAsQueryParams({ filters })
+    let params = this.buildFiltersAsQueryParams({ filters });
+
+    if (skip) {
+      params = params.append('skip', skip);
+    }
+
+    if (sortColumn) {
+      params = params.append('sortColumn', sortColumn);
+    }
+
+    if (sortDirection) {
+      params = params.append('sortDirection', sortDirection);
+    }
+
+    if (take) {
+      params = params.append('take', take);
+    }
+
+    return this.http.get<any>('/api/v1/order', { params }).pipe(
+      map(({ activities, count }) => {
+        for (const activity of activities) {
+          activity.createdAt = parseISO(activity.createdAt);
+          activity.date = parseISO(activity.date);
+        }
+        return { activities, count };
      })
-      .pipe(
-        map(({ activities }) => {
-          for (const activity of activities) {
-            activity.createdAt = parseISO(activity.createdAt);
-            activity.date = parseISO(activity.date);
-          }
-          return { activities };
-        })
-      );
+    );
  }

  public fetchDividends({
--- a/apps/client/src/app/services/settings-storage.service.ts
+++ b/apps/client/src/app/services/settings-storage.service.ts
@ -1,7 +1,8 @@
 import { Injectable } from '@angular/core';

-export const RANGE = 'range';
-export const STAY_SIGNED_IN = 'staySignedIn';
+export const KEY_RANGE = 'range';
+export const KEY_STAY_SIGNED_IN = 'staySignedIn';
+export const KEY_TOKEN = 'auth-token';

@Injectable({
  providedIn: 'root'
--- a/apps/client/src/app/services/token-storage.service.ts
+++ b/apps/client/src/app/services/token-storage.service.ts
@ -1,10 +1,9 @@
 import { Injectable } from '@angular/core';
 import { WebAuthnService } from '@ghostfolio/client/services/web-authn.service';

+import { KEY_TOKEN } from './settings-storage.service';
 import { UserService } from './user/user.service';

-const TOKEN_KEY = 'auth-token';
-
@Injectable({
  providedIn: 'root'
 })
@ -16,16 +15,16 @@ export class TokenStorageService {

  public getToken(): string {
    return (
-      window.sessionStorage.getItem(TOKEN_KEY) ||
-      window.localStorage.getItem(TOKEN_KEY)
+      window.sessionStorage.getItem(KEY_TOKEN) ||
+      window.localStorage.getItem(KEY_TOKEN)
    );
  }

  public saveToken(token: string, staySignedIn = false): void {
    if (staySignedIn) {
-      window.localStorage.setItem(TOKEN_KEY, token);
+      window.localStorage.setItem(KEY_TOKEN, token);
    }
-    window.sessionStorage.setItem(TOKEN_KEY, token);
+    window.sessionStorage.setItem(KEY_TOKEN, token);
  }

  public signOut(): void {
--- a/apps/client/src/locales/messages.de.xlf
+++ b/apps/client/src/locales/messages.de.xlf
--- a/apps/client/src/locales/messages.es.xlf
+++ b/apps/client/src/locales/messages.es.xlf
--- a/apps/client/src/locales/messages.fr.xlf
+++ b/apps/client/src/locales/messages.fr.xlf
--- a/apps/client/src/locales/messages.it.xlf
+++ b/apps/client/src/locales/messages.it.xlf
--- a/apps/client/src/locales/messages.nl.xlf
+++ b/apps/client/src/locales/messages.nl.xlf
--- a/apps/client/src/locales/messages.pl.xlf
+++ b/apps/client/src/locales/messages.pl.xlf
--- a/apps/client/src/locales/messages.pt.xlf
+++ b/apps/client/src/locales/messages.pt.xlf
--- a/apps/client/src/locales/messages.tr.xlf
+++ b/apps/client/src/locales/messages.tr.xlf
--- a/apps/client/src/locales/messages.xlf
+++ b/apps/client/src/locales/messages.xlf
--- a/apps/client/src/styles.scss
+++ b/apps/client/src/styles.scss
@ -539,6 +539,12 @@ ngx-skeleton-loader {
      --mdc-tab-indicator-active-indicator-color: transparent;
    }

+    @media (max-width: 575.98px) {
+      .mat-mdc-tab-link {
+        --mdc-secondary-navigation-tab-container-height: 3rem;
+      }
+    }
+
    @media (min-width: 576px) {
      flex-direction: row-reverse;

--- a/apps/client/src/styles/table.scss
+++ b/apps/client/src/styles/table.scss
@ -1,5 +1,5 @@
@mixin gf-table($darkTheme: false) {
-  background: transparent !important;
+  --mat-table-background-color: var(--light-background);

  .mat-footer-row,
  .mat-row {
@ -21,29 +21,17 @@

  .mat-mdc-row {
    &:nth-child(even) {
-      background-color: rgba(var(--palette-foreground-base), 0.02);
+      background-color: whitesmoke;
    }

    &:hover {
-      background-color: rgba(var(--palette-foreground-base), 0.05) !important;
-    }
-
-    .mat-mdc-cell {
-      background: none;
-    }
-  }
-
-  .mat-row {
-    &:nth-child(even) {
-      background-color: rgba(var(--palette-foreground-base), 0.02);
-    }
-
-    &:hover {
-      background-color: rgba(var(--palette-foreground-base), 0.05);
+      background-color: #e6e6e6 !important;
    }
  }

  @if $darkTheme {
+    --mat-table-background-color: var(--dark-background);
+
    .mat-mdc-footer-row {
      .mat-mdc-footer-cell {
        border-top-color: rgba(
@ -55,28 +43,11 @@

    .mat-mdc-row {
      &:nth-child(even) {
-        background-color: rgba(var(--palette-foreground-base-dark), 0.02);
+        background-color: #222222;
      }

      &:hover {
-        background-color: rgba(
-          var(--palette-foreground-base-dark),
-          0.05
-        ) !important;
-      }
-
-      .mat-mdc-cell {
-        background: none;
-      }
-    }
-
-    .mat-row {
-      &:nth-child(even) {
-        background-color: rgba(var(--palette-foreground-base-dark), 0.02);
-      }
-
-      &:hover {
-        background-color: rgba(var(--palette-foreground-base-dark), 0.05);
+        background-color: #303030 !important;
      }
    }
  }
--- a/libs/ui/src/lib/account-balances/account-balances.component.html
+++ b/libs/ui/src/lib/account-balances/account-balances.component.html
@ -31,7 +31,7 @@
    </td>
  </ng-container>

-  <ng-container matColumnDef="actions">
+  <ng-container matColumnDef="actions" stickyEnd>
    <th *matHeaderCellDef class="px-1 text-center" mat-header-cell></th>
    <td *matCellDef="let element" class="px-1 text-center" mat-cell>
      <button
--- a/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.html
+++ b/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.html
@ -0,0 +1,499 @@
+<div *ngIf="hasPermissionToCreateActivity" class="d-flex justify-content-end">
+  <button
+    class="align-items-center d-flex"
+    mat-stroked-button
+    (click)="onImport()"
+  >
+    <ion-icon class="mr-2" name="cloud-upload-outline"></ion-icon>
+    <ng-container i18n>Import Activities</ng-container>...
+  </button>
+  <button
+    *ngIf="hasPermissionToExportActivities"
+    class="mx-1 no-min-width px-2"
+    mat-stroked-button
+    [matMenuTriggerFor]="activitiesMenu"
+    (click)="$event.stopPropagation()"
+  >
+    <ion-icon name="ellipsis-vertical"></ion-icon>
+  </button>
+  <mat-menu #activitiesMenu="matMenu" xPosition="before">
+    <button
+      mat-menu-item
+      [disabled]="dataSource?.data.length === 0"
+      (click)="onImportDividends()"
+    >
+      <span class="align-items-center d-flex">
+        <ion-icon class="mr-2" name="color-wand-outline"></ion-icon>
+        <ng-container i18n>Import Dividends</ng-container>...
+      </span>
+    </button>
+    <button
+      *ngIf="hasPermissionToExportActivities"
+      class="align-items-center d-flex"
+      mat-menu-item
+      [disabled]="dataSource?.data.length === 0"
+      (click)="onExport()"
+    >
+      <span class="align-items-center d-flex">
+        <ion-icon class="mr-2" name="cloud-download-outline"></ion-icon>
+        <span i18n>Export Activities</span>
+      </span>
+    </button>
+    <button
+      *ngIf="hasPermissionToExportActivities"
+      class="align-items-center d-flex"
+      mat-menu-item
+      [disabled]="!hasDrafts"
+      (click)="onExportDrafts()"
+    >
+      <span class="align-items-center d-flex">
+        <ion-icon class="mr-2" name="calendar-clear-outline"></ion-icon>
+        <span i18n>Export Drafts as ICS</span>
+      </span>
+    </button>
+    <button
+      class="align-items-center d-flex"
+      mat-menu-item
+      (click)="onDeleteAllActivities()"
+    >
+      <span class="align-items-center d-flex">
+        <ion-icon class="mr-2" name="trash-outline"></ion-icon>
+        <span i18n>Delete all Activities</span>
+      </span>
+    </button>
+  </mat-menu>
+</div>
+
+<div class="activities">
+  <table class="gf-table w-100" mat-table [dataSource]="dataSource">
+    <ng-container matColumnDef="select">
+      <th *matHeaderCellDef class="px-1" mat-header-cell>
+        <mat-checkbox
+          color="primary"
+          [checked]="
+            areAllRowsSelected() && !hasErrors && selectedRows.hasValue()
+          "
+          [disabled]="hasErrors"
+          [indeterminate]="selectedRows.hasValue() && !areAllRowsSelected()"
+          (change)="$event ? toggleAllRows() : null"
+        ></mat-checkbox>
+      </th>
+      <td *matCellDef="let element" class="px-1" mat-cell>
+        <mat-checkbox
+          color="primary"
+          [checked]="element.error ? false : selectedRows.isSelected(element)"
+          [disabled]="element.error"
+          (change)="$event ? selectedRows.toggle(element) : null"
+          (click)="$event.stopPropagation()"
+        ></mat-checkbox>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="importStatus">
+      <th *matHeaderCellDef class="px-1" mat-header-cell>
+        <ng-container i18n></ng-container>
+      </th>
+      <td *matCellDef="let element" class="px-1" mat-cell>
+        <div
+          *ngIf="element.error"
+          class="d-flex"
+          matTooltipPosition="above"
+          [matTooltip]="element.error.message"
+        >
+          <ion-icon class="text-danger" name="alert-circle-outline"></ion-icon>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="icon">
+      <th *matHeaderCellDef class="px-1" mat-header-cell></th>
+      <td *matCellDef="let element" class="px-1 text-center" mat-cell>
+        <gf-symbol-icon
+          [dataSource]="element.SymbolProfile?.dataSource"
+          [symbol]="element.SymbolProfile?.symbol"
+          [tooltip]="element.SymbolProfile?.name"
+        ></gf-symbol-icon>
+        <div>{{ element.dataSource }}</div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="nameWithSymbol">
+      <th
+        *matHeaderCellDef
+        class="px-1"
+        mat-header-cell
+        mat-sort-header="SymbolProfile.symbol"
+      >
+        <ng-container i18n>Name</ng-container>
+      </th>
+      <td *matCellDef="let element" class="line-height-1 px-1" mat-cell>
+        <div class="d-flex align-items-center">
+          <div>
+            <span class="text-truncate">{{ element.SymbolProfile?.name }}</span>
+            <span
+              *ngIf="element.isDraft"
+              class="badge badge-secondary ml-1"
+              i18n
+              >Draft</span
+            >
+          </div>
+        </div>
+        <div *ngIf="!isUUID(element.SymbolProfile?.symbol)">
+          <small class="text-muted">{{
+            element.SymbolProfile?.symbol | gfSymbol
+          }}</small>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="type">
+      <th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header>
+        <ng-container i18n>Type</ng-container>
+      </th>
+      <td *matCellDef="let element" class="px-1" mat-cell>
+        <gf-activity-type [activityType]="element.type"></gf-activity-type>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="date">
+      <th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header>
+        <ng-container i18n>Date</ng-container>
+      </th>
+      <td *matCellDef="let element" class="px-1" mat-cell>
+        <div class="d-flex">
+          {{ element.date | date: defaultDateFormat }}
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="quantity">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header
+      >
+        <ng-container i18n>Quantity</ng-container>
+      </th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        <div class="d-flex justify-content-end">
+          <gf-value
+            [isCurrency]="true"
+            [locale]="locale"
+            [value]="isLoading ? undefined : element.quantity"
+          ></gf-value>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="unitPrice">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header
+      >
+        <ng-container i18n>Unit Price</ng-container>
+      </th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        <div class="d-flex justify-content-end">
+          <gf-value
+            [isCurrency]="true"
+            [locale]="locale"
+            [value]="isLoading ? undefined : element.unitPrice"
+          ></gf-value>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="fee">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header
+      >
+        <ng-container i18n>Fee</ng-container>
+      </th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        <div class="d-flex justify-content-end">
+          <gf-value
+            [isCurrency]="true"
+            [locale]="locale"
+            [value]="isLoading ? undefined : element.fee"
+          ></gf-value>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="value">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header
+      >
+        <ng-container i18n>Value</ng-container>
+      </th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        <div class="d-flex justify-content-end">
+          <gf-value
+            [isCurrency]="true"
+            [locale]="locale"
+            [value]="isLoading ? undefined : element.value"
+          ></gf-value>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="currency">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell px-1"
+        mat-header-cell
+        mat-sort-header="SymbolProfile.currency"
+      >
+        <ng-container i18n>Currency</ng-container>
+      </th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        {{ element.SymbolProfile?.currency }}
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="valueInBaseCurrency">
+      <th
+        *matHeaderCellDef
+        class="d-lg-none d-xl-none justify-content-end px-1"
+        mat-header-cell
+        mat-sort-header
+      >
+        <ng-container i18n>Value</ng-container>
+      </th>
+      <td *matCellDef="let element" class="d-lg-none d-xl-none px-1" mat-cell>
+        <div class="d-flex justify-content-end">
+          <gf-value
+            [isCurrency]="true"
+            [locale]="locale"
+            [value]="isLoading ? undefined : element.valueInBaseCurrency"
+          ></gf-value>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="account">
+      <th
+        *matHeaderCellDef
+        class="px-1"
+        mat-header-cell
+        mat-sort-header="Account.name"
+      >
+        <span class="d-none d-lg-block" i18n>Account</span>
+      </th>
+      <td *matCellDef="let element" class="px-1" mat-cell>
+        <div class="d-flex">
+          <gf-symbol-icon
+            *ngIf="element.Account?.Platform?.url"
+            class="mr-1"
+            [tooltip]="element.Account?.Platform?.name"
+            [url]="element.Account?.Platform?.url"
+          ></gf-symbol-icon>
+          <span class="d-none d-lg-block">{{ element.Account?.name }}</span>
+        </div>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="comment">
+      <th
+        *matHeaderCellDef
+        class="d-none d-lg-table-cell px-1"
+        mat-header-cell
+      ></th>
+      <td
+        *matCellDef="let element"
+        class="d-none d-lg-table-cell px-1"
+        mat-cell
+      >
+        <button
+          *ngIf="element.comment"
+          class="mx-1 no-min-width px-2"
+          mat-button
+          title="Note"
+          (click)="onOpenComment(element.comment); $event.stopPropagation()"
+        >
+          <ion-icon name="document-text-outline"></ion-icon>
+        </button>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="actions" stickyEnd>
+      <th *matHeaderCellDef class="px-1 text-center" mat-header-cell>
+        <button
+          *ngIf="
+            !hasPermissionToCreateActivity && hasPermissionToExportActivities
+          "
+          class="mx-1 no-min-width px-2"
+          mat-button
+          [matMenuTriggerFor]="activitiesMenu"
+          (click)="$event.stopPropagation()"
+        >
+          <ion-icon name="ellipsis-vertical"></ion-icon>
+        </button>
+        <mat-menu #activitiesMenu="matMenu" xPosition="before">
+          <button
+            *ngIf="hasPermissionToCreateActivity"
+            class="align-items-center d-flex"
+            mat-menu-item
+            (click)="onImport()"
+          >
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="cloud-upload-outline"></ion-icon>
+              <ng-container i18n>Import Activities</ng-container>...
+            </span>
+          </button>
+          <button
+            *ngIf="hasPermissionToCreateActivity"
+            mat-menu-item
+            [disabled]="dataSource?.data.length === 0"
+            (click)="onImportDividends()"
+          >
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="color-wand-outline"></ion-icon>
+              <ng-container i18n>Import Dividends</ng-container>...
+            </span>
+          </button>
+          <button
+            *ngIf="hasPermissionToExportActivities"
+            class="align-items-center d-flex"
+            mat-menu-item
+            [disabled]="dataSource?.data.length === 0"
+            (click)="onExport()"
+          >
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="cloud-download-outline"></ion-icon>
+              <span i18n>Export Activities</span>
+            </span>
+          </button>
+          <button
+            *ngIf="hasPermissionToExportActivities"
+            class="align-items-center d-flex"
+            mat-menu-item
+            [disabled]="!hasDrafts"
+            (click)="onExportDrafts()"
+          >
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="calendar-clear-outline"></ion-icon>
+              <span i18n>Export Drafts as ICS</span>
+            </span>
+          </button>
+        </mat-menu>
+      </th>
+      <td *matCellDef="let element" class="px-1 text-center" mat-cell>
+        <button
+          *ngIf="showActions"
+          class="mx-1 no-min-width px-2"
+          mat-button
+          [matMenuTriggerFor]="activityMenu"
+          (click)="$event.stopPropagation()"
+        >
+          <ion-icon name="ellipsis-horizontal"></ion-icon>
+        </button>
+        <mat-menu #activityMenu="matMenu" xPosition="before">
+          <button mat-menu-item (click)="onUpdateActivity(element)">
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="create-outline"></ion-icon>
+              <span i18n>Edit</span>
+            </span>
+          </button>
+          <button mat-menu-item (click)="onCloneActivity(element)">
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="copy-outline"></ion-icon>
+              <span i18n>Clone</span>
+            </span>
+          </button>
+          <button
+            mat-menu-item
+            [disabled]="!element.isDraft"
+            (click)="onExportDraft(element.id)"
+          >
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="calendar-clear-outline"></ion-icon>
+              <span i18n>Export Draft as ICS</span>
+            </span>
+          </button>
+          <button mat-menu-item (click)="onDeleteActivity(element.id)">
+            <span class="align-items-center d-flex">
+              <ion-icon class="mr-2" name="trash-outline"></ion-icon>
+              <span i18n>Delete</span>
+            </span>
+          </button>
+        </mat-menu>
+      </td>
+    </ng-container>
+
+    <tr *matHeaderRowDef="displayedColumns" mat-header-row></tr>
+    <tr
+      *matRowDef="let row; columns: displayedColumns"
+      mat-row
+      [ngClass]="{
+        'cursor-pointer':
+          hasPermissionToOpenDetails &&
+          !row.isDraft &&
+          row.type !== 'FEE' &&
+          row.type !== 'INTEREST' &&
+          row.type !== 'ITEM' &&
+          row.type !== 'LIABILITY'
+      }"
+      (click)="onClickActivity(row)"
+    ></tr>
+  </table>
+</div>
+
+<mat-paginator
+  [length]="totalItems"
+  [ngClass]="{
+    'd-none': (isLoading && totalItems === 0) || totalItems <= pageSize
+  }"
+  [pageSize]="pageSize"
+  (page)="onChangePage($event)"
+></mat-paginator>
+
+<ngx-skeleton-loader
+  *ngIf="isLoading"
+  animation="pulse"
+  class="px-4 py-3"
+  [theme]="{
+    height: '1.5rem',
+    width: '100%'
+  }"
+></ngx-skeleton-loader>
+
+<div
+  *ngIf="
+    dataSource?.data.length === 0 && hasPermissionToCreateActivity && !isLoading
+  "
+  class="p-3 text-center"
+>
+  <gf-no-transactions-info-indicator
+    [hasBorder]="false"
+  ></gf-no-transactions-info-indicator>
+</div>
--- a/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.scss
+++ b/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.scss
@ -0,0 +1,9 @@
+@import 'apps/client/src/styles/ghostfolio-style';
+
+:host {
+  display: block;
+
+  .activities {
+    overflow-x: auto;
+  }
+}
--- a/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.ts
+++ b/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.ts
@ -0,0 +1,237 @@
+import { SelectionModel } from '@angular/cdk/collections';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  OnChanges,
+  OnDestroy,
+  OnInit,
+  Output,
+  ViewChild
+} from '@angular/core';
+import { MatPaginator, PageEvent } from '@angular/material/paginator';
+import { MatTableDataSource } from '@angular/material/table';
+import { Router } from '@angular/router';
+import { Activity } from '@ghostfolio/api/app/order/interfaces/activities.interface';
+import { DEFAULT_PAGE_SIZE } from '@ghostfolio/common/config';
+import { getDateFormatString } from '@ghostfolio/common/helper';
+import { UniqueAsset } from '@ghostfolio/common/interfaces';
+import { OrderWithAccount } from '@ghostfolio/common/types';
+import { isUUID } from 'class-validator';
+import { endOfToday, isAfter } from 'date-fns';
+import { Subject, Subscription, takeUntil } from 'rxjs';
+
+@Component({
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  selector: 'gf-activities-table-lazy',
+  styleUrls: ['./activities-table-lazy.component.scss'],
+  templateUrl: './activities-table-lazy.component.html'
+})
+export class ActivitiesTableLazyComponent
+  implements OnChanges, OnDestroy, OnInit
+{
+  @Input() baseCurrency: string;
+  @Input() dataSource: MatTableDataSource<Activity>;
+  @Input() deviceType: string;
+  @Input() hasPermissionToCreateActivity: boolean;
+  @Input() hasPermissionToExportActivities: boolean;
+  @Input() hasPermissionToOpenDetails = true;
+  @Input() locale: string;
+  @Input() pageIndex: number;
+  @Input() pageSize = DEFAULT_PAGE_SIZE;
+  @Input() showActions = true;
+  @Input() showCheckbox = false;
+  @Input() showFooter = true;
+  @Input() showNameColumn = true;
+  @Input() totalItems = Number.MAX_SAFE_INTEGER;
+
+  @Output() activityDeleted = new EventEmitter<string>();
+  @Output() activityToClone = new EventEmitter<OrderWithAccount>();
+  @Output() activityToUpdate = new EventEmitter<OrderWithAccount>();
+  @Output() deleteAllActivities = new EventEmitter<void>();
+  @Output() export = new EventEmitter<string[]>();
+  @Output() exportDrafts = new EventEmitter<string[]>();
+  @Output() import = new EventEmitter<void>();
+  @Output() importDividends = new EventEmitter<UniqueAsset>();
+  @Output() pageChanged = new EventEmitter<PageEvent>();
+  @Output() selectedActivities = new EventEmitter<Activity[]>();
+
+  @ViewChild(MatPaginator) paginator: MatPaginator;
+
+  public defaultDateFormat: string;
+  public displayedColumns = [];
+  public endOfToday = endOfToday();
+  public hasDrafts = false;
+  public hasErrors = false;
+  public isAfter = isAfter;
+  public isLoading = true;
+  public isUUID = isUUID;
+  public routeQueryParams: Subscription;
+  public searchKeywords: string[] = [];
+  public selectedRows = new SelectionModel<Activity>(true, []);
+
+  private unsubscribeSubject = new Subject<void>();
+
+  public constructor(private router: Router) {}
+
+  public ngOnInit() {
+    if (this.showCheckbox) {
+      this.toggleAllRows();
+      this.selectedRows.changed
+        .pipe(takeUntil(this.unsubscribeSubject))
+        .subscribe((selectedRows) => {
+          this.selectedActivities.emit(selectedRows.source.selected);
+        });
+    }
+  }
+
+  public areAllRowsSelected() {
+    const numSelectedRows = this.selectedRows.selected.length;
+    const numTotalRows = this.dataSource.data.length;
+    return numSelectedRows === numTotalRows;
+  }
+
+  public ngOnChanges() {
+    this.defaultDateFormat = getDateFormatString(this.locale);
+
+    this.displayedColumns = [
+      'select',
+      'importStatus',
+      'icon',
+      'nameWithSymbol',
+      'type',
+      'date',
+      'quantity',
+      'unitPrice',
+      'fee',
+      'value',
+      'currency',
+      'valueInBaseCurrency',
+      'account',
+      'comment',
+      'actions'
+    ];
+
+    if (!this.showCheckbox) {
+      this.displayedColumns = this.displayedColumns.filter((column) => {
+        return column !== 'importStatus' && column !== 'select';
+      });
+    }
+
+    if (!this.showNameColumn) {
+      this.displayedColumns = this.displayedColumns.filter((column) => {
+        return column !== 'nameWithSymbol';
+      });
+    }
+
+    if (this.dataSource) {
+      this.isLoading = false;
+    }
+  }
+
+  public onChangePage(page: PageEvent) {
+    this.pageChanged.emit(page);
+  }
+
+  public onClickActivity(activity: Activity) {
+    if (this.showCheckbox) {
+      if (!activity.error) {
+        this.selectedRows.toggle(activity);
+      }
+    } else if (
+      this.hasPermissionToOpenDetails &&
+      !activity.isDraft &&
+      activity.type !== 'FEE' &&
+      activity.type !== 'INTEREST' &&
+      activity.type !== 'ITEM' &&
+      activity.type !== 'LIABILITY'
+    ) {
+      this.onOpenPositionDialog({
+        dataSource: activity.SymbolProfile.dataSource,
+        symbol: activity.SymbolProfile.symbol
+      });
+    }
+  }
+
+  public onCloneActivity(aActivity: OrderWithAccount) {
+    this.activityToClone.emit(aActivity);
+  }
+
+  public onDeleteActivity(aId: string) {
+    const confirmation = confirm(
+      $localize`Do you really want to delete this activity?`
+    );
+
+    if (confirmation) {
+      this.activityDeleted.emit(aId);
+    }
+  }
+
+  public onExport() {
+    if (this.searchKeywords.length > 0) {
+      this.export.emit(
+        this.dataSource.filteredData.map((activity) => {
+          return activity.id;
+        })
+      );
+    } else {
+      this.export.emit();
+    }
+  }
+
+  public onExportDraft(aActivityId: string) {
+    this.exportDrafts.emit([aActivityId]);
+  }
+
+  public onExportDrafts() {
+    this.exportDrafts.emit(
+      this.dataSource.filteredData
+        .filter((activity) => {
+          return activity.isDraft;
+        })
+        .map((activity) => {
+          return activity.id;
+        })
+    );
+  }
+
+  public onDeleteAllActivities() {
+    this.deleteAllActivities.emit();
+  }
+
+  public onImport() {
+    this.import.emit();
+  }
+
+  public onImportDividends() {
+    this.importDividends.emit();
+  }
+
+  public onOpenComment(aComment: string) {
+    alert(aComment);
+  }
+
+  public onOpenPositionDialog({ dataSource, symbol }: UniqueAsset): void {
+    this.router.navigate([], {
+      queryParams: { dataSource, symbol, positionDetailDialog: true }
+    });
+  }
+
+  public onUpdateActivity(aActivity: OrderWithAccount) {
+    this.activityToUpdate.emit(aActivity);
+  }
+
+  public toggleAllRows() {
+    this.areAllRowsSelected()
+      ? this.selectedRows.clear()
+      : this.dataSource.data.forEach((row) => this.selectedRows.select(row));
+
+    this.selectedActivities.emit(this.selectedRows.selected);
+  }
+
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
+  }
+}
--- a/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.module.ts
+++ b/libs/ui/src/lib/activities-table-lazy/activities-table-lazy.module.ts
@ -0,0 +1,41 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { RouterModule } from '@angular/router';
+import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
+import { GfActivityTypeModule } from '@ghostfolio/ui/activity-type';
+import { GfNoTransactionsInfoModule } from '@ghostfolio/ui/no-transactions-info';
+import { GfValueModule } from '@ghostfolio/ui/value';
+import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
+
+import { ActivitiesTableLazyComponent } from './activities-table-lazy.component';
+
+@NgModule({
+  declarations: [ActivitiesTableLazyComponent],
+  exports: [ActivitiesTableLazyComponent],
+  imports: [
+    CommonModule,
+    GfActivityTypeModule,
+    GfNoTransactionsInfoModule,
+    GfSymbolIconModule,
+    GfSymbolModule,
+    GfValueModule,
+    MatButtonModule,
+    MatCheckboxModule,
+    MatMenuModule,
+    MatPaginatorModule,
+    MatTableModule,
+    MatTooltipModule,
+    NgxSkeletonLoaderModule,
+    RouterModule
+  ],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
+})
+export class GfActivitiesTableLazyModule {}
--- a/libs/ui/src/lib/activities-table/activities-table.component.html
+++ b/libs/ui/src/lib/activities-table/activities-table.component.html
@ -428,7 +428,7 @@
      ></td>
    </ng-container>

-    <ng-container matColumnDef="actions">
+    <ng-container matColumnDef="actions" stickyEnd>
      <th *matHeaderCellDef class="px-1 text-center" mat-header-cell>
        <button
          *ngIf="
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "ghostfolio",
-  "version": "2.28.0",
+  "version": "2.29.0",
  "homepage": "https://ghostfol.io",
  "license": "AGPL-3.0",
  "repository": "https://github.com/ghostfolio/ghostfolio",
@ -111,11 +111,11 @@
    "http-status-codes": "2.3.0",
    "ionicons": "7.1.0",
    "lodash": "4.17.21",
-    "marked": "4.2.12",
+    "marked": "9.1.6",
    "ms": "3.0.0-canary.1",
-    "ng-extract-i18n-merge": "2.8.3",
+    "ng-extract-i18n-merge": "2.9.0",
    "ngx-device-detector": "5.0.1",
-    "ngx-markdown": "15.1.0",
+    "ngx-markdown": "17.1.1",
    "ngx-skeleton-loader": "7.0.0",
    "ngx-stripe": "15.5.0",
    "papaparse": "5.3.1",
@ -168,7 +168,6 @@
    "@types/google-spreadsheet": "3.1.5",
    "@types/jest": "29.4.4",
    "@types/lodash": "4.14.195",
-    "@types/marked": "4.0.8",
    "@types/node": "20.4.2",
    "@types/papaparse": "5.3.7",
    "@types/passport-google-oauth20": "2.0.11",
--- a/yarn.lock
+++ b/yarn.lock
@ -1795,7 +1795,7 @@
  resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
  integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==

-"@braintree/sanitize-url@^6.0.0":
+"@braintree/sanitize-url@^6.0.1":
  version "6.0.4"
  resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-6.0.4.tgz#923ca57e173c6b232bbbb07347b1be982f03e783"
  integrity sha512-s3jaWicZd0pkP0jf5ysyHUI/RE7MHos6qlToFcGWXVp+ykHOy77OUMrfbgJ9it2C5bow7OIQwYYaHjk9XlBQ2A==
@ -5704,6 +5704,30 @@
  dependencies:
    "@types/node" "*"

+"@types/d3-scale-chromatic@^3.0.0":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@types/d3-scale-chromatic/-/d3-scale-chromatic-3.0.3.tgz#fc0db9c10e789c351f4c42d96f31f2e4df8f5644"
+  integrity sha512-laXM4+1o5ImZv3RpFAsTRn3TEkzqkytiOY0Dz0sq5cnd1dtNlk6sHLon4OvqaiJb28T0S/TdsBI3Sjsy+keJrw==
+
+"@types/d3-scale@^4.0.3":
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/@types/d3-scale/-/d3-scale-4.0.8.tgz#d409b5f9dcf63074464bf8ddfb8ee5a1f95945bb"
+  integrity sha512-gkK1VVTr5iNiYJ7vWDI+yUFFlszhNMtVeneJ6lUTKPjprsvLLI9/tgEGiXJOnlINJA8FyA88gfnQsHbybVZrYQ==
+  dependencies:
+    "@types/d3-time" "*"
+
+"@types/d3-time@*":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@types/d3-time/-/d3-time-3.0.3.tgz#3c186bbd9d12b9d84253b6be6487ca56b54f88be"
+  integrity sha512-2p6olUZ4w3s+07q3Tm2dbiMZy5pCDfYwtLXXHUnVzXgQlZ/OyPtUz6OL382BkOuGlLXqfT+wqv8Fw2v8/0geBw==
+
+"@types/debug@^4.0.0":
+  version "4.1.12"
+  resolved "https://registry.yarnpkg.com/@types/debug/-/debug-4.1.12.tgz#a155f21690871953410df4b6b6f53187f0500917"
+  integrity sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==
+  dependencies:
+    "@types/ms" "*"
+
 "@types/detect-port@^1.3.0":
  version "1.3.4"
  resolved "https://registry.yarnpkg.com/@types/detect-port/-/detect-port-1.3.4.tgz#cd34ab0f26391f5b9c5c9bb4c9e370dfbf9e4d05"
@ -5910,10 +5934,12 @@
  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.200.tgz#435b6035c7eba9cdf1e039af8212c9e9281e7149"
  integrity sha512-YI/M/4HRImtNf3pJgbF+W6FrXovqj+T+/HpENLTooK9PnkacBsDpeP3IpHab40CClUfhNmdM2WTNP2sa2dni5Q==

-"@types/marked@4.0.8":
-  version "4.0.8"
-  resolved "https://registry.yarnpkg.com/@types/marked/-/marked-4.0.8.tgz#b316887ab3499d0a8f4c70b7bd8508f92d477955"
-  integrity sha512-HVNzMT5QlWCOdeuBsgXP8EZzKUf0+AXzN+sLmjvaB3ZlLqO+e4u0uXrdw9ub69wBKFs+c6/pA4r9sy6cCDvImw==
+"@types/mdast@^3.0.0":
+  version "3.0.15"
+  resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.15.tgz#49c524a263f30ffa28b71ae282f813ed000ab9f5"
+  integrity sha512-LnwD+mUEfxWMa1QpDraczIn6k0Ee3SMicuYSSzS6ZYl2gKS09EClnJYGd8Du6rfc5r/GZEk5o1mRb8TaTj03sQ==
+  dependencies:
+    "@types/unist" "^2"

 "@types/mdx@^2.0.0":
  version "2.0.9"
@ -5940,6 +5966,11 @@
  resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-5.1.2.tgz#07508b45797cb81ec3f273011b054cd0755eddca"
  integrity sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==

+"@types/ms@*":
+  version "0.7.34"
+  resolved "https://registry.yarnpkg.com/@types/ms/-/ms-0.7.34.tgz#10964ba0dee6ac4cd462e2795b6bebd407303433"
+  integrity sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==
+
 "@types/node-fetch@^2.5.7", "@types/node-fetch@^2.6.4":
  version "2.6.7"
  resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.6.7.tgz#a1abe2ce24228b58ad97f99480fdcf9bbc6ab16d"
@ -6172,6 +6203,11 @@
  resolved "https://registry.yarnpkg.com/@types/tough-cookie/-/tough-cookie-4.0.4.tgz#cf2f0c7c51b985b6afecea73eb2cd65421ecb717"
  integrity sha512-95Sfz4nvMAb0Nl9DTxN3j64adfwfbBPEYq14VN7zT5J5O2M9V6iZMIIQU1U+pJyl9agHYHNCqhCXgyEtIRRa5A==

+"@types/unist@^2":
+  version "2.0.10"
+  resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.10.tgz#04ffa7f406ab628f7f7e97ca23e290cd8ab15efc"
+  integrity sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==
+
 "@types/unist@^2.0.0":
  version "2.0.9"
  resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.9.tgz#72e164381659a49557b0a078b28308f2c6a3e1ce"
@ -7950,6 +7986,11 @@ char-regex@^1.0.2:
  resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf"
  integrity sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==

+character-entities@^2.0.0:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/character-entities/-/character-entities-2.0.2.tgz#2d09c2e72cd9523076ccb21157dff66ad43fcc22"
+  integrity sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==
+
 chardet@^0.7.0:
  version "0.7.0"
  resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
@ -8952,6 +8993,13 @@ cytoscape@^3.23.0:
    heap "^0.2.6"
    lodash "^4.17.21"

+"d3-array@1 - 2":
+  version "2.12.1"
+  resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-2.12.1.tgz#e20b41aafcdffdf5d50928004ececf815a465e81"
+  integrity sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==
+  dependencies:
+    internmap "^1.0.0"
+
 "d3-array@2 - 3", "d3-array@2.10.0 - 3", "d3-array@2.5.0 - 3", d3-array@3, d3-array@^3.2.0:
  version "3.2.4"
  resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-3.2.4.tgz#15fec33b237f97ac5d7c986dc77da273a8ed0bb5"
@ -9068,6 +9116,11 @@ d3-hierarchy@3:
  dependencies:
    d3-color "1 - 3"

+d3-path@1:
+  version "1.0.9"
+  resolved "https://registry.yarnpkg.com/d3-path/-/d3-path-1.0.9.tgz#48c050bb1fe8c262493a8caf5524e3e9591701cf"
+  integrity sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==
+
 "d3-path@1 - 3", d3-path@3, d3-path@^3.1.0:
  version "3.1.0"
  resolved "https://registry.yarnpkg.com/d3-path/-/d3-path-3.1.0.tgz#22df939032fb5a71ae8b1800d61ddb7851c42526"
@ -9088,6 +9141,14 @@ d3-random@3:
  resolved "https://registry.yarnpkg.com/d3-random/-/d3-random-3.0.1.tgz#d4926378d333d9c0bfd1e6fa0194d30aebaa20f4"
  integrity sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==

+d3-sankey@^0.12.3:
+  version "0.12.3"
+  resolved "https://registry.yarnpkg.com/d3-sankey/-/d3-sankey-0.12.3.tgz#b3c268627bd72e5d80336e8de6acbfec9d15d01d"
+  integrity sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==
+  dependencies:
+    d3-array "1 - 2"
+    d3-shape "^1.2.0"
+
 d3-scale-chromatic@3:
  version "3.0.0"
  resolved "https://registry.yarnpkg.com/d3-scale-chromatic/-/d3-scale-chromatic-3.0.0.tgz#15b4ceb8ca2bb0dcb6d1a641ee03d59c3b62376a"
@ -9119,6 +9180,13 @@ d3-shape@3:
  dependencies:
    d3-path "^3.1.0"

+d3-shape@^1.2.0:
+  version "1.3.7"
+  resolved "https://registry.yarnpkg.com/d3-shape/-/d3-shape-1.3.7.tgz#df63801be07bc986bc54f63789b4fe502992b5d7"
+  integrity sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==
+  dependencies:
+    d3-path "1"
+
 "d3-time-format@2 - 4", d3-time-format@4:
  version "4.1.0"
  resolved "https://registry.yarnpkg.com/d3-time-format/-/d3-time-format-4.1.0.tgz#7ab5257a5041d11ecb4fe70a5c7d16a195bb408a"
@ -9196,10 +9264,10 @@ d3@^7.4.0, d3@^7.8.2:
    d3-transition "3"
    d3-zoom "3"

-dagre-d3-es@7.0.9:
-  version "7.0.9"
-  resolved "https://registry.yarnpkg.com/dagre-d3-es/-/dagre-d3-es-7.0.9.tgz#aca12fccd9d09955a4430029ba72ee6934542a8d"
-  integrity sha512-rYR4QfVmy+sR44IBDvVtcAmOReGBvRCWDpO2QjYwqgh9yijw6eSHBqaPG/LIOEy7aBsniLvtMW6pg19qJhq60w==
+dagre-d3-es@7.0.10:
+  version "7.0.10"
+  resolved "https://registry.yarnpkg.com/dagre-d3-es/-/dagre-d3-es-7.0.10.tgz#19800d4be674379a3cd8c86a8216a2ac6827cadc"
+  integrity sha512-qTCQmEhcynucuaZgY5/+ti3X/rnszKZhEQH/ZdWdtP1tA/y3VoHJzcVrO9pjjJCNpigfscAtoUB5ONcd2wNn0A==
  dependencies:
    d3 "^7.8.2"
    lodash-es "^4.17.21"
@ -9247,7 +9315,7 @@ debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.9:
  dependencies:
    ms "2.0.0"

-debug@4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
+debug@4, debug@^4.0.0, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
  version "4.3.4"
  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
@ -9283,6 +9351,13 @@ decimal.js@^10.4.2:
  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23"
  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==

+decode-named-character-reference@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz#daabac9690874c394c81e4162a0304b35d824f0e"
+  integrity sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==
+  dependencies:
+    character-entities "^2.0.0"
+
 decode-uri-component@^0.2.0:
  version "0.2.2"
  resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.2.tgz#e69dbe25d37941171dd540e024c444cd5188e1e9"
@ -9448,7 +9523,7 @@ depd@~1.1.2:
  resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
  integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==

-dequal@^2.0.2, dequal@^2.0.3:
+dequal@^2.0.0, dequal@^2.0.2, dequal@^2.0.3:
  version "2.0.3"
  resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
  integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==
@ -9518,6 +9593,11 @@ diff@^4.0.1:
  resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
  integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==

+diff@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/diff/-/diff-5.1.0.tgz#bc52d298c5ea8df9194800224445ed43ffc87e40"
+  integrity sha512-D+mk+qE8VC/PAUrlAU34N+VfXev0ghe5ywmpqrawphmVZc1bEfn56uo9qpyGp1p4xpzOHkSW4ztBd6L7Xx4ACw==
+
 dir-glob@^2.2.2:
  version "2.2.2"
  resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-2.2.2.tgz#fa09f0694153c8918b18ba0deafae94769fc50c4"
@ -9609,10 +9689,10 @@ domhandler@^5.0.2, domhandler@^5.0.3:
  dependencies:
    domelementtype "^2.3.0"

-dompurify@2.4.3:
-  version "2.4.3"
-  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.4.3.tgz#f4133af0e6a50297fc8874e2eaedc13a3c308c03"
-  integrity sha512-q6QaLcakcRjebxjg8/+NP+h0rPfatOgOzc46Fst9VAA3jF2ApfKBNKMzdP4DYTqtUMXSCd5pRS/8Po/OmoCHZQ==
+dompurify@^3.0.5:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-3.0.6.tgz#925ebd576d54a9531b5d76f0a5bef32548351dae"
+  integrity sha512-ilkD8YEnnGh1zJ240uJsW7AzE+2qpbOUYjacomn3AvJ6J4JhKGSZ2nh4wUIXPZrEPppaCLx5jFe8T89Rk8tQ7w==

 domutils@^2.5.2, domutils@^2.8.0:
  version "2.8.0"
@ -9751,10 +9831,10 @@ emoji-regex@^9.2.2:
  resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-9.2.2.tgz#840c8803b0d8047f4ff0cf963176b32d4ef3ed72"
  integrity sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==

-emoji-toolkit@^7.0.0:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/emoji-toolkit/-/emoji-toolkit-7.0.1.tgz#4ea2a78fe4b40c7cdbe7ef5725c7011299932f09"
-  integrity sha512-l5aJyAhpC5s4mDuoVuqt4SzVjwIsIvakPh4ZGJJE4KWuWFCEHaXacQFkStVdD9zbRR+/BbRXob7u99o0lQFr8A==
+emoji-toolkit@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/emoji-toolkit/-/emoji-toolkit-8.0.0.tgz#59e0273a4a32d653b5125e9a1b8823f0611a042a"
+  integrity sha512-Vz8YIqQJsQ+QZ4yuKMMzliXceayqfWbNjb6bST+vm77QAhU2is3I+/PRxrNknW+q1bvHHMgjLCQXxzINWLVapg==

 emojis-list@^3.0.0:
  version "3.0.0"
@ -12134,6 +12214,11 @@ internal-slot@^1.0.5:
  resolved "https://registry.yarnpkg.com/internmap/-/internmap-2.0.3.tgz#6685f23755e43c524e251d29cbc97248e3061009"
  integrity sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==

+internmap@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/internmap/-/internmap-1.0.1.tgz#0017cc8a3b99605f0302f2b198d272e015e5df95"
+  integrity sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==
+
 interpret@^1.0.0:
  version "1.4.0"
  resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
@ -13467,6 +13552,11 @@ kleur@^3.0.3:
  resolved "https://registry.yarnpkg.com/kleur/-/kleur-3.0.3.tgz#a79c9ecc86ee1ce3fa6206d1216c501f147fc07e"
  integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==

+kleur@^4.0.3:
+  version "4.1.5"
+  resolved "https://registry.yarnpkg.com/kleur/-/kleur-4.1.5.tgz#95106101795f7050c6c650f350c683febddb1780"
+  integrity sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==
+
 klona@^2.0.4, klona@^2.0.5:
  version "2.0.6"
  resolved "https://registry.yarnpkg.com/klona/-/klona-2.0.6.tgz#85bffbf819c03b2f53270412420a4555ef882e22"
@ -13948,10 +14038,10 @@ markdown-to-jsx@^7.1.8:
  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.3.2.tgz#f286b4d112dad3028acc1e77dfe1f653b347e131"
  integrity sha512-B+28F5ucp83aQm+OxNrPkS8z0tMKaeHiy0lHJs3LqCyDQFtWuenaIrkaVTgAm1pf1AU85LXltva86hlaT17i8Q==

-marked@4.2.12:
-  version "4.2.12"
-  resolved "https://registry.yarnpkg.com/marked/-/marked-4.2.12.tgz#d69a64e21d71b06250da995dcd065c11083bebb5"
-  integrity sha512-yr8hSKa3Fv4D3jdZmtMMPghgVt6TWbk86WQaWhDloQjRSQhMMYCAro7jP7VDJrjjdV8pxVxMssXS8B8Y5DZ5aw==
+marked@9.1.6:
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/marked/-/marked-9.1.6.tgz#5d2a3f8180abfbc5d62e3258a38a1c19c0381695"
+  integrity sha512-jcByLnIFkd5gSXZmjNvS1TlmRhCXZjIzHYlaGkPlLIekG55JDR2Z4va9tZwCiP+/RDERiNhMOFu01xd6O5ct1Q==

 mdast-util-definitions@^4.0.0:
  version "4.0.0"
@ -13960,11 +14050,36 @@ mdast-util-definitions@^4.0.0:
  dependencies:
    unist-util-visit "^2.0.0"

+mdast-util-from-markdown@^1.3.0:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/mdast-util-from-markdown/-/mdast-util-from-markdown-1.3.1.tgz#9421a5a247f10d31d2faed2a30df5ec89ceafcf0"
+  integrity sha512-4xTO/M8c82qBcnQc1tgpNtubGUW/Y1tBQ1B0i5CtSoelOLKFYlElIr3bvgREYYO5iRqbMY1YuqZng0GVOI8Qww==
+  dependencies:
+    "@types/mdast" "^3.0.0"
+    "@types/unist" "^2.0.0"
+    decode-named-character-reference "^1.0.0"
+    mdast-util-to-string "^3.1.0"
+    micromark "^3.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-decode-string "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    unist-util-stringify-position "^3.0.0"
+    uvu "^0.5.0"
+
 mdast-util-to-string@^1.0.0:
  version "1.1.0"
  resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-1.1.0.tgz#27055500103f51637bd07d01da01eb1967a43527"
  integrity sha512-jVU0Nr2B9X3MU4tSK7JP1CMkSvOj7X5l/GboG1tKRw52lLF1x2Ju92Ms9tNetCcbfX3hzlM73zYo2NKkWSfF/A==

+mdast-util-to-string@^3.1.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-3.2.0.tgz#66f7bb6324756741c5f47a53557f0cbf16b6f789"
+  integrity sha512-V4Zn/ncyN1QNSqSBxTrMOLpjr+IKdHl2v3KVLoWmDPscP4r9GcCi71gjgvUV1SFSKh92AjAG4peFuBl2/YgCJg==
+  dependencies:
+    "@types/mdast" "^3.0.0"
+
 mdn-data@2.0.28:
  version "2.0.28"
  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba"
@ -14018,24 +14133,28 @@ merge2@^1.2.3, merge2@^1.3.0, merge2@^1.4.1:
  resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==

-mermaid@^9.1.2:
-  version "9.4.3"
-  resolved "https://registry.yarnpkg.com/mermaid/-/mermaid-9.4.3.tgz#62cf210c246b74972ea98c19837519b6f03427f2"
-  integrity sha512-TLkQEtqhRSuEHSE34lh5bCa94KATCyluAXmFnNI2PRZwOpXFeqiJWwZl+d2CcemE1RS6QbbueSSq9QIg8Uxcyw==
+mermaid@^10.6.0:
+  version "10.6.1"
+  resolved "https://registry.yarnpkg.com/mermaid/-/mermaid-10.6.1.tgz#701f4160484137a417770ce757ce1887a98c00fc"
+  integrity sha512-Hky0/RpOw/1il9X8AvzOEChfJtVvmXm+y7JML5C//ePYMy0/9jCEmW1E1g86x9oDfW9+iVEdTV/i+M6KWRNs4A==
  dependencies:
-    "@braintree/sanitize-url" "^6.0.0"
+    "@braintree/sanitize-url" "^6.0.1"
+    "@types/d3-scale" "^4.0.3"
+    "@types/d3-scale-chromatic" "^3.0.0"
    cytoscape "^3.23.0"
    cytoscape-cose-bilkent "^4.1.0"
    cytoscape-fcose "^2.1.0"
    d3 "^7.4.0"
-    dagre-d3-es "7.0.9"
+    d3-sankey "^0.12.3"
+    dagre-d3-es "7.0.10"
    dayjs "^1.11.7"
-    dompurify "2.4.3"
+    dompurify "^3.0.5"
    elkjs "^0.8.2"
    khroma "^2.0.0"
    lodash-es "^4.17.21"
+    mdast-util-from-markdown "^1.3.0"
    non-layered-tidy-tree-layout "^2.0.2"
-    stylis "^4.1.2"
+    stylis "^4.1.3"
    ts-dedent "^2.2.0"
    uuid "^9.0.0"
    web-worker "^1.2.0"
@ -14045,6 +14164,200 @@ methods@~1.1.2:
  resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
  integrity sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==

+micromark-core-commonmark@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-core-commonmark/-/micromark-core-commonmark-1.1.0.tgz#1386628df59946b2d39fb2edfd10f3e8e0a75bb8"
+  integrity sha512-BgHO1aRbolh2hcrzL2d1La37V0Aoz73ymF8rAcKnohLy93titmv62E0gP8Hrx9PKcKrqCZ1BbLGbP3bEhoXYlw==
+  dependencies:
+    decode-named-character-reference "^1.0.0"
+    micromark-factory-destination "^1.0.0"
+    micromark-factory-label "^1.0.0"
+    micromark-factory-space "^1.0.0"
+    micromark-factory-title "^1.0.0"
+    micromark-factory-whitespace "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-chunked "^1.0.0"
+    micromark-util-classify-character "^1.0.0"
+    micromark-util-html-tag-name "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-resolve-all "^1.0.0"
+    micromark-util-subtokenize "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.1"
+    uvu "^0.5.0"
+
+micromark-factory-destination@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-factory-destination/-/micromark-factory-destination-1.1.0.tgz#eb815957d83e6d44479b3df640f010edad667b9f"
+  integrity sha512-XaNDROBgx9SgSChd69pjiGKbV+nfHGDPVYFs5dOoDd7ZnMAE+Cuu91BCpsY8RT2NP9vo/B8pds2VQNCLiu0zhg==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-factory-label@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-factory-label/-/micromark-factory-label-1.1.0.tgz#cc95d5478269085cfa2a7282b3de26eb2e2dec68"
+  integrity sha512-OLtyez4vZo/1NjxGhcpDSbHQ+m0IIGnT8BoPamh+7jVlzLJBH98zzuCoUeMxvM6WsNeh8wx8cKvqLiPHEACn0w==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    uvu "^0.5.0"
+
+micromark-factory-space@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-factory-space/-/micromark-factory-space-1.1.0.tgz#c8f40b0640a0150751d3345ed885a080b0d15faf"
+  integrity sha512-cRzEj7c0OL4Mw2v6nwzttyOZe8XY/Z8G0rzmWQZTBi/jjwyw/U4uqKtUORXQrR5bAZZnbTI/feRV/R7hc4jQYQ==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-factory-title@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-factory-title/-/micromark-factory-title-1.1.0.tgz#dd0fe951d7a0ac71bdc5ee13e5d1465ad7f50ea1"
+  integrity sha512-J7n9R3vMmgjDOCY8NPw55jiyaQnH5kBdV2/UXCtZIpnHH3P6nHUKaH7XXEYuWwx/xUJcawa8plLBEjMPU24HzQ==
+  dependencies:
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-factory-whitespace@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-factory-whitespace/-/micromark-factory-whitespace-1.1.0.tgz#798fb7489f4c8abafa7ca77eed6b5745853c9705"
+  integrity sha512-v2WlmiymVSp5oMg+1Q0N1Lxmt6pMhIHD457whWM7/GUlEks1hI9xj5w3zbc4uuMKXGisksZk8DzP2UyGbGqNsQ==
+  dependencies:
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-character@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-character/-/micromark-util-character-1.2.0.tgz#4fedaa3646db249bc58caeb000eb3549a8ca5dcc"
+  integrity sha512-lXraTwcX3yH/vMDaFWCQJP1uIszLVebzUa3ZHdrgxr7KEU/9mL4mVgCpGbyhvNLNlauROiNUq7WN5u7ndbY6xg==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-chunked@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-chunked/-/micromark-util-chunked-1.1.0.tgz#37a24d33333c8c69a74ba12a14651fd9ea8a368b"
+  integrity sha512-Ye01HXpkZPNcV6FiyoW2fGZDUw4Yc7vT0E9Sad83+bEDiCJ1uXu0S3mr8WLpsz3HaG3x2q0HM6CTuPdcZcluFQ==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-classify-character@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-classify-character/-/micromark-util-classify-character-1.1.0.tgz#6a7f8c8838e8a120c8e3c4f2ae97a2bff9190e9d"
+  integrity sha512-SL0wLxtKSnklKSUplok1WQFoGhUdWYKggKUiqhX+Swala+BtptGCu5iPRc+xvzJ4PXE/hwM3FNXsfEVgoZsWbw==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-combine-extensions@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-combine-extensions/-/micromark-util-combine-extensions-1.1.0.tgz#192e2b3d6567660a85f735e54d8ea6e3952dbe84"
+  integrity sha512-Q20sp4mfNf9yEqDL50WwuWZHUrCO4fEyeDCnMGmG5Pr0Cz15Uo7KBs6jq+dq0EgX4DPwwrh9m0X+zPV1ypFvUA==
+  dependencies:
+    micromark-util-chunked "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-decode-numeric-character-reference@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-decode-numeric-character-reference/-/micromark-util-decode-numeric-character-reference-1.1.0.tgz#b1e6e17009b1f20bc652a521309c5f22c85eb1c6"
+  integrity sha512-m9V0ExGv0jB1OT21mrWcuf4QhP46pH1KkfWy9ZEezqHKAxkj4mPCy3nIH1rkbdMlChLHX531eOrymlwyZIf2iw==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-decode-string@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-decode-string/-/micromark-util-decode-string-1.1.0.tgz#dc12b078cba7a3ff690d0203f95b5d5537f2809c"
+  integrity sha512-YphLGCK8gM1tG1bd54azwyrQRjCFcmgj2S2GoJDNnh4vYtnL38JS8M4gpxzOPNyHdNEpheyWXCTnnTDY3N+NVQ==
+  dependencies:
+    decode-named-character-reference "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-encode@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-encode/-/micromark-util-encode-1.1.0.tgz#92e4f565fd4ccb19e0dcae1afab9a173bbeb19a5"
+  integrity sha512-EuEzTWSTAj9PA5GOAs992GzNh2dGQO52UvAbtSOMvXTxv3Criqb6IOzJUBCmEqrrXSblJIJBbFFv6zPxpreiJw==
+
+micromark-util-html-tag-name@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-html-tag-name/-/micromark-util-html-tag-name-1.2.0.tgz#48fd7a25826f29d2f71479d3b4e83e94829b3588"
+  integrity sha512-VTQzcuQgFUD7yYztuQFKXT49KghjtETQ+Wv/zUjGSGBioZnkA4P1XXZPT1FHeJA6RwRXSF47yvJ1tsJdoxwO+Q==
+
+micromark-util-normalize-identifier@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-normalize-identifier/-/micromark-util-normalize-identifier-1.1.0.tgz#7a73f824eb9f10d442b4d7f120fecb9b38ebf8b7"
+  integrity sha512-N+w5vhqrBihhjdpM8+5Xsxy71QWqGn7HYNUvch71iV2PM7+E3uWGox1Qp90loa1ephtCxG2ftRV/Conitc6P2Q==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-resolve-all@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-resolve-all/-/micromark-util-resolve-all-1.1.0.tgz#4652a591ee8c8fa06714c9b54cd6c8e693671188"
+  integrity sha512-b/G6BTMSg+bX+xVCshPTPyAu2tmA0E4X98NSR7eIbeC6ycCqCeE7wjfDIgzEbkzdEVJXRtOG4FbEm/uGbCRouA==
+  dependencies:
+    micromark-util-types "^1.0.0"
+
+micromark-util-sanitize-uri@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-sanitize-uri/-/micromark-util-sanitize-uri-1.2.0.tgz#613f738e4400c6eedbc53590c67b197e30d7f90d"
+  integrity sha512-QO4GXv0XZfWey4pYFndLUKEAktKkG5kZTdUNaTAkzbuJxn2tNBOr+QtxR2XpWaMhbImT2dPzyLrPXLlPhph34A==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-encode "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-subtokenize@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-subtokenize/-/micromark-util-subtokenize-1.1.0.tgz#941c74f93a93eaf687b9054aeb94642b0e92edb1"
+  integrity sha512-kUQHyzRoxvZO2PuLzMt2P/dwVsTiivCK8icYTeR+3WgbuPqfHgPPy7nFKbeqRivBvn/3N3GBiNC+JRTMSxEC7A==
+  dependencies:
+    micromark-util-chunked "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    uvu "^0.5.0"
+
+micromark-util-symbol@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-symbol/-/micromark-util-symbol-1.1.0.tgz#813cd17837bdb912d069a12ebe3a44b6f7063142"
+  integrity sha512-uEjpEYY6KMs1g7QfJ2eX1SQEV+ZT4rUD3UcF6l57acZvLNK7PBZL+ty82Z1qhK1/yXIY4bdx04FKMgR0g4IAag==
+
+micromark-util-types@^1.0.0, micromark-util-types@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/micromark-util-types/-/micromark-util-types-1.1.0.tgz#e6676a8cae0bb86a2171c498167971886cb7e283"
+  integrity sha512-ukRBgie8TIAcacscVHSiddHjO4k/q3pnedmzMQ4iwDcK0FtFCohKOlFbaOL/mPgfnPsL3C1ZyxJa4sbWrBl3jg==
+
+micromark@^3.0.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/micromark/-/micromark-3.2.0.tgz#1af9fef3f995ea1ea4ac9c7e2f19c48fd5c006e9"
+  integrity sha512-uD66tJj54JLYq0De10AhWycZWGQNUvDI55xPgk2sQM5kn1JYlhbCMTtEeT27+vAhW2FBQxLlOmS3pmA7/2z4aA==
+  dependencies:
+    "@types/debug" "^4.0.0"
+    debug "^4.0.0"
+    decode-named-character-reference "^1.0.0"
+    micromark-core-commonmark "^1.0.1"
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-chunked "^1.0.0"
+    micromark-util-combine-extensions "^1.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-encode "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-resolve-all "^1.0.0"
+    micromark-util-sanitize-uri "^1.0.0"
+    micromark-util-subtokenize "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.1"
+    uvu "^0.5.0"
+
 micromatch@^3.1.10:
  version "3.1.10"
  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23"
@ -14278,7 +14591,7 @@ moment@^2.27.0:
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108"
  integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==

-mri@^1.2.0:
+mri@^1.1.0, mri@^1.2.0:
  version "1.2.0"
  resolved "https://registry.yarnpkg.com/mri/-/mri-1.2.0.tgz#6721480fec2a11a4889861115a48b6cbe7cc8f0b"
  integrity sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==
@ -14416,10 +14729,10 @@ neo-async@^2.5.0, neo-async@^2.6.2:
  resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f"
  integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==

-ng-extract-i18n-merge@2.8.3:
-  version "2.8.3"
-  resolved "https://registry.yarnpkg.com/ng-extract-i18n-merge/-/ng-extract-i18n-merge-2.8.3.tgz#a092f7758df7c566df7a1d710dbc709c6a8f56d1"
-  integrity sha512-w6LdzpfjRBLpT7lnMEqduivjn6kg2oKDZBL6P9W5GKRZ4bgmFthAmwN1lvWrzkwcPHPARJR+qC4DBRVsv4vmkg==
+ng-extract-i18n-merge@2.9.0:
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/ng-extract-i18n-merge/-/ng-extract-i18n-merge-2.9.0.tgz#a487e3cec76a266c7bb61985de62f87828ee2e21"
+  integrity sha512-xKdkegJcJCzbvsy07IaSxz2AmkHdF3l0UR5mLr5CHai2g1VHD0xhoHPk/6kFFDNJ42fQT8EybPH/YcqZUt2iQg==
  dependencies:
    "@angular-devkit/architect" "^0.1301.0 || ^0.1401.0 || ^0.1501.0 || ^0.1601.0 || ^0.1700.0"
    "@angular-devkit/core" "^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0"
@ -14434,17 +14747,17 @@ ngx-device-detector@5.0.1:
  dependencies:
    tslib "^2.0.0"

-ngx-markdown@15.1.0:
-  version "15.1.0"
-  resolved "https://registry.yarnpkg.com/ngx-markdown/-/ngx-markdown-15.1.0.tgz#819e0b07027cf57a10a5cfe5bbac214e426a572b"
-  integrity sha512-BmbhIY9O4ldPxEymjrCUHgwWPphfY2nO36QoNU8UCzFThkbxcgsfWmyM3fBm81W1BbOPt6mxz6PVx6MaOinB9A==
+ngx-markdown@17.1.1:
+  version "17.1.1"
+  resolved "https://registry.yarnpkg.com/ngx-markdown/-/ngx-markdown-17.1.1.tgz#6e9c34fe8d470621b4609d68e8a403efb72b4e66"
+  integrity sha512-BGNWGJ6tmfPx+ScZFq5qeGLgWJwsakjScZ2e+oUzm+97DAHpIHSl8gptNZvZgRhOiFdjLcKBcuY2Rz8WB6J6UQ==
  dependencies:
    tslib "^2.3.0"
  optionalDependencies:
    clipboard "^2.0.11"
-    emoji-toolkit "^7.0.0"
+    emoji-toolkit "^8.0.0"
    katex "^0.16.0"
-    mermaid "^9.1.2"
+    mermaid "^10.6.0"
    prismjs "^1.28.0"

 ngx-skeleton-loader@7.0.0:
@ -16584,6 +16897,13 @@ rxjs@7.5.6, rxjs@7.8.1, rxjs@^6.3.3, rxjs@^6.4.0, rxjs@^6.5.3, rxjs@^7.8.0, rxjs
  dependencies:
    tslib "^2.1.0"

+sade@^1.7.3:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/sade/-/sade-1.8.1.tgz#0a78e81d658d394887be57d2a409bf703a3b2701"
+  integrity sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==
+  dependencies:
+    mri "^1.1.0"
+
 safe-array-concat@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.0.1.tgz#91686a63ce3adbea14d61b14c99572a8ff84754c"
@ -17569,7 +17889,7 @@ stylehacks@^6.0.0:
    browserslist "^4.21.4"
    postcss-selector-parser "^6.0.4"

-stylis@^4.1.2:
+stylis@^4.1.3:
  version "4.3.0"
  resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.3.0.tgz#abe305a669fc3d8777e10eefcfc73ad861c5588c"
  integrity sha512-E87pIogpwUsUwXw7dNyU4QDjdgVMy52m+XEOPEKUn161cCzWjjhPSQhByfd1CcNvrOLnXQ6OnnZDwnJrz/Z4YQ==
@ -18345,6 +18665,13 @@ unist-util-is@^4.0.0:
  resolved "https://registry.yarnpkg.com/unist-util-is/-/unist-util-is-4.1.0.tgz#976e5f462a7a5de73d94b706bac1b90671b57797"
  integrity sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg==

+unist-util-stringify-position@^3.0.0:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/unist-util-stringify-position/-/unist-util-stringify-position-3.0.3.tgz#03ad3348210c2d930772d64b489580c13a7db39d"
+  integrity sha512-k5GzIBZ/QatR8N5X2y+drfpWG8IDBzdnVj6OInRNWm1oXrzydiaAT2OQiA8DPRRZyAKb9b6I2a6PxYklZD0gKg==
+  dependencies:
+    "@types/unist" "^2.0.0"
+
 unist-util-visit-parents@^3.0.0:
  version "3.1.1"
  resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-3.1.1.tgz#65a6ce698f78a6b0f56aa0e88f13801886cdaef6"
@ -18514,6 +18841,16 @@ uuid@^8.3.0, uuid@^8.3.2:
  resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
  integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==

+uvu@^0.5.0:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/uvu/-/uvu-0.5.6.tgz#2754ca20bcb0bb59b64e9985e84d2e81058502df"
+  integrity sha512-+g8ENReyr8YsOc6fv/NVJs2vFdHBnBNdfE49rshrTzDWOlUx4Gq7KOS2GD8eqhy2j+Ejq29+SbKH8yjkAqXqoA==
+  dependencies:
+    dequal "^2.0.0"
+    diff "^5.0.0"
+    kleur "^4.0.3"
+    sade "^1.7.3"
+
 v8-compile-cache-lib@^3.0.1:
  version "3.0.1"
  resolved "https://registry.yarnpkg.com/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
Author	SHA1	Message	Date
Thomas Kaul	2c7ece50fe	Release 2.29.0 (#2733 )	2023-12-09 17:14:13 +01:00
Thomas Kaul	51a0ede3e4	Feature/introduce lazy loaded activities table (#2729 ) * Introduce lazy-loaded activities table * Add icon column * Emit paginator event * Add pagination logic * Integrate total items * Update changelog	2023-12-09 17:12:09 +01:00
Thomas Kaul	531964636b	Fix type (#2708 )	2023-12-08 19:59:06 +01:00
sadmimye	e461fff1d7	Extend turkish localization (#2730 )	2023-12-07 14:13:28 +01:00
Thomas Kaul	4f9a5f0340	Feature/set actions columns of tables to stick at end (#2726 ) * Set up stickyEnd in actions columns * Update changelog	2023-12-06 18:35:03 +01:00
Thomas Kaul	8d80e840b8	Feature/upgrade ngx markdown to version 17.1.1 (#2714 ) * Upgrade marked and ngx-markdown * Update changelog	2023-12-05 18:16:03 +01:00
Thomas Kaul	833982a9de	Bugfix/fix biometric authentication registration (#2713 ) * Remove token on device registration * Update changelog	2023-12-05 18:13:35 +01:00
sadmimye	c85966e5ed	Improve language localization for tr (#2717 ) * Improve language localization for tr * Update changelog	2023-12-04 21:04:20 +01:00
Thomas Kaul	43f67ba832	Feature/upgrade ng extract i18n merge to version 2.9.0 (#2715 ) * Upgrade ng-extract-i18n-merge to version 2.9.0 * Update changelog	2023-12-04 19:54:43 +01:00
Thomas Kaul	cbea8ac9d3	Feature/increase tab height on mobile (#2712 ) * Increase tab height on mobile * Update changelog	2023-12-04 19:53:50 +01:00
Thomas Kaul	d4c939e41d	Feature/improve language localization for german 20231202 (#2710 ) * Update locales * Update changelog	2023-12-03 09:26:12 +01:00