Task/improve typings of dialogs (#5846)

* Improve typings
3 days ago · ecc35c9ffa
22 changed files with 221 additions and 144 deletions
--- a/apps/client/src/app/app.component.ts
+++ b/apps/client/src/app/app.component.ts
@ -276,7 +276,10 @@ export class AppComponent implements OnDestroy, OnInit {
      .subscribe((user) => {
        this.user = user;

-        const dialogRef = this.dialog.open(GfHoldingDetailDialogComponent, {
+        const dialogRef = this.dialog.open<
+          GfHoldingDetailDialogComponent,
+          HoldingDetailDialogParams
+        >(GfHoldingDetailDialogComponent, {
          autoFocus: false,
          data: {
            dataSource,
@ -302,7 +305,7 @@ export class AppComponent implements OnDestroy, OnInit {
              hasPermission(this.user?.permissions, permissions.updateOrder) &&
              !this.user?.settings?.isRestrictedView,
            locale: this.user?.settings?.locale
-          } as HoldingDetailDialogParams,
+          },
          height: this.deviceType === 'mobile' ? '98vh' : '80vh',
          width: this.deviceType === 'mobile' ? '100vw' : '50rem'
        });
--- a/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
+++ b/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
@ -430,7 +430,10 @@ export class GfAdminMarketDataComponent
      .subscribe((user) => {
        this.user = user;

-        const dialogRef = this.dialog.open(GfAssetProfileDialogComponent, {
+        const dialogRef = this.dialog.open<
+          GfAssetProfileDialogComponent,
+          AssetProfileDialogParams
+        >(GfAssetProfileDialogComponent, {
          autoFocus: false,
          data: {
            dataSource,
@ -438,7 +441,7 @@ export class GfAdminMarketDataComponent
            colorScheme: this.user?.settings.colorScheme,
            deviceType: this.deviceType,
            locale: this.user?.settings?.locale
-          } as AssetProfileDialogParams,
+          },
          height: this.deviceType === 'mobile' ? '98vh' : '80vh',
          width: this.deviceType === 'mobile' ? '100vw' : '50rem'
        });
@ -465,17 +468,17 @@ export class GfAdminMarketDataComponent
      .subscribe((user) => {
        this.user = user;

-        const dialogRef = this.dialog.open(
+        const dialogRef = this.dialog.open<
          GfCreateAssetProfileDialogComponent,
-          {
-            autoFocus: false,
-            data: {
-              deviceType: this.deviceType,
-              locale: this.user?.settings?.locale
-            } as CreateAssetProfileDialogParams,
-            width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-          }
-        );
+          CreateAssetProfileDialogParams
+        >(GfCreateAssetProfileDialogComponent, {
+          autoFocus: false,
+          data: {
+            deviceType: this.deviceType,
+            locale: this.user?.settings?.locale
+          },
+          width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+        });

        dialogRef
          .afterClosed()
--- a/apps/client/src/app/components/admin-platform/admin-platform.component.ts
+++ b/apps/client/src/app/components/admin-platform/admin-platform.component.ts
@ -34,6 +34,7 @@ import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject, takeUntil } from 'rxjs';

 import { GfCreateOrUpdatePlatformDialogComponent } from './create-or-update-platform-dialog/create-or-update-platform-dialog.component';
+import { CreateOrUpdatePlatformDialogParams } from './create-or-update-platform-dialog/interfaces/interfaces';

@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
@ -153,19 +154,20 @@ export class GfAdminPlatformComponent implements OnInit, OnDestroy {
  }

  private openCreatePlatformDialog() {
-    const dialogRef = this.dialog.open(
+    const dialogRef = this.dialog.open<
      GfCreateOrUpdatePlatformDialogComponent,
-      {
-        data: {
-          platform: {
-            name: null,
-            url: null
-          }
-        },
-        height: this.deviceType === 'mobile' ? '98vh' : undefined,
-        width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-      }
-    );
+      CreateOrUpdatePlatformDialogParams
+    >(GfCreateOrUpdatePlatformDialogComponent, {
+      data: {
+        platform: {
+          id: null,
+          name: null,
+          url: null
+        }
+      },
+      height: this.deviceType === 'mobile' ? '98vh' : undefined,
+      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+    });

    dialogRef
      .afterClosed()
@ -191,21 +193,29 @@ export class GfAdminPlatformComponent implements OnInit, OnDestroy {
      });
  }

-  private openUpdatePlatformDialog({ id, name, url }) {
-    const dialogRef = this.dialog.open(
+  private openUpdatePlatformDialog({
+    id,
+    name,
+    url
+  }: {
+    id: string;
+    name: string;
+    url: string;
+  }) {
+    const dialogRef = this.dialog.open<
      GfCreateOrUpdatePlatformDialogComponent,
-      {
-        data: {
-          platform: {
-            id,
-            name,
-            url
-          }
-        },
-        height: this.deviceType === 'mobile' ? '98vh' : undefined,
-        width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-      }
-    );
+      CreateOrUpdatePlatformDialogParams
+    >(GfCreateOrUpdatePlatformDialogComponent, {
+      data: {
+        platform: {
+          id,
+          name,
+          url
+        }
+      },
+      height: this.deviceType === 'mobile' ? '98vh' : undefined,
+      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+    });

    dialogRef
      .afterClosed()
--- a/apps/client/src/app/components/admin-tag/admin-tag.component.ts
+++ b/apps/client/src/app/components/admin-tag/admin-tag.component.ts
@ -32,6 +32,7 @@ import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject, takeUntil } from 'rxjs';

 import { GfCreateOrUpdateTagDialogComponent } from './create-or-update-tag-dialog/create-or-update-tag-dialog.component';
+import { CreateOrUpdateTagDialogParams } from './create-or-update-tag-dialog/interfaces/interfaces';

@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
@ -149,9 +150,13 @@ export class GfAdminTagComponent implements OnInit, OnDestroy {
  }

  private openCreateTagDialog() {
-    const dialogRef = this.dialog.open(GfCreateOrUpdateTagDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateTagDialogComponent,
+      CreateOrUpdateTagDialogParams
+    >(GfCreateOrUpdateTagDialogComponent, {
      data: {
        tag: {
+          id: null,
          name: null
        }
      },
@ -183,8 +188,11 @@ export class GfAdminTagComponent implements OnInit, OnDestroy {
      });
  }

-  private openUpdateTagDialog({ id, name }) {
-    const dialogRef = this.dialog.open(GfCreateOrUpdateTagDialogComponent, {
+  private openUpdateTagDialog({ id, name }: { id: string; name: string }) {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateTagDialogComponent,
+      CreateOrUpdateTagDialogParams
+    >(GfCreateOrUpdateTagDialogComponent, {
      data: {
        tag: {
          id,
--- a/apps/client/src/app/components/admin-tag/create-or-update-tag-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/components/admin-tag/create-or-update-tag-dialog/interfaces/interfaces.ts
@ -1,5 +1,5 @@
 import { Tag } from '@prisma/client';

 export interface CreateOrUpdateTagDialogParams {
-  tag: Tag;
+  tag: Pick<Tag, 'id' | 'name'>;
 }
--- a/apps/client/src/app/components/admin-users/admin-users.component.ts
+++ b/apps/client/src/app/components/admin-users/admin-users.component.ts
@ -288,14 +288,17 @@ export class GfAdminUsersComponent implements OnDestroy, OnInit {
      return;
    }

-    const dialogRef = this.dialog.open(GfUserDetailDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfUserDetailDialogComponent,
+      UserDetailDialogParams
+    >(GfUserDetailDialogComponent, {
      autoFocus: false,
      data: {
        userData,
        deviceType: this.deviceType,
        hasPermissionForSubscription: this.hasPermissionForSubscription,
        locale: this.user?.settings?.locale
-      } as UserDetailDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : '60vh',
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
--- a/apps/client/src/app/components/header/header.component.ts
+++ b/apps/client/src/app/components/header/header.component.ts
@ -1,4 +1,5 @@
 import { UpdateUserSettingDto } from '@ghostfolio/api/app/user/update-user-setting.dto';
+import { LoginWithAccessTokenDialogParams } from '@ghostfolio/client/components/login-with-access-token-dialog/interfaces/interfaces';
 import { GfLoginWithAccessTokenDialogComponent } from '@ghostfolio/client/components/login-with-access-token-dialog/login-with-access-token-dialog.component';
 import { LayoutService } from '@ghostfolio/client/core/layout.service';
 import { NotificationService } from '@ghostfolio/client/core/notification/notification.service';
@ -271,7 +272,10 @@ export class GfHeaderComponent implements OnChanges {
  }

  public openLoginDialog() {
-    const dialogRef = this.dialog.open(GfLoginWithAccessTokenDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfLoginWithAccessTokenDialogComponent,
+      LoginWithAccessTokenDialogParams
+    >(GfLoginWithAccessTokenDialogComponent, {
      autoFocus: false,
      data: {
        accessToken: '',
--- a/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts
+++ b/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts
@ -149,17 +149,17 @@ export class GfHomeWatchlistComponent implements OnDestroy, OnInit {
      .subscribe((user) => {
        this.user = user;

-        const dialogRef = this.dialog.open(
+        const dialogRef = this.dialog.open<
          GfCreateWatchlistItemDialogComponent,
-          {
-            autoFocus: false,
-            data: {
-              deviceType: this.deviceType,
-              locale: this.user?.settings?.locale
-            } as CreateWatchlistItemDialogParams,
-            width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-          }
-        );
+          CreateWatchlistItemDialogParams
+        >(GfCreateWatchlistItemDialogComponent, {
+          autoFocus: false,
+          data: {
+            deviceType: this.deviceType,
+            locale: this.user?.settings?.locale
+          },
+          width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+        });

        dialogRef
          .afterClosed()
--- a/apps/client/src/app/components/login-with-access-token-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/components/login-with-access-token-dialog/interfaces/interfaces.ts
@ -0,0 +1,5 @@
+export interface LoginWithAccessTokenDialogParams {
+  accessToken: string;
+  hasPermissionToUseSocialLogin: boolean;
+  title: string;
+}
--- 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
@ -26,6 +26,8 @@ import { IonIcon } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
 import { eyeOffOutline, eyeOutline } from 'ionicons/icons';

+import { LoginWithAccessTokenDialogParams } from './interfaces/interfaces';
+
@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [
@ -51,7 +53,7 @@ export class GfLoginWithAccessTokenDialogComponent {
  public isAccessTokenHidden = true;

  public constructor(
-    @Inject(MAT_DIALOG_DATA) public data: any,
+    @Inject(MAT_DIALOG_DATA) public data: LoginWithAccessTokenDialogParams,
    public dialogRef: MatDialogRef<GfLoginWithAccessTokenDialogComponent>,
    private internetIdentityService: InternetIdentityService,
    private router: Router,
--- a/apps/client/src/app/components/rule/rule.component.ts
+++ b/apps/client/src/app/components/rule/rule.component.ts
@ -79,13 +79,16 @@ export class GfRuleComponent implements OnInit {
  }

  public onCustomizeRule(rule: PortfolioReportRule) {
-    const dialogRef = this.dialog.open(GfRuleSettingsDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfRuleSettingsDialogComponent,
+      RuleSettingsDialogParams
+    >(GfRuleSettingsDialogComponent, {
      data: {
        rule,
        categoryName: this.categoryName,
        locale: this.locale,
        settings: this.settings
-      } as RuleSettingsDialogParams,
+      },
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });

--- a/apps/client/src/app/components/user-account-access/user-account-access.component.ts
+++ b/apps/client/src/app/components/user-account-access/user-account-access.component.ts
@ -31,6 +31,7 @@ import { EMPTY, Subject } from 'rxjs';
 import { catchError, takeUntil } from 'rxjs/operators';

 import { GfCreateOrUpdateAccessDialogComponent } from './create-or-update-access-dialog/create-or-update-access-dialog.component';
+import { CreateOrUpdateAccessDialogParams } from './create-or-update-access-dialog/interfaces/interfaces';

@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
@ -187,10 +188,15 @@ export class GfUserAccountAccessComponent implements OnDestroy, OnInit {
  }

  private openCreateAccessDialog() {
-    const dialogRef = this.dialog.open(GfCreateOrUpdateAccessDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateAccessDialogComponent,
+      CreateOrUpdateAccessDialogParams
+    >(GfCreateOrUpdateAccessDialogComponent, {
      data: {
        access: {
          alias: '',
+          grantee: null,
+          id: null,
          permissions: ['READ_RESTRICTED'],
          type: 'PRIVATE'
        }
@ -219,12 +225,15 @@ export class GfUserAccountAccessComponent implements OnDestroy, OnInit {
      return;
    }

-    const dialogRef = this.dialog.open(GfCreateOrUpdateAccessDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateAccessDialogComponent,
+      CreateOrUpdateAccessDialogParams
+    >(GfCreateOrUpdateAccessDialogComponent, {
      data: {
        access: {
          alias: access.alias,
-          id: access.id,
          grantee: access.grantee === 'Public' ? null : access.grantee,
+          id: access.id,
          permissions: access.permissions,
          type: access.type
        }
--- a/apps/client/src/app/pages/accounts/accounts-page.component.ts
+++ b/apps/client/src/app/pages/accounts/accounts-page.component.ts
@ -23,6 +23,8 @@ import { EMPTY, Subject, Subscription } from 'rxjs';
 import { catchError, takeUntil } from 'rxjs/operators';

 import { GfCreateOrUpdateAccountDialogComponent } from './create-or-update-account-dialog/create-or-update-account-dialog.component';
+import { CreateOrUpdateAccountDialogParams } from './create-or-update-account-dialog/interfaces/interfaces';
+import { TransferBalanceDialogParams } from './transfer-balance/interfaces/interfaces';
 import { GfTransferBalanceDialogComponent } from './transfer-balance/transfer-balance-dialog.component';

@Component({
@ -179,7 +181,10 @@ export class GfAccountsPageComponent implements OnDestroy, OnInit {
    name,
    platformId
  }: AccountModel) {
-    const dialogRef = this.dialog.open(GfCreateOrUpdateAccountDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateAccountDialogComponent,
+      CreateOrUpdateAccountDialogParams
+    >(GfCreateOrUpdateAccountDialogComponent, {
      data: {
        account: {
          balance,
@ -227,7 +232,10 @@ export class GfAccountsPageComponent implements OnDestroy, OnInit {
  }

  private openAccountDetailDialog(aAccountId: string) {
-    const dialogRef = this.dialog.open(GfAccountDetailDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfAccountDetailDialogComponent,
+      AccountDetailDialogParams
+    >(GfAccountDetailDialogComponent, {
      autoFocus: false,
      data: {
        accountId: aAccountId,
@ -237,7 +245,7 @@ export class GfAccountsPageComponent implements OnDestroy, OnInit {
          !this.hasImpersonationId &&
          hasPermission(this.user?.permissions, permissions.createOrder) &&
          !this.user?.settings?.isRestrictedView
-      } as AccountDetailDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : '80vh',
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
@ -253,12 +261,16 @@ export class GfAccountsPageComponent implements OnDestroy, OnInit {
  }

  private openCreateAccountDialog() {
-    const dialogRef = this.dialog.open(GfCreateOrUpdateAccountDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfCreateOrUpdateAccountDialogComponent,
+      CreateOrUpdateAccountDialogParams
+    >(GfCreateOrUpdateAccountDialogComponent, {
      data: {
        account: {
          balance: 0,
          comment: null,
          currency: this.user?.settings?.baseCurrency,
+          id: null,
          isExcluded: false,
          name: null,
          platformId: null
@ -295,7 +307,10 @@ export class GfAccountsPageComponent implements OnDestroy, OnInit {
  }

  private openTransferBalanceDialog() {
-    const dialogRef = this.dialog.open(GfTransferBalanceDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfTransferBalanceDialogComponent,
+      TransferBalanceDialogParams
+    >(GfTransferBalanceDialogComponent, {
      data: {
        accounts: this.accounts
      },
--- a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/interfaces/interfaces.ts
@ -1,5 +1,5 @@
 import { Account } from '@prisma/client';

 export interface CreateOrUpdateAccountDialogParams {
-  account: Account;
+  account: Omit<Account, 'createdAt' | 'updatedAt' | 'userId'>;
 }
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
@ -28,6 +28,7 @@ import { Subject, Subscription } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

 import { GfCreateOrUpdateActivityDialogComponent } from './create-or-update-activity-dialog/create-or-update-activity-dialog.component';
+import { CreateOrUpdateActivityDialogParams } from './create-or-update-activity-dialog/interfaces/interfaces';
 import { GfImportActivitiesDialogComponent } from './import-activities-dialog/import-activities-dialog.component';
 import { ImportActivitiesDialogParams } from './import-activities-dialog/interfaces/interfaces';

@ -245,11 +246,14 @@ export class GfActivitiesPageComponent implements OnDestroy, OnInit {
  }

  public onImport() {
-    const dialogRef = this.dialog.open(GfImportActivitiesDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfImportActivitiesDialogComponent,
+      ImportActivitiesDialogParams
+    >(GfImportActivitiesDialogComponent, {
      data: {
        deviceType: this.deviceType,
        user: this.user
-      } as ImportActivitiesDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : undefined,
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
@ -268,12 +272,15 @@ export class GfActivitiesPageComponent implements OnDestroy, OnInit {
  }

  public onImportDividends() {
-    const dialogRef = this.dialog.open(GfImportActivitiesDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfImportActivitiesDialogComponent,
+      ImportActivitiesDialogParams
+    >(GfImportActivitiesDialogComponent, {
      data: {
        activityTypes: ['DIVIDEND'],
        deviceType: this.deviceType,
        user: this.user
-      } as ImportActivitiesDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : undefined,
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
@ -306,18 +313,18 @@ export class GfActivitiesPageComponent implements OnDestroy, OnInit {
  }

  public openUpdateActivityDialog(aActivity: Activity) {
-    const dialogRef = this.dialog.open(
+    const dialogRef = this.dialog.open<
      GfCreateOrUpdateActivityDialogComponent,
-      {
-        data: {
-          activity: aActivity,
-          accounts: this.user?.accounts,
-          user: this.user
-        },
-        height: this.deviceType === 'mobile' ? '98vh' : '80vh',
-        width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-      }
-    );
+      CreateOrUpdateActivityDialogParams
+    >(GfCreateOrUpdateActivityDialogComponent, {
+      data: {
+        activity: aActivity,
+        accounts: this.user?.accounts,
+        user: this.user
+      },
+      height: this.deviceType === 'mobile' ? '98vh' : '80vh',
+      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+    });

    dialogRef
      .afterClosed()
@ -350,26 +357,26 @@ export class GfActivitiesPageComponent implements OnDestroy, OnInit {
      .subscribe((user) => {
        this.updateUser(user);

-        const dialogRef = this.dialog.open(
+        const dialogRef = this.dialog.open<
          GfCreateOrUpdateActivityDialogComponent,
-          {
-            data: {
-              accounts: this.user?.accounts,
-              activity: {
-                ...aActivity,
-                accountId: aActivity?.accountId,
-                date: new Date(),
-                id: null,
-                fee: 0,
-                type: aActivity?.type ?? 'BUY',
-                unitPrice: null
-              },
-              user: this.user
+          CreateOrUpdateActivityDialogParams
+        >(GfCreateOrUpdateActivityDialogComponent, {
+          data: {
+            accounts: this.user?.accounts,
+            activity: {
+              ...aActivity,
+              accountId: aActivity?.accountId,
+              date: new Date(),
+              id: null,
+              fee: 0,
+              type: aActivity?.type ?? 'BUY',
+              unitPrice: null
            },
-            height: this.deviceType === 'mobile' ? '98vh' : '80vh',
-            width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-          }
-        );
+            user: this.user
+          },
+          height: this.deviceType === 'mobile' ? '98vh' : '80vh',
+          width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+        });

        dialogRef
          .afterClosed()
--- a/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/interfaces/interfaces.ts
@ -4,7 +4,6 @@ import { User } from '@ghostfolio/common/interfaces';
 import { Account } from '@prisma/client';

 export interface CreateOrUpdateActivityDialogParams {
-  accountId: string;
  accounts: Account[];
  activity: Activity;
  user: User;
--- a/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/interfaces/interfaces.ts
@ -3,7 +3,7 @@ import { User } from '@ghostfolio/common/interfaces';
 import { Type } from '@prisma/client';

 export interface ImportActivitiesDialogParams {
-  activityTypes: Type[];
+  activityTypes?: Type[];
  deviceType: string;
  user: User;
 }
--- a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts
@ -558,7 +558,10 @@ export class GfAllocationsPageComponent implements OnDestroy, OnInit {
  }

  private openAccountDetailDialog(aAccountId: string) {
-    const dialogRef = this.dialog.open(GfAccountDetailDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfAccountDetailDialogComponent,
+      AccountDetailDialogParams
+    >(GfAccountDetailDialogComponent, {
      autoFocus: false,
      data: {
        accountId: aAccountId,
@ -568,7 +571,7 @@ export class GfAllocationsPageComponent implements OnDestroy, OnInit {
          !this.hasImpersonationId &&
          hasPermission(this.user?.permissions, permissions.createOrder) &&
          !this.user?.settings?.isRestrictedView
-      } as AccountDetailDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : '80vh',
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
--- a/apps/client/src/app/pages/register/register-page.component.ts
+++ b/apps/client/src/app/pages/register/register-page.component.ts
@ -84,18 +84,18 @@ export class GfRegisterPageComponent implements OnDestroy, OnInit {
  }

  public openShowAccessTokenDialog() {
-    const dialogRef = this.dialog.open(
+    const dialogRef = this.dialog.open<
      GfUserAccountRegistrationDialogComponent,
-      {
-        data: {
-          deviceType: this.deviceType,
-          needsToAcceptTermsOfService: this.hasPermissionForSubscription
-        } as UserAccountRegistrationDialogParams,
-        disableClose: true,
-        height: this.deviceType === 'mobile' ? '98vh' : undefined,
-        width: this.deviceType === 'mobile' ? '100vw' : '30rem'
-      }
-    );
+      UserAccountRegistrationDialogParams
+    >(GfUserAccountRegistrationDialogComponent, {
+      data: {
+        deviceType: this.deviceType,
+        needsToAcceptTermsOfService: this.hasPermissionForSubscription
+      },
+      disableClose: true,
+      height: this.deviceType === 'mobile' ? '98vh' : undefined,
+      width: this.deviceType === 'mobile' ? '100vw' : '30rem'
+    });

    dialogRef
      .afterClosed()
--- a/apps/client/src/app/services/user/user.service.ts
+++ b/apps/client/src/app/services/user/user.service.ts
@ -116,18 +116,18 @@ export class UserService extends ObservableStore<UserStoreState> {
            permissions.enableSubscriptionInterstitial
          )
        ) {
-          const dialogRef = this.dialog.open(
+          const dialogRef = this.dialog.open<
            GfSubscriptionInterstitialDialogComponent,
-            {
-              autoFocus: false,
-              data: {
-                user
-              } as SubscriptionInterstitialDialogParams,
-              disableClose: true,
-              height: this.deviceType === 'mobile' ? '98vh' : '80vh',
-              width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-            }
-          );
+            SubscriptionInterstitialDialogParams
+          >(GfSubscriptionInterstitialDialogComponent, {
+            autoFocus: false,
+            data: {
+              user
+            },
+            disableClose: true,
+            height: this.deviceType === 'mobile' ? '98vh' : '80vh',
+            width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+          });

          dialogRef
            .afterClosed()
--- a/libs/ui/src/lib/benchmark/benchmark.component.ts
+++ b/libs/ui/src/lib/benchmark/benchmark.component.ts
@ -155,14 +155,17 @@ export class GfBenchmarkComponent implements OnChanges, OnDestroy {
    dataSource,
    symbol
  }: AssetProfileIdentifier) {
-    const dialogRef = this.dialog.open(GfBenchmarkDetailDialogComponent, {
+    const dialogRef = this.dialog.open<
+      GfBenchmarkDetailDialogComponent,
+      BenchmarkDetailDialogParams
+    >(GfBenchmarkDetailDialogComponent, {
      data: {
        dataSource,
        symbol,
        colorScheme: this.user?.settings?.colorScheme,
        deviceType: this.deviceType,
        locale: this.locale
-      } as BenchmarkDetailDialogParams,
+      },
      height: this.deviceType === 'mobile' ? '98vh' : undefined,
      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
    });
--- a/libs/ui/src/lib/historical-market-data-editor/historical-market-data-editor.component.ts
+++ b/libs/ui/src/lib/historical-market-data-editor/historical-market-data-editor.component.ts
@ -199,21 +199,21 @@ export class GfHistoricalMarketDataEditorComponent
  }) {
    const marketPrice = this.marketDataByMonth[yearMonth]?.[day]?.marketPrice;

-    const dialogRef = this.dialog.open(
+    const dialogRef = this.dialog.open<
      GfHistoricalMarketDataEditorDialogComponent,
-      {
-        data: {
-          marketPrice,
-          currency: this.currency,
-          dataSource: this.dataSource,
-          dateString: `${yearMonth}-${day}`,
-          symbol: this.symbol,
-          user: this.user
-        } as HistoricalMarketDataEditorDialogParams,
-        height: this.deviceType === 'mobile' ? '98vh' : '80vh',
-        width: this.deviceType === 'mobile' ? '100vw' : '50rem'
-      }
-    );
+      HistoricalMarketDataEditorDialogParams
+    >(GfHistoricalMarketDataEditorDialogComponent, {
+      data: {
+        marketPrice,
+        currency: this.currency,
+        dataSource: this.dataSource,
+        dateString: `${yearMonth}-${day}`,
+        symbol: this.symbol,
+        user: this.user
+      },
+      height: this.deviceType === 'mobile' ? '98vh' : '80vh',
+      width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+    });

    dialogRef
      .afterClosed()