From 24716f0561e8a9aadbcf24e21fec63b97211c6be Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sun, 9 Apr 2023 08:55:09 +0200
Subject: [PATCH] Migrate checkbox and chips components to Angular Material 15
 (#1839)

---
 apps/client/src/app/app.module.ts                         | 2 +-
 .../login-with-access-token-dialog.component.ts           | 2 +-
 .../login-with-access-token-dialog.module.ts              | 2 +-
 .../login-with-access-token-dialog.scss                   | 2 +-
 .../position-detail-dialog/position-detail-dialog.html    | 8 +++++---
 .../position-detail-dialog.module.ts                      | 2 +-
 .../create-or-update-account-dialog.module.ts             | 2 +-
 7 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/apps/client/src/app/app.module.ts b/apps/client/src/app/app.module.ts
index ff400bcfb..f463718fd 100644
--- a/apps/client/src/app/app.module.ts
+++ b/apps/client/src/app/app.module.ts
@@ -8,7 +8,7 @@ import {
   MatNativeDateModule
 } from '@angular/material/core';
 import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
+import { MatChipsModule } from '@angular/material/chips';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { BrowserModule } from '@angular/platform-browser';
diff --git 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
index 3acd5cd4d..154ff29dc 100644
--- 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
@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
-import { MatLegacyCheckboxChange as MatCheckboxChange } from '@angular/material/legacy-checkbox';
+import { MatCheckboxChange } from '@angular/material/checkbox';
 import {
   MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
   MatLegacyDialogRef as MatDialogRef
diff --git a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.module.ts b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.module.ts
index 7c8540ea1..fad400587 100644
--- a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.module.ts
+++ b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.module.ts
@@ -3,7 +3,7 @@ import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
 import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
diff --git a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.scss b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.scss
index 717891cbe..c2d96b648 100644
--- a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.scss
+++ b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.scss
@@ -5,7 +5,7 @@
     box-sizing: content-box;
   }
 
-  .mat-checkbox {
+  .mat-mdc-checkbox {
     ::ng-deep {
       label {
         margin-bottom: 0;
diff --git a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html
index 7b009d85e..eaaf3b782 100644
--- a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html
+++ b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html
@@ -257,9 +257,11 @@
     <div *ngIf="tags?.length > 0" class="row">
       <div class="col">
         <div class="h5" i18n>Tags</div>
-        <mat-chip-list>
-          <mat-chip *ngFor="let tag of tags">{{ tag.name }}</mat-chip>
-        </mat-chip-list>
+        <mat-chip-listbox>
+          <mat-chip-option *ngFor="let tag of tags" disabled
+            >{{ tag.name }}</mat-chip-option
+          >
+        </mat-chip-listbox>
       </div>
     </div>
 
diff --git a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.module.ts b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.module.ts
index e4ebd7dd0..8ca9ae685 100644
--- a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.module.ts
+++ b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.module.ts
@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
+import { MatChipsModule } from '@angular/material/chips';
 import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { GfDialogFooterModule } from '@ghostfolio/client/components/dialog-footer/dialog-footer.module';
 import { GfDialogHeaderModule } from '@ghostfolio/client/components/dialog-header/dialog-header.module';
diff --git a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
index 902309f4f..e0232ded3 100644
--- a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
+++ b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
@@ -2,7 +2,7 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
 import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';