Merge pull request #2077 from ORCID/angular-update-15-16t

Angular update 15 16
ORCID · Oct 17, 2023 · 93f80f8 · 93f80f8
2 parents 66092e5 + 71fb765
commit 93f80f8
Show file tree

Hide file tree

Showing 309 changed files with 4,162 additions and 2,551 deletions.
diff --git a/package.json b/package.json
@@ -43,22 +43,21 @@
   },
   "private": true,
   "dependencies": {
-    "@angular-devkit/core": "^14.2.11",
-    "@angular/animations": "^14.2.9",
-    "@angular/cdk": "^14.2.6",
-    "@angular/common": "^14.2.9",
-    "@angular/compiler": "^14.2.9",
-    "@angular/core": "^14.2.9",
-    "@angular/forms": "^14.2.9",
-    "@angular/localize": "^14.2.9",
-    "@angular/material": "^14.2.6",
-    "@angular/platform-browser": "^14.2.9",
-    "@angular/platform-browser-dynamic": "^14.2.9",
-    "@angular/router": "^14.2.9",
-    "@angular/service-worker": "^14.2.9",
+    "@angular-devkit/core": "^16.2.6",
+    "@angular/animations": "^16.2.8",
+    "@angular/cdk": "^16.2.8",
+    "@angular/common": "^16.2.8",
+    "@angular/compiler": "^16.2.8",
+    "@angular/core": "^16.2.8",
+    "@angular/forms": "^16.2.8",
+    "@angular/localize": "^16.2.8",
+    "@angular/material": "^16.2.8",
+    "@angular/platform-browser": "^16.2.8",
+    "@angular/platform-browser-dynamic": "^16.2.8",
+    "@angular/router": "^16.2.8",
+    "@angular/service-worker": "^16.2.8",
     "@orcid/bibtex-parse-js": "0.0.25",
     "@storybook/addon-a11y": "^7.3.0",
-
     "browserslist": "^4.19.1",
     "browserslist-useragent-regexp": "^3.0.0",
     "core-js": "^3.6.5",
@@ -72,24 +71,22 @@
     "jwt-decode": "^3.1.2",
     "karma-jasmine-html-reporter": "^1.7.0",
     "lodash": "^4.17.20",
-    "ngx-cookie-service": "^14.0.1",
+    "ngx-cookie-service": "^15",
     "nodemailer": "^6.7.2",
     "properties-to-json": "^0.1.4",
     "puppeteer": "^19.2.2",
     "rxjs": "~6.5.2",
     "stream": "0.0.2",
     "timers": "^0.1.1",
-    "tslib": "^2.0.0",
-    "tslint-etc": "^1.13.7",
     "xml2js": "^0.5.0",
-    "zone.js": "~0.11.4"
+    "zone.js": "~0.13.3"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^14.2.8",
-    "@angular-devkit/schematics": "14.2.11",
-    "@angular/cli": "^14.2.8",
-    "@angular/compiler-cli": "^14.2.9",
-    "@angular/language-service": "^14.2.9",
+    "@angular-devkit/build-angular": "^16.2.6",
+    "@angular-devkit/schematics": "16.2.6",
+    "@angular/cli": "^16.2.6",
+    "@angular/compiler-cli": "^16.2.8",
+    "@angular/language-service": "^16.2.8",
     "@babel/core": "^7.6.0",
     "@compodoc/compodoc": "^1.1.21",
     "@storybook/addon-essentials": "^7.0.17",
@@ -116,7 +113,7 @@
     "glob": "^7.1.6",
     "gmail-tester-extended": "^1.1.2",
     "gulp": "^4.0.2",
-    "jasmine-core": "~3.6.0",
+    "jasmine-core": "~3.8.0",
     "jasmine-spec-reporter": "~5.0.0",
     "karma": "^6.3.16",
     "karma-chrome-launcher": "~3.1.0",
@@ -139,6 +136,6 @@
     "ts-node": "^8.5.2",
     "tslint": "~6.1.0",
     "tslint-config-prettier": "^1.18.0",
-    "typescript": "~4.8.4"
+    "typescript": "~5.1.6"
   }
-}
+}
diff --git a/src/app/account-settings/account-settings.module.ts b/src/app/account-settings/account-settings.module.ts
@@ -2,20 +2,20 @@ import { TextFieldModule } from '@angular/cdk/text-field'
 import { CommonModule } from '@angular/common'
 import { NgModule } from '@angular/core'
 import { FormsModule, ReactiveFormsModule } from '@angular/forms'
-import { MatButtonModule } from '@angular/material/button'
-import { MatCheckboxModule } from '@angular/material/checkbox'
-import { MatOptionModule } from '@angular/material/core'
-import { MatDialogModule } from '@angular/material/dialog'
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button'
+import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox'
+import { MatLegacyOptionModule as MatOptionModule } from '@angular/material/legacy-core'
+import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog'
 import { MatDividerModule } from '@angular/material/divider'
-import { MatFormFieldModule } from '@angular/material/form-field'
+import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field'
 import { MatIconModule } from '@angular/material/icon'
-import { MatInputModule } from '@angular/material/input'
-import { MatMenuModule } from '@angular/material/menu'
-import { MatProgressBarModule } from '@angular/material/progress-bar'
-import { MatRadioModule } from '@angular/material/radio'
-import { MatSelectModule } from '@angular/material/select'
-import { MatTableModule } from '@angular/material/table'
-import { MatTooltipModule } from '@angular/material/tooltip'
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input'
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu'
+import { MatLegacyProgressBarModule as MatProgressBarModule } from '@angular/material/legacy-progress-bar'
+import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio'
+import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select'
+import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table'
+import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip'
 
 import { AccountPanelModule } from '../cdk/account-panel/account-panel.module'
 import { ModalModule } from '../cdk/modal/modal.module'

diff --git a/...-duplicated-merged-confirmed/dialog-actions-duplicated-merged-confirmed.component.spec.ts b/...-duplicated-merged-confirmed/dialog-actions-duplicated-merged-confirmed.component.spec.ts
@@ -1,7 +1,10 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 
 import { DialogActionsDuplicatedMergedConfirmedComponent } from './dialog-actions-duplicated-merged-confirmed.component'
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'
+import {
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 
 describe('DialogActionsDuplicatedMergedConfirmedComponent', () => {
   let component: DialogActionsDuplicatedMergedConfirmedComponent

diff --git a/...tions-duplicated-merged-confirmed/dialog-actions-duplicated-merged-confirmed.component.ts b/...tions-duplicated-merged-confirmed/dialog-actions-duplicated-merged-confirmed.component.ts
@@ -1,5 +1,8 @@
 import { Component, Inject, OnInit } from '@angular/core'
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'
+import {
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 import { DuplicateRemoveEndpoint } from 'src/app/types/account-actions-duplicated'
 import { environment } from 'src/environments/environment'
 

diff --git a/...ns-duplicated-two-factor-auth/dialog-actions-duplicated-two-factor-auth.component.spec.ts b/...ns-duplicated-two-factor-auth/dialog-actions-duplicated-two-factor-auth.component.spec.ts
@@ -5,12 +5,12 @@ import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import {
-  MAT_DIALOG_DATA,
-  MatDialog,
-  MatDialogRef,
-} from '@angular/material/dialog'
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialog as MatDialog,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 import { Overlay } from '@angular/cdk/overlay'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'

diff --git a/...actions-duplicated-two-factor-auth/dialog-actions-duplicated-two-factor-auth.component.ts b/...actions-duplicated-two-factor-auth/dialog-actions-duplicated-two-factor-auth.component.ts
@@ -1,5 +1,8 @@
 import { Component, Inject, OnInit } from '@angular/core'
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'
+import {
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 import { OauthService } from 'src/app/core/oauth/oauth.service'
 import { DuplicateRemoveEndpoint } from 'src/app/types/account-actions-duplicated'
 

diff --git a/...settings/components/dialog-actions-duplicated/dialog-actions-duplicated.component.spec.ts b/...settings/components/dialog-actions-duplicated/dialog-actions-duplicated.component.spec.ts
@@ -4,15 +4,15 @@ import { DialogActionsDuplicatedComponent } from './dialog-actions-duplicated.co
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
 import {
-  MAT_DIALOG_DATA,
-  MatDialog,
-  MatDialogRef,
-} from '@angular/material/dialog'
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialog as MatDialog,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 
 describe('DialogActionsDuplicatedComponent', () => {

diff --git a/...ount-settings/components/dialog-actions-duplicated/dialog-actions-duplicated.component.ts b/...ount-settings/components/dialog-actions-duplicated/dialog-actions-duplicated.component.ts
@@ -1,5 +1,8 @@
 import { Component, Inject, OnInit } from '@angular/core'
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
+import {
+  MatLegacyDialogRef as MatDialogRef,
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+} from '@angular/material/legacy-dialog'
 import { PlatformInfoService } from 'src/app/cdk/platform-info'
 import { DuplicateRemoveEndpoint } from 'src/app/types/account-actions-duplicated'
 import { environment } from 'src/environments/environment'

diff --git a/...urity-alternate-account-delete/dialog-security-alternate-account-delete.component.spec.ts b/...urity-alternate-account-delete/dialog-security-alternate-account-delete.component.spec.ts
@@ -1,7 +1,10 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 
 import { DialogSecurityAlternateAccountDeleteComponent } from './dialog-security-alternate-account-delete.component'
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'
+import {
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 
 describe('DialogSecurityAlternateAccountDeleteComponent', () => {
   let component: DialogSecurityAlternateAccountDeleteComponent

diff --git a/...g-security-alternate-account-delete/dialog-security-alternate-account-delete.component.ts b/...g-security-alternate-account-delete/dialog-security-alternate-account-delete.component.ts
@@ -1,5 +1,8 @@
 import { Component, Inject, OnInit } from '@angular/core'
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
+import {
+  MatLegacyDialogRef as MatDialogRef,
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+} from '@angular/material/legacy-dialog'
 import { SocialAccount } from 'src/app/types/account-alternate-sign-in.endpoint'
 
 @Component({

diff --git a/...ings/components/settings-actions-deactivate/settings-actions-deactivate.component.spec.ts b/...ings/components/settings-actions-deactivate/settings-actions-deactivate.component.spec.ts
@@ -4,15 +4,15 @@ import { SettingsActionsDeactivateComponent } from './settings-actions-deactivat
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
 import {
-  MAT_DIALOG_DATA,
-  MatDialog,
-  MatDialogRef,
-} from '@angular/material/dialog'
+  MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
+  MatLegacyDialog as MatDialog,
+  MatLegacyDialogRef as MatDialogRef,
+} from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { AccountActionsDeactivateService } from '../../../core/account-actions-deactivate/account-actions-deactivate.service'
 

diff --git a/...settings/components/settings-actions-download/settings-actions-download.component.spec.ts b/...settings/components/settings-actions-download/settings-actions-download.component.spec.ts
@@ -8,8 +8,8 @@ import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { Overlay } from '@angular/cdk/overlay'
 
 describe('SettingsActionsDownloadComponent', () => {

diff --git a/...ings/components/settings-actions-duplicated/settings-actions-duplicated.component.spec.ts b/...ings/components/settings-actions-duplicated/settings-actions-duplicated.component.spec.ts
@@ -3,13 +3,16 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { SettingsActionsDuplicatedComponent } from './settings-actions-duplicated.component'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
-import { MatDialog, MatDialogModule } from '@angular/material/dialog'
+import {
+  MatLegacyDialog as MatDialog,
+  MatLegacyDialogModule as MatDialogModule,
+} from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { UntypedFormBuilder } from '@angular/forms'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { UserService } from '../../../core'
 import { AccountActionsDuplicatedService } from '../../../core/account-actions-duplicated/account-actions-duplicated.service'

diff --git a/...-settings/components/settings-actions-duplicated/settings-actions-duplicated.component.ts b/...-settings/components/settings-actions-duplicated/settings-actions-duplicated.component.ts
@@ -4,7 +4,7 @@ import {
   UntypedFormGroup,
   Validators,
 } from '@angular/forms'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { of, throwError } from 'rxjs'
 import { switchMap, take } from 'rxjs/operators'
 import { UserService } from 'src/app/core'

diff --git a/...nts/settings-defaults-email-frequency/settings-defaults-email-frequency.component.spec.ts b/...nts/settings-defaults-email-frequency/settings-defaults-email-frequency.component.spec.ts
@@ -1,13 +1,13 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 
 import { SettingsDefaultsEmailFrequencyComponent } from './settings-defaults-email-frequency.component'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { UntypedFormBuilder } from '@angular/forms'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'

diff --git a/...ttings/components/settings-defaults-language/settings-defaults-language.component.spec.ts b/...ttings/components/settings-defaults-language/settings-defaults-language.component.spec.ts
@@ -9,8 +9,8 @@ import { LanguageService } from '../../../core/language/language.service'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { Overlay } from '@angular/cdk/overlay'
 
 describe('SettingsDefaultsLanguageComponent', () => {

diff --git a/...gs/components/settings-defaults-visibility/settings-defaults-visibility.component.spec.ts b/...gs/components/settings-defaults-visibility/settings-defaults-visibility.component.spec.ts
@@ -10,8 +10,8 @@ import { RegisterService } from '../../../core/register/register.service'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { Overlay } from '@angular/cdk/overlay'
 import { AccountDefaultVisibilityService } from '../../../core/account-default-visibility/account-default-visibility.service'
 

diff --git a/...settings-security-alternate-sign-in/settings-security-alternate-sign-in.component.spec.ts b/...settings-security-alternate-sign-in/settings-security-alternate-sign-in.component.spec.ts
@@ -3,12 +3,15 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { SettingsSecurityAlternateSignInComponent } from './settings-security-alternate-sign-in.component'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
-import { MatDialog, MatDialogModule } from '@angular/material/dialog'
+import {
+  MatLegacyDialog as MatDialog,
+  MatLegacyDialogModule as MatDialogModule,
+} from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { AccountSecurityAlternateSignInService } from '../../../core/account-security-alternate-sign-in/account-security-alternate-sign-in.service'
 

diff --git a/...ents/settings-security-alternate-sign-in/settings-security-alternate-sign-in.component.ts b/...ents/settings-security-alternate-sign-in/settings-security-alternate-sign-in.component.ts
@@ -5,7 +5,7 @@ import {
   OnInit,
   Output,
 } from '@angular/core'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { Observable, Subject } from 'rxjs'
 import { takeUntil, tap } from 'rxjs/operators'
 import { PlatformInfoService } from 'src/app/cdk/platform-info'

diff --git a/...ttings/components/settings-security-password/settings-security-password.component.spec.ts b/...ttings/components/settings-security-password/settings-security-password.component.spec.ts
@@ -7,8 +7,8 @@ import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { Overlay } from '@angular/cdk/overlay'
 import { RouterTestingModule } from '@angular/router/testing'
 

diff --git a/...nts/settings-security-two-factor-auth/settings-security-two-factor-auth.component.spec.ts b/...nts/settings-security-two-factor-auth/settings-security-two-factor-auth.component.spec.ts
@@ -3,12 +3,12 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { SettingsSecurityTwoFactorAuthComponent } from './settings-security-two-factor-auth.component'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { TwoFactorAuthenticationService } from '../../../core/two-factor-authentication/two-factor-authentication.service'
 

diff --git a/src/app/account-settings/components/settings-security/settings-security.component.spec.ts b/src/app/account-settings/components/settings-security/settings-security.component.spec.ts
@@ -3,12 +3,12 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { SettingsSecurityComponent } from './settings-security.component'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { RouterTestingModule } from '@angular/router/testing'
-import { MatDialog } from '@angular/material/dialog'
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'
 import { WINDOW_PROVIDERS } from '../../../cdk/window'
 import { PlatformInfoService } from '../../../cdk/platform-info'
 import { ErrorHandlerService } from '../../../core/error-handler/error-handler.service'
 import { SnackbarService } from '../../../cdk/snackbar/snackbar.service'
-import { MatSnackBar } from '@angular/material/snack-bar'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
 import { Overlay } from '@angular/cdk/overlay'
 import { TwoFactorAuthenticationService } from '../../../core/two-factor-authentication/two-factor-authentication.service'