- |
-
-
- |
-
-
-
+
+
-
-
-
-
+
+
+
+
+
+
+
-
-
+
+
+
+
+
+
+
|
@@ -108,22 +112,24 @@
{{ 'ROLESLABEL' | translate }} |
-
-
+
-
- {{ role | roletransform }}
-
-
-
+
+
+ {{ role | roletransform }}
+
+ |
diff --git a/console/src/app/modules/members-table/members-table.component.spec.ts b/console/src/app/modules/members-table/members-table.component.spec.ts
index 99cda41fe7..f20807e7a6 100644
--- a/console/src/app/modules/members-table/members-table.component.spec.ts
+++ b/console/src/app/modules/members-table/members-table.component.spec.ts
@@ -1,6 +1,6 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MembersTableComponent } from './members-table.component';
diff --git a/console/src/app/modules/members-table/members-table.component.ts b/console/src/app/modules/members-table/members-table.component.ts
index 69933abf9f..3ac361488d 100644
--- a/console/src/app/modules/members-table/members-table.component.ts
+++ b/console/src/app/modules/members-table/members-table.component.ts
@@ -1,7 +1,7 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
-import { MatLegacyTable as MatTable } from '@angular/material/legacy-table';
+import { MatDialog } from '@angular/material/dialog';
+import { MatTable } from '@angular/material/table';
import { Observable, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { InstanceMembersDataSource } from 'src/app/pages/instance/instance-members/instance-members-datasource';
diff --git a/console/src/app/modules/members-table/members-table.module.ts b/console/src/app/modules/members-table/members-table.module.ts
index 3ae53d96bc..50c5884225 100644
--- a/console/src/app/modules/members-table/members-table.module.ts
+++ b/console/src/app/modules/members-table/members-table.module.ts
@@ -1,14 +1,14 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-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 { MatSelectModule } from '@angular/material/select';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
diff --git a/console/src/app/modules/memberships-table/memberships-table.component.html b/console/src/app/modules/memberships-table/memberships-table.component.html
index 94a24003aa..4465ed3d21 100644
--- a/console/src/app/modules/memberships-table/memberships-table.component.html
+++ b/console/src/app/modules/memberships-table/memberships-table.component.html
@@ -18,25 +18,29 @@
- |
-
-
+ |
+
+
+
+
|
-
-
-
+ |
+
+
+
+
|
@@ -65,28 +69,30 @@
{{ 'ROLESLABEL' | translate }} |
-
-
+
-
- {{ role | roletransform }}
-
-
-
+
+
+ {{ role | roletransform }}
+
+
+
+
|
diff --git a/console/src/app/modules/memberships-table/memberships-table.component.spec.ts b/console/src/app/modules/memberships-table/memberships-table.component.spec.ts
index 24dfcb1fe9..2c2550b752 100644
--- a/console/src/app/modules/memberships-table/memberships-table.component.spec.ts
+++ b/console/src/app/modules/memberships-table/memberships-table.component.spec.ts
@@ -1,6 +1,6 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MembershipsTableComponent } from './memberships-table.component';
diff --git a/console/src/app/modules/memberships-table/memberships-table.component.ts b/console/src/app/modules/memberships-table/memberships-table.component.ts
index e7a2ed26b7..c7771d2abb 100644
--- a/console/src/app/modules/memberships-table/memberships-table.component.ts
+++ b/console/src/app/modules/memberships-table/memberships-table.component.ts
@@ -1,6 +1,6 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
-import { MatLegacyTable as MatTable } from '@angular/material/legacy-table';
+import { MatTable } from '@angular/material/table';
import { Router } from '@angular/router';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
diff --git a/console/src/app/modules/memberships-table/memberships-table.module.ts b/console/src/app/modules/memberships-table/memberships-table.module.ts
index d0fb06e83c..8ab03ad3e9 100644
--- a/console/src/app/modules/memberships-table/memberships-table.module.ts
+++ b/console/src/app/modules/memberships-table/memberships-table.module.ts
@@ -1,15 +1,15 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-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 { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
diff --git a/console/src/app/modules/meta-layout/meta-layout.module.ts b/console/src/app/modules/meta-layout/meta-layout.module.ts
index c4f9c84d0d..a988dd587a 100644
--- a/console/src/app/modules/meta-layout/meta-layout.module.ts
+++ b/console/src/app/modules/meta-layout/meta-layout.module.ts
@@ -1,7 +1,7 @@
import { LayoutModule } from '@angular/cdk/layout';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatButtonModule } from '@angular/material/button';
import { MetaLayoutComponent } from './meta-layout.component';
diff --git a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.html b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.html
index 5c04eb96d2..31262d9cf3 100644
--- a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.html
+++ b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.html
@@ -1,10 +1,8 @@
-
+
{{ ts | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }}
-
{{ 'METADATA.DESCRIPTION' | translate }}
-
diff --git a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts
index b6adf3c1e9..599e58d937 100644
--- a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts
+++ b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts
@@ -1,8 +1,5 @@
import { Component, Inject } from '@angular/core';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb';
import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb';
import { ToastService } from 'src/app/services/toast.service';
@@ -14,7 +11,6 @@ import { ToastService } from 'src/app/services/toast.service';
})
export class MetadataDialogComponent {
public metadata: Partial [] = [];
- public loading: boolean = false;
public ts!: Timestamp.AsObject | undefined;
constructor(
diff --git a/console/src/app/modules/metadata/metadata.module.ts b/console/src/app/modules/metadata/metadata.module.ts
index e23753df27..dd87968efd 100644
--- a/console/src/app/modules/metadata/metadata.module.ts
+++ b/console/src/app/modules/metadata/metadata.module.ts
@@ -1,17 +1,17 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';
import { CardModule } from '../card/card.module';
-import { MatLegacyTableModule } from '@angular/material/legacy-table';
+import { MatTableModule } from '@angular/material/table';
import { InputModule } from '../input/input.module';
import { RefreshTableModule } from '../refresh-table/refresh-table.module';
import { MetadataDialogComponent } from './metadata-dialog/metadata-dialog.component';
@@ -33,7 +33,7 @@ import { MetadataComponent } from './metadata/metadata.component';
LocalizedDatePipeModule,
TimestampToDatePipeModule,
RefreshTableModule,
- MatLegacyTableModule,
+ MatTableModule,
],
exports: [MetadataComponent, MetadataDialogComponent],
})
diff --git a/console/src/app/modules/metadata/metadata/metadata.component.ts b/console/src/app/modules/metadata/metadata/metadata.component.ts
index 22ff727a8a..96c454f7c3 100644
--- a/console/src/app/modules/metadata/metadata/metadata.component.ts
+++ b/console/src/app/modules/metadata/metadata/metadata.component.ts
@@ -1,6 +1,6 @@
import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewChild } from '@angular/core';
-import { MatLegacyTable as MatTable, MatLegacyTableDataSource as MatTableDataSource } from '@angular/material/legacy-table';
import { MatSort } from '@angular/material/sort';
+import { MatTable, MatTableDataSource } from '@angular/material/table';
import { BehaviorSubject, Observable } from 'rxjs';
import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb';
diff --git a/console/src/app/modules/name-dialog/name-dialog.component.html b/console/src/app/modules/name-dialog/name-dialog.component.html
index fe1f6782ea..e57c70269c 100644
--- a/console/src/app/modules/name-dialog/name-dialog.component.html
+++ b/console/src/app/modules/name-dialog/name-dialog.component.html
@@ -1,15 +1,16 @@
{{ data.titleKey | translate }} {{ data?.number }}
-{{ data.descKey | translate }}
+ {{ data.descKey | translate }}
+
{{ data.labelKey | translate }}
-
- check_circle
- {{ 'ONBOARDING.EVENTS.' + action[0] + '.title' | translate }}
+ {{ 'ONBOARDING.MILESTONES.' + action[0] + '.title' | translate }}
keyboard_arrow_right
diff --git a/console/src/app/modules/onboarding-card/onboarding-card.component.scss b/console/src/app/modules/onboarding-card/onboarding-card.component.scss
index 85afb7158f..b70226075b 100644
--- a/console/src/app/modules/onboarding-card/onboarding-card.component.scss
+++ b/console/src/app/modules/onboarding-card/onboarding-card.component.scss
@@ -3,10 +3,10 @@
$warn: map-get($theme, warn);
$background: map-get($theme, background);
$accent: map-get($theme, accent);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
- $warn-color: mat.get-color-from-palette($warn, 500);
- $accent-color: mat.get-color-from-palette($accent, 500);
+ $warn-color: map-get($warn, 500);
+ $accent-color: map-get($accent, 500);
$foreground: map-get($theme, foreground);
$is-dark-theme: map-get($theme, is-dark);
$back: map-get($background, background);
diff --git a/console/src/app/modules/onboarding-card/onboarding-card.component.ts b/console/src/app/modules/onboarding-card/onboarding-card.component.ts
index 14b505afb0..8c5fc17de2 100644
--- a/console/src/app/modules/onboarding-card/onboarding-card.component.ts
+++ b/console/src/app/modules/onboarding-card/onboarding-card.component.ts
@@ -1,7 +1,7 @@
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { AdminService } from 'src/app/services/admin.service';
-import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
+import { ONBOARDING_MILESTONES } from 'src/app/utils/onboarding';
@Component({
selector: 'cnsl-onboarding-card',
@@ -11,7 +11,7 @@ import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
export class OnboardingCardComponent implements OnInit {
public percentageChanged: EventEmitter = new EventEmitter();
public loading$: BehaviorSubject = new BehaviorSubject(false);
- public actions = this.adminService.progressEvents;
+ public actions = this.adminService.progressMilestones;
@Output() public dismissedCard: EventEmitter = new EventEmitter();
constructor(public adminService: AdminService) {}
@@ -21,6 +21,6 @@ export class OnboardingCardComponent implements OnInit {
}
ngOnInit() {
- this.adminService.loadEvents.next(ONBOARDING_EVENTS);
+ this.adminService.loadMilestones.next(ONBOARDING_MILESTONES);
}
}
diff --git a/console/src/app/modules/onboarding-card/onboarding-card.module.ts b/console/src/app/modules/onboarding-card/onboarding-card.module.ts
index 520c806ae8..f379153ca8 100644
--- a/console/src/app/modules/onboarding-card/onboarding-card.module.ts
+++ b/console/src/app/modules/onboarding-card/onboarding-card.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { RouterModule } from '@angular/router';
-import { EventPipeModule } from 'src/app/pipes/event-pipe/event-pipe.module';
+import { MilestonePipeModule } from 'src/app/pipes/milestone-pipe/milestone-pipe.module';
import { OnboardingCardComponent } from './onboarding-card.component';
@NgModule({
@@ -17,7 +17,7 @@ import { OnboardingCardComponent } from './onboarding-card.component';
TranslateModule,
RouterModule,
MatProgressSpinnerModule,
- EventPipeModule,
+ MilestonePipeModule,
MatTooltipModule,
],
exports: [OnboardingCardComponent],
diff --git a/console/src/app/modules/onboarding/onboarding.component.html b/console/src/app/modules/onboarding/onboarding.component.html
index 8ec6111af8..1fe806f356 100644
--- a/console/src/app/modules/onboarding/onboarding.component.html
+++ b/console/src/app/modules/onboarding/onboarding.component.html
@@ -27,10 +27,13 @@
[routerLink]="action[1].link"
[queryParams]="{ id: action[1].fragment }"
class="action-card card"
- [ngClass]="{ done: action[1].event !== undefined }"
+ [ngClass]="{ done: action[1].reached !== undefined }"
>
- check_circle
@@ -54,16 +57,16 @@
- {{ 'ONBOARDING.EVENTS.' + action[0] + '.title' | translate }}
+ {{ 'ONBOARDING.MILESTONES.' + action[0] + '.title' | translate }}
{{
- 'ONBOARDING.EVENTS.' + action[0] + '.description' | translate
+ 'ONBOARDING.MILESTONES.' + action[0] + '.description' | translate
}}
- {{ 'ONBOARDING.EVENTS.' + action[0] + '.action' | translate }}
+ {{ 'ONBOARDING.MILESTONES.' + action[0] + '.action' | translate }}
keyboard_arrow_right
diff --git a/console/src/app/modules/onboarding/onboarding.component.scss b/console/src/app/modules/onboarding/onboarding.component.scss
index 09a692ed6f..ac35ea6d0b 100644
--- a/console/src/app/modules/onboarding/onboarding.component.scss
+++ b/console/src/app/modules/onboarding/onboarding.component.scss
@@ -1,20 +1,18 @@
-@use '@angular/material' as mat;
-
@mixin onboarding-theme($theme) {
$primary: map-get($theme, primary);
$warn: map-get($theme, warn);
$background: map-get($theme, background);
$accent: map-get($theme, accent);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
- $warn-color: mat.get-color-from-palette($warn, 500);
- $accent-color: mat.get-color-from-palette($accent, 500);
+ $warn-color: map-get($warn, 500);
+ $accent-color: map-get($accent, 500);
$foreground: map-get($theme, foreground);
$is-dark-theme: map-get($theme, is-dark);
$back: map-get($background, background);
- $list-background-color: mat.get-color-from-palette($background, 300);
- $card-background-color: mat.get-color-from-palette($background, cards);
+ $list-background-color: map-get($background, 300);
+ $card-background-color: map-get($background, cards);
$border-color: if($is-dark-theme, rgba(#8795a1, 0.2), rgba(#8795a1, 0.2));
$border-selected-color: if($is-dark-theme, #fff, #000);
@@ -40,16 +38,6 @@
height: 8px;
max-width: 300px;
margin-right: 1rem;
-
- .mat-progress-bar-buffer {
- background-color: if($is-dark-theme, rgb(69, 91, 84), #cccccc) !important;
- }
- .mat-progress-bar-background {
- fill: if($is-dark-theme, rgb(69, 91, 84), #cccccc) !important;
- }
- .mat-progress-bar-fill:after {
- background-color: var(--success);
- }
}
.prog-desc {
@@ -183,6 +171,7 @@
justify-content: flex-end;
font-size: 14px;
margin-bottom: 0.5rem;
+ color: map-get($primary, 400);
.icon {
margin-left: 0rem;
diff --git a/console/src/app/modules/onboarding/onboarding.component.ts b/console/src/app/modules/onboarding/onboarding.component.ts
index d72f129d89..e0938f59d5 100644
--- a/console/src/app/modules/onboarding/onboarding.component.ts
+++ b/console/src/app/modules/onboarding/onboarding.component.ts
@@ -1,7 +1,7 @@
import { Component } from '@angular/core';
import { AdminService } from 'src/app/services/admin.service';
import { ThemeService } from 'src/app/services/theme.service';
-import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
+import { ONBOARDING_MILESTONES } from 'src/app/utils/onboarding';
@Component({
selector: 'cnsl-onboarding',
@@ -9,12 +9,12 @@ import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
styleUrls: ['./onboarding.component.scss'],
})
export class OnboardingComponent {
- public actions = this.adminService.progressEvents;
+ public actions = this.adminService.progressMilestones;
constructor(
public adminService: AdminService,
public themeService: ThemeService,
) {
- this.adminService.loadEvents.next(ONBOARDING_EVENTS);
+ this.adminService.loadMilestones.next(ONBOARDING_MILESTONES);
}
}
diff --git a/console/src/app/modules/onboarding/onboarding.module.ts b/console/src/app/modules/onboarding/onboarding.module.ts
index 598d525bd9..4a40f16d2a 100644
--- a/console/src/app/modules/onboarding/onboarding.module.ts
+++ b/console/src/app/modules/onboarding/onboarding.module.ts
@@ -2,14 +2,14 @@ import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { MatRippleModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { ShortcutsModule } from 'src/app/modules/shortcuts/shortcuts.module';
-import { MatLegacyProgressBarModule } from '@angular/material/legacy-progress-bar';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
import { RouterModule } from '@angular/router';
-import { EventPipeModule } from 'src/app/pipes/event-pipe/event-pipe.module';
+import { MilestonePipeModule } from 'src/app/pipes/milestone-pipe/milestone-pipe.module';
import { OnboardingComponent } from './onboarding.component';
@NgModule({
@@ -23,8 +23,8 @@ import { OnboardingComponent } from './onboarding.component';
MatRippleModule,
RouterModule,
MatProgressSpinnerModule,
- MatLegacyProgressBarModule,
- EventPipeModule,
+ MatProgressBarModule,
+ MilestonePipeModule,
],
exports: [OnboardingComponent],
})
diff --git a/console/src/app/modules/org-context/org-context.component.html b/console/src/app/modules/org-context/org-context.component.html
index 657151998b..dc1a0f1d64 100644
--- a/console/src/app/modules/org-context/org-context.component.html
+++ b/console/src/app/modules/org-context/org-context.component.html
@@ -57,8 +57,10 @@
diff --git a/console/src/app/modules/org-context/org-context.component.scss b/console/src/app/modules/org-context/org-context.component.scss
index f20910c5bb..d5736cba2a 100644
--- a/console/src/app/modules/org-context/org-context.component.scss
+++ b/console/src/app/modules/org-context/org-context.component.scss
@@ -3,10 +3,10 @@
$warn: map-get($theme, warn);
$background: map-get($theme, background);
$accent: map-get($theme, accent);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
- $warn-color: mat.get-color-from-palette($warn, 500);
- $accent-color: mat.get-color-from-palette($accent, 500);
+ $warn-color: map-get($warn, 500);
+ $accent-color: map-get($accent, 500);
$foreground: map-get($theme, foreground);
$is-dark-theme: map-get($theme, is-dark);
$back: map-get($background, background);
@@ -41,7 +41,7 @@
.show-all {
width: 100%;
- color: mat.get-color-from-palette($foreground, text);
+ color: map-get($foreground, text);
border-top: 1px solid map-get($foreground, divider);
}
@@ -59,6 +59,10 @@
position: relative;
overflow: hidden;
+ .mdc-button__label {
+ width: 100%;
+ }
+
.org-flex-row {
display: flex;
align-items: center;
@@ -77,6 +81,7 @@
margin-right: -0.5rem;
visibility: hidden;
opacity: 0.5;
+ padding: 0;
&:hover {
opacity: 1;
@@ -85,7 +90,7 @@
mat-icon {
font-size: 20px;
height: 20px;
- width: 20px;
+ width: 36px;
}
}
}
diff --git a/console/src/app/modules/org-context/org-context.module.ts b/console/src/app/modules/org-context/org-context.module.ts
index beb12daf2a..2d025f7178 100644
--- a/console/src/app/modules/org-context/org-context.module.ts
+++ b/console/src/app/modules/org-context/org-context.module.ts
@@ -2,10 +2,10 @@ import { A11yModule } from '@angular/cdk/a11y';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
diff --git a/console/src/app/modules/org-table/org-table.component.html b/console/src/app/modules/org-table/org-table.component.html
index 1a28850227..d0582c87b4 100644
--- a/console/src/app/modules/org-table/org-table.component.html
+++ b/console/src/app/modules/org-table/org-table.component.html
@@ -8,10 +8,12 @@
-
- add
- {{ 'ACTIONS.NEW' | translate }}
-
+
+
+ add
+ {{ 'ACTIONS.NEW' | translate }}
+
+
@@ -31,20 +33,21 @@
{{ 'ORG.PAGES.PRIMARYDOMAIN' | translate }} |
- {{ org.primaryDomain }}
-
+
+ {{ org.primaryDomain }}
+
+
|
diff --git a/console/src/app/modules/org-table/org-table.component.scss b/console/src/app/modules/org-table/org-table.component.scss
index cc165bacc9..4a7ad537df 100644
--- a/console/src/app/modules/org-table/org-table.component.scss
+++ b/console/src/app/modules/org-table/org-table.component.scss
@@ -1,23 +1,28 @@
td {
cursor: pointer;
- .cpy-button {
- visibility: hidden;
+ .primary-domain-wrapper {
+ display: flex;
+ align-items: center;
- i {
- pointer-events: none;
+ .cpy-button {
+ visibility: hidden;
+
+ i {
+ pointer-events: none;
+ }
+ }
+
+ &:hover {
+ .cpy-button {
+ visibility: visible;
+ }
}
}
.orgdefaultlabel {
margin-left: 0.5rem;
}
-
- &:hover {
- .cpy-button {
- visibility: visible;
- }
- }
}
.pointer {
diff --git a/console/src/app/modules/org-table/org-table.component.ts b/console/src/app/modules/org-table/org-table.component.ts
index b60c049fd5..bc2fcc71aa 100644
--- a/console/src/app/modules/org-table/org-table.component.ts
+++ b/console/src/app/modules/org-table/org-table.component.ts
@@ -1,7 +1,7 @@
import { LiveAnnouncer } from '@angular/cdk/a11y';
import { Component, Input, ViewChild } from '@angular/core';
-import { MatLegacyTableDataSource as MatTableDataSource } from '@angular/material/legacy-table';
import { MatSort, Sort } from '@angular/material/sort';
+import { MatTableDataSource } from '@angular/material/table';
import { Router } from '@angular/router';
import { TranslateService } from '@ngx-translate/core';
import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb';
diff --git a/console/src/app/modules/org-table/org-table.module.ts b/console/src/app/modules/org-table/org-table.module.ts
index 9a1f1b6b3c..b4650e381c 100644
--- a/console/src/app/modules/org-table/org-table.module.ts
+++ b/console/src/app/modules/org-table/org-table.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatRadioModule } from '@angular/material/radio';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { CopyToClipboardModule } from 'src/app/directives/copy-to-clipboard/copy-to-clipboard.module';
diff --git a/console/src/app/modules/paginator/paginator.component.scss b/console/src/app/modules/paginator/paginator.component.scss
index 66e04072af..b280d4b0ab 100644
--- a/console/src/app/modules/paginator/paginator.component.scss
+++ b/console/src/app/modules/paginator/paginator.component.scss
@@ -49,8 +49,8 @@
}
}
-::ng-deep .paginator-select.mat-select {
+::ng-deep .paginator-select.mat-mdc-select {
min-width: 60px;
height: 36px !important;
- padding-top: 8px !important;
+ padding-top: 4px !important;
}
diff --git a/console/src/app/modules/paginator/paginator.module.ts b/console/src/app/modules/paginator/paginator.module.ts
index 663c4c9e0d..c2926e1f75 100644
--- a/console/src/app/modules/paginator/paginator.module.ts
+++ b/console/src/app/modules/paginator/paginator.module.ts
@@ -1,8 +1,8 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatButtonModule } from '@angular/material/button';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';
diff --git a/console/src/app/modules/password-complexity-view/password-complexity-view.module.ts b/console/src/app/modules/password-complexity-view/password-complexity-view.module.ts
index 8a27c5e394..8d2829677c 100644
--- a/console/src/app/modules/password-complexity-view/password-complexity-view.module.ts
+++ b/console/src/app/modules/password-complexity-view/password-complexity-view.module.ts
@@ -1,7 +1,7 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { TranslateModule } from '@ngx-translate/core';
import { PasswordComplexityViewComponent } from './password-complexity-view.component';
diff --git a/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.html b/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.html
index c1df8a5cd5..3d2e60adea 100644
--- a/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.html
+++ b/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.html
@@ -12,7 +12,9 @@
mat-raised-button
(click)="openAddKey()"
>
- add{{ 'ACTIONS.NEW' | translate }}
+
+ add{{ 'ACTIONS.NEW' | translate }}
+
diff --git a/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.ts b/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.ts
index 7d77fb0bff..17a9e980e5 100644
--- a/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.ts
+++ b/console/src/app/modules/personal-access-tokens/personal-access-tokens.component.ts
@@ -1,7 +1,7 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
-import { MatLegacyTableDataSource as MatTableDataSource } from '@angular/material/legacy-table';
+import { MatDialog } from '@angular/material/dialog';
+import { MatTableDataSource } from '@angular/material/table';
import { TranslateService } from '@ngx-translate/core';
import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb';
import { Moment } from 'moment';
diff --git a/console/src/app/modules/personal-access-tokens/personal-access-tokens.module.ts b/console/src/app/modules/personal-access-tokens/personal-access-tokens.module.ts
index 530c5d9941..b4b7b4942c 100644
--- a/console/src/app/modules/personal-access-tokens/personal-access-tokens.module.ts
+++ b/console/src/app/modules/personal-access-tokens/personal-access-tokens.module.ts
@@ -1,13 +1,13 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
diff --git a/console/src/app/modules/policies/domain-policy/domain-policy.component.ts b/console/src/app/modules/policies/domain-policy/domain-policy.component.ts
index fb8efe1ff6..0ac32cd0fb 100644
--- a/console/src/app/modules/policies/domain-policy/domain-policy.component.ts
+++ b/console/src/app/modules/policies/domain-policy/domain-policy.component.ts
@@ -1,5 +1,5 @@
import { Component, Injector, Input, OnDestroy, OnInit, Type } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { Subscription } from 'rxjs';
import {
AddCustomDomainPolicyRequest,
diff --git a/console/src/app/modules/policies/domain-policy/domain-policy.module.ts b/console/src/app/modules/policies/domain-policy/domain-policy.module.ts
index e152220a40..e7f8174492 100644
--- a/console/src/app/modules/policies/domain-policy/domain-policy.module.ts
+++ b/console/src/app/modules/policies/domain-policy/domain-policy.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
import { DetailLayoutModule } from 'src/app/modules/detail-layout/detail-layout.module';
diff --git a/console/src/app/modules/policies/general-settings/general-settings.module.ts b/console/src/app/modules/policies/general-settings/general-settings.module.ts
index 93c095db76..98f0e4cb53 100644
--- a/console/src/app/modules/policies/general-settings/general-settings.module.ts
+++ b/console/src/app/modules/policies/general-settings/general-settings.module.ts
@@ -1,9 +1,9 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatButtonModule } from '@angular/material/button';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
diff --git a/console/src/app/modules/policies/idp-settings/idp-settings.component.scss b/console/src/app/modules/policies/idp-settings/idp-settings.component.scss
index d092423b95..095a05491e 100644
--- a/console/src/app/modules/policies/idp-settings/idp-settings.component.scss
+++ b/console/src/app/modules/policies/idp-settings/idp-settings.component.scss
@@ -1,8 +1,6 @@
-@use '@angular/material' as mat;
-
@mixin idp-settings-theme($theme) {
$primary: map-get($theme, primary);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
$is-dark-theme: map-get($theme, is-dark);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
diff --git a/console/src/app/modules/policies/idp-settings/idp-settings.module.ts b/console/src/app/modules/policies/idp-settings/idp-settings.module.ts
index 79264fbe3c..33730519ad 100644
--- a/console/src/app/modules/policies/idp-settings/idp-settings.module.ts
+++ b/console/src/app/modules/policies/idp-settings/idp-settings.module.ts
@@ -1,8 +1,8 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
@@ -15,7 +15,7 @@ import { IdpSettingsComponent } from './idp-settings.component';
declarations: [IdpSettingsComponent],
imports: [
CommonModule,
- MatLegacyButtonModule,
+ MatButtonModule,
CardModule,
MatIconModule,
IdpTableModule,
diff --git a/console/src/app/modules/policies/login-policy/factor-table/dialog-add-type/dialog-add-type.component.ts b/console/src/app/modules/policies/login-policy/factor-table/dialog-add-type/dialog-add-type.component.ts
index 5a71691ed0..7314e41933 100644
--- a/console/src/app/modules/policies/login-policy/factor-table/dialog-add-type/dialog-add-type.component.ts
+++ b/console/src/app/modules/policies/login-policy/factor-table/dialog-add-type/dialog-add-type.component.ts
@@ -1,8 +1,5 @@
import { Component, Inject } from '@angular/core';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MultiFactorType, SecondFactorType } from 'src/app/proto/generated/zitadel/policy_pb';
enum LoginMethodComponentType {
diff --git a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.html b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.html
index 948f5cfa26..e31877be75 100644
--- a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.html
+++ b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.html
@@ -21,12 +21,14 @@
diff --git a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.scss b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.scss
index ff4a6ba796..46f9e91757 100644
--- a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.scss
+++ b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin login-policy-mfas-theme($theme) {
$foreground: map-get($theme, foreground);
diff --git a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.ts b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.ts
index f1f050dc1a..b28a4c3c19 100644
--- a/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.ts
+++ b/console/src/app/modules/policies/login-policy/factor-table/factor-table.component.ts
@@ -1,6 +1,6 @@
import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
-import { MatLegacyPaginator as MatPaginator } from '@angular/material/legacy-paginator';
+import { MatDialog } from '@angular/material/dialog';
+import { MatPaginator } from '@angular/material/paginator';
import { TranslateService } from '@ngx-translate/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { PolicyComponentServiceType } from 'src/app/modules/policies/policy-component-types.enum';
diff --git a/console/src/app/modules/policies/login-policy/login-policy.component.ts b/console/src/app/modules/policies/login-policy/login-policy.component.ts
index 495ce0f1ad..123bb66aeb 100644
--- a/console/src/app/modules/policies/login-policy/login-policy.component.ts
+++ b/console/src/app/modules/policies/login-policy/login-policy.component.ts
@@ -1,6 +1,6 @@
import { Component, Injector, Input, OnInit, Type } from '@angular/core';
import { AbstractControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { Duration } from 'google-protobuf/google/protobuf/duration_pb';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/policies/login-policy/login-policy.module.ts b/console/src/app/modules/policies/login-policy/login-policy.module.ts
index 6e244da559..6fc6c24a1a 100644
--- a/console/src/app/modules/policies/login-policy/login-policy.module.ts
+++ b/console/src/app/modules/policies/login-policy/login-policy.module.ts
@@ -1,15 +1,15 @@
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 { MatRippleModule } from '@angular/material/core';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
-import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
import { CardModule } from 'src/app/modules/card/card.module';
diff --git a/console/src/app/modules/policies/login-texts/login-texts.component.html b/console/src/app/modules/policies/login-texts/login-texts.component.html
index ae14b6c135..81421cb28b 100644
--- a/console/src/app/modules/policies/login-texts/login-texts.component.html
+++ b/console/src/app/modules/policies/login-texts/login-texts.component.html
@@ -18,8 +18,10 @@
diff --git a/console/src/app/modules/policies/notification-sms-provider/dialog-add-sms-provider/dialog-add-sms-provider.component.ts b/console/src/app/modules/policies/notification-sms-provider/dialog-add-sms-provider/dialog-add-sms-provider.component.ts
index 2594dd0728..6d9aa749fb 100644
--- a/console/src/app/modules/policies/notification-sms-provider/dialog-add-sms-provider/dialog-add-sms-provider.component.ts
+++ b/console/src/app/modules/policies/notification-sms-provider/dialog-add-sms-provider/dialog-add-sms-provider.component.ts
@@ -1,10 +1,6 @@
import { Component, Inject } from '@angular/core';
import { AbstractControl, FormControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import {
- MatLegacyDialog as MatDialog,
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { requiredValidator } from 'src/app/modules/form-field/validators/validators';
import {
AddSMSProviderTwilioRequest,
@@ -61,15 +57,14 @@ export class DialogAddSMSProviderComponent {
}
public closeDialogWithRequest(): void {
- if (!!this.twilio) {
+ if (!!this.twilio && this.twilioProvider && this.twilioProvider.id) {
this.req = new UpdateSMSProviderTwilioRequest();
-
+ this.req.setId(this.twilioProvider.id);
this.req.setSid(this.sid?.value);
this.req.setSenderNumber(this.senderNumber?.value);
this.dialogRef.close(this.req);
} else {
this.req = new AddSMSProviderTwilioRequest();
-
this.req.setSid(this.sid?.value);
this.req.setToken(this.token?.value);
this.req.setSenderNumber(this.senderNumber?.value);
diff --git a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.html b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.html
index adde321c63..33a2521e57 100644
--- a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.html
+++ b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.html
@@ -24,6 +24,7 @@
*ngIf="twilio && twilio.id"
[disabled]="(['iam.write'] | hasRole | async) === false"
mat-stroked-button
+ data-e2e="activate-sms-provider-button"
(click)="toggleSMSProviderState(twilio.id)"
>
{{
diff --git a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.ts b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.ts
index eb14ce8a0c..2728d1da35 100644
--- a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.ts
+++ b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.component.ts
@@ -1,8 +1,8 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
import { AddSMSProviderTwilioRequest, UpdateSMSProviderTwilioRequest } from 'src/app/proto/generated/zitadel/admin_pb';
import { SMSProvider, SMSProviderConfigState } from 'src/app/proto/generated/zitadel/settings_pb';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { AdminService } from 'src/app/services/admin.service';
import { ToastService } from 'src/app/services/toast.service';
import { InfoSectionType } from '../../info-section/info-section.component';
@@ -15,7 +15,7 @@ import { DialogAddSMSProviderComponent } from './dialog-add-sms-provider/dialog-
templateUrl: './notification-sms-provider.component.html',
styleUrls: ['./notification-sms-provider.component.scss'],
})
-export class NotificationSMSProviderComponent {
+export class NotificationSMSProviderComponent implements OnInit {
@Input() public serviceType!: PolicyComponentServiceType;
public smsProviders: SMSProvider.AsObject[] = [];
@@ -30,6 +30,10 @@ export class NotificationSMSProviderComponent {
private toast: ToastService,
) {}
+ ngOnInit(): void {
+ this.fetchData();
+ }
+
private fetchData(): void {
this.smsProvidersLoading = true;
this.service
@@ -60,7 +64,7 @@ export class NotificationSMSProviderComponent {
this.service
.updateSMSProviderTwilio(req as UpdateSMSProviderTwilioRequest)
.then(() => {
- this.toast.showInfo('SETTING.SMS.TWILIO.ADDED', true);
+ this.toast.showInfo('SETTING.SMS.TWILIO.UPDATED', true);
this.fetchData();
})
.catch((error) => {
diff --git a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.module.ts b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.module.ts
index 4d00252a4f..112fd3e6d1 100644
--- a/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.module.ts
+++ b/console/src/app/modules/policies/notification-sms-provider/notification-sms-provider.module.ts
@@ -1,11 +1,11 @@
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 { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
@@ -16,6 +16,7 @@ import { InputModule } from '../../input/input.module';
import { WarnDialogModule } from '../../warn-dialog/warn-dialog.module';
import { DialogAddSMSProviderComponent } from './dialog-add-sms-provider/dialog-add-sms-provider.component';
import { NotificationSMSProviderComponent } from './notification-sms-provider.component';
+import { MatDialogModule } from '@angular/material/dialog';
@NgModule({
declarations: [NotificationSMSProviderComponent, DialogAddSMSProviderComponent],
@@ -33,6 +34,7 @@ import { NotificationSMSProviderComponent } from './notification-sms-provider.co
FormFieldModule,
WarnDialogModule,
MatSelectModule,
+ MatDialogModule,
MatProgressSpinnerModule,
MatSelectModule,
TranslateModule,
diff --git a/console/src/app/modules/policies/notification-sms-provider/password-dialog/password-dialog.component.ts b/console/src/app/modules/policies/notification-sms-provider/password-dialog/password-dialog.component.ts
index cc80cffaf3..1f8cbafe4c 100644
--- a/console/src/app/modules/policies/notification-sms-provider/password-dialog/password-dialog.component.ts
+++ b/console/src/app/modules/policies/notification-sms-provider/password-dialog/password-dialog.component.ts
@@ -1,8 +1,5 @@
import { Component, Inject } from '@angular/core';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
@Component({
selector: 'cnsl-password-dialog',
diff --git a/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.component.ts b/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.component.ts
index 6bdaf0ba10..8d65bc634a 100644
--- a/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.component.ts
+++ b/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.component.ts
@@ -1,6 +1,6 @@
import { Component, Input, OnInit } from '@angular/core';
import { AbstractControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { take } from 'rxjs';
import {
AddSMTPConfigRequest,
diff --git a/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.module.ts b/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.module.ts
index 61bb79023e..91e68a4e66 100644
--- a/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.module.ts
+++ b/console/src/app/modules/policies/notification-smtp-provider/notification-smtp-provider.module.ts
@@ -2,10 +2,10 @@ import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
@@ -16,6 +16,7 @@ import { InputModule } from '../../input/input.module';
import { WarnDialogModule } from '../../warn-dialog/warn-dialog.module';
import { PasswordDialogComponent } from '../notification-sms-provider/password-dialog/password-dialog.component';
import { NotificationSMTPProviderComponent } from './notification-smtp-provider.component';
+import { MatDialogModule } from '@angular/material/dialog';
@NgModule({
declarations: [NotificationSMTPProviderComponent, PasswordDialogComponent],
@@ -36,6 +37,7 @@ import { NotificationSMTPProviderComponent } from './notification-smtp-provider.
MatProgressSpinnerModule,
MatSelectModule,
TranslateModule,
+ MatDialogModule,
],
exports: [NotificationSMTPProviderComponent],
})
diff --git a/console/src/app/modules/policies/oidc-configuration/oidc-configuration.module.ts b/console/src/app/modules/policies/oidc-configuration/oidc-configuration.module.ts
index 371a9284a4..fe78fe0932 100644
--- a/console/src/app/modules/policies/oidc-configuration/oidc-configuration.module.ts
+++ b/console/src/app/modules/policies/oidc-configuration/oidc-configuration.module.ts
@@ -1,9 +1,9 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatButtonModule } from '@angular/material/button';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { CardModule } from '../../card/card.module';
diff --git a/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.component.ts b/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.component.ts
index 37875bdf81..1ba6a4af2e 100644
--- a/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.component.ts
+++ b/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.component.ts
@@ -1,5 +1,5 @@
import { Component, Injector, Input, OnInit, Type } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { GetPasswordComplexityPolicyResponse as AdminGetPasswordComplexityPolicyResponse } from 'src/app/proto/generated/zitadel/admin_pb';
import { GetPasswordComplexityPolicyResponse as MgmtGetPasswordComplexityPolicyResponse } from 'src/app/proto/generated/zitadel/management_pb';
import { PasswordComplexityPolicy } from 'src/app/proto/generated/zitadel/policy_pb';
diff --git a/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.module.ts b/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.module.ts
index 58cad58bf4..ddaef9e3da 100644
--- a/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.module.ts
+++ b/console/src/app/modules/policies/password-complexity-policy/password-complexity-policy.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
import { DetailLayoutModule } from 'src/app/modules/detail-layout/detail-layout.module';
diff --git a/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.component.ts b/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.component.ts
index f2edb0e45d..ad4ff29b4f 100644
--- a/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.component.ts
+++ b/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.component.ts
@@ -1,6 +1,6 @@
import { Component, Injector, Input, OnInit, Type } from '@angular/core';
import { UntypedFormGroup } from '@angular/forms';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { GetLockoutPolicyResponse as AdminGetPasswordLockoutPolicyResponse } from 'src/app/proto/generated/zitadel/admin_pb';
import { GetLockoutPolicyResponse as MgmtGetPasswordLockoutPolicyResponse } from 'src/app/proto/generated/zitadel/management_pb';
import { LockoutPolicy } from 'src/app/proto/generated/zitadel/policy_pb';
diff --git a/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.module.ts b/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.module.ts
index 44f49705ae..813b046791 100644
--- a/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.module.ts
+++ b/console/src/app/modules/policies/password-lockout-policy/password-lockout-policy.module.ts
@@ -1,11 +1,11 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
import { DetailLayoutModule } from 'src/app/modules/detail-layout/detail-layout.module';
diff --git a/console/src/app/modules/policies/privacy-policy/privacy-policy.component.ts b/console/src/app/modules/policies/privacy-policy/privacy-policy.component.ts
index a2b0f52b52..dc700544a4 100644
--- a/console/src/app/modules/policies/privacy-policy/privacy-policy.component.ts
+++ b/console/src/app/modules/policies/privacy-policy/privacy-policy.component.ts
@@ -1,6 +1,6 @@
import { Component, Injector, Input, OnDestroy, OnInit, Type } from '@angular/core';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { Observable, Subscription } from 'rxjs';
import { take } from 'rxjs/operators';
import {
diff --git a/console/src/app/modules/policies/privacy-policy/privacy-policy.module.ts b/console/src/app/modules/policies/privacy-policy/privacy-policy.module.ts
index 483eec52c4..3ba9d03607 100644
--- a/console/src/app/modules/policies/privacy-policy/privacy-policy.module.ts
+++ b/console/src/app/modules/policies/privacy-policy/privacy-policy.module.ts
@@ -2,12 +2,12 @@ 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 { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { CopyToClipboardModule } from 'src/app/directives/copy-to-clipboard/copy-to-clipboard.module';
diff --git a/console/src/app/modules/policies/private-labeling-policy/preview/preview.component.scss b/console/src/app/modules/policies/private-labeling-policy/preview/preview.component.scss
index 4fec702064..a7deaf1851 100644
--- a/console/src/app/modules/policies/private-labeling-policy/preview/preview.component.scss
+++ b/console/src/app/modules/policies/private-labeling-policy/preview/preview.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@import '../../../../../styles/input.scss';
@import '../../../label/label.component.scss';
@@ -11,7 +9,7 @@
// @include mat.all-component-themes($theme);
$primary: map-get($theme, primary);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
$is-dark-theme: map-get($theme, is-dark);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
diff --git a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.html b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.html
index 6ec47521a8..b649ef7869 100644
--- a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.html
+++ b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.html
@@ -7,27 +7,11 @@
-
-
-
-
- {{ 'POLICY.PRIVATELABELING.LIGHT' | translate }}
-
-
-
- {{ 'POLICY.PRIVATELABELING.DARK' | translate }}
-
-
-
@@ -48,6 +32,109 @@
+
+
+
+
+ {{ 'POLICY.PRIVATELABELING.THEMEMODE.THEME_MODE_AUTO' | translate }}
+
+
+
+ {{ 'POLICY.PRIVATELABELING.THEMEMODE.THEME_MODE_LIGHT' | translate }}
+
+
+
+ {{ 'POLICY.PRIVATELABELING.THEMEMODE.THEME_MODE_DARK' | translate }}
+
+
+
+
+
+
+
+ {{ 'POLICY.PRIVATELABELING.LIGHT' | translate }}
+
+
+
+ {{ 'POLICY.PRIVATELABELING.DARK' | translate }}
+
+
diff --git a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.scss b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.scss
index c7d1371029..cfb7a1fc5d 100644
--- a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.scss
+++ b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.scss
@@ -1,10 +1,8 @@
-@use '@angular/material' as mat;
-
@import './preview/preview.component.scss';
@mixin private-label-theme($theme) {
$primary: map-get($theme, primary);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
$is-dark-theme: map-get($theme, is-dark);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
@@ -54,14 +52,6 @@
margin-right: 0.5rem;
margin-top: 0.5rem;
- .mat-button-toggle-button {
- display: flex;
- height: 36px;
- line-height: 36px;
- align-items: center;
- font-size: 14px;
- }
-
.toggle-row {
display: flex;
align-items: center;
diff --git a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.ts b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.ts
index 6e579352de..5539ef3620 100644
--- a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.ts
+++ b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.component.ts
@@ -1,6 +1,6 @@
import { HttpErrorResponse } from '@angular/common/http';
import { Component, EventEmitter, Injector, Input, OnDestroy, OnInit, Type } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { Subject, Subscription } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import {
@@ -15,7 +15,7 @@ import {
UpdateCustomLabelPolicyRequest,
} from 'src/app/proto/generated/zitadel/management_pb';
import { Org } from 'src/app/proto/generated/zitadel/org_pb';
-import { LabelPolicy } from 'src/app/proto/generated/zitadel/policy_pb';
+import { LabelPolicy, ThemeMode } from 'src/app/proto/generated/zitadel/policy_pb';
import { AdminService } from 'src/app/services/admin.service';
import { AssetEndpoint, AssetService, AssetType } from 'src/app/services/asset.service';
import { ManagementService } from 'src/app/services/mgmt.service';
@@ -88,6 +88,7 @@ export class PrivateLabelingPolicyComponent implements OnInit, OnDestroy {
public View: any = View;
public ColorType: any = ColorType;
public AssetType: any = AssetType;
+ public ThemeMode: any = ThemeMode;
public fontName = '';
@@ -106,6 +107,32 @@ export class PrivateLabelingPolicyComponent implements OnInit, OnDestroy {
private dialog: MatDialog,
) {}
+ public toggleThemeMode(): void {
+ if (this.view === View.CURRENT) {
+ return;
+ }
+ if (this.previewData?.themeMode === ThemeMode.THEME_MODE_LIGHT) {
+ this.theme = Theme.LIGHT;
+ }
+ if (this.previewData?.themeMode === ThemeMode.THEME_MODE_DARK) {
+ this.theme = Theme.DARK;
+ }
+ this.savePolicy();
+ }
+
+ public toggleView(view: View): void {
+ let themeMode = this.data?.themeMode;
+ if (view === View.PREVIEW) {
+ themeMode = this.previewData?.themeMode;
+ }
+ if (themeMode === ThemeMode.THEME_MODE_LIGHT) {
+ this.theme = Theme.LIGHT;
+ }
+ if (themeMode === ThemeMode.THEME_MODE_DARK) {
+ this.theme = Theme.DARK;
+ }
+ }
+
public toggleHoverLogo(theme: Theme, isHovering: boolean): void {
if (theme === Theme.DARK) {
this.isHoveringOverDarkLogo = isHovering;
@@ -614,6 +641,8 @@ export class PrivateLabelingPolicyComponent implements OnInit, OnDestroy {
req.setDisableWatermark(this.previewData.disableWatermark);
req.setHideLoginNameSuffix(this.previewData.hideLoginNameSuffix);
+
+ req.setThemeMode(this.previewData.themeMode);
}
}
diff --git a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.module.ts b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.module.ts
index efbd49ebde..217e0bf005 100644
--- a/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.module.ts
+++ b/console/src/app/modules/policies/private-labeling-policy/private-labeling-policy.module.ts
@@ -5,11 +5,12 @@ import { FormsModule } from '@angular/forms';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { ColorChromeModule } from 'ngx-color/chrome';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
@@ -49,6 +50,7 @@ import { PrivateLabelingPolicyComponent } from './private-labeling-policy.compon
WarnDialogModule,
HasRolePipeModule,
MatProgressSpinnerModule,
+ MatSelectModule,
MatExpansionModule,
InfoSectionModule,
],
diff --git a/console/src/app/modules/policies/secret-generator/dialog-add-secret-generator/dialog-add-secret-generator.component.ts b/console/src/app/modules/policies/secret-generator/dialog-add-secret-generator/dialog-add-secret-generator.component.ts
index 0161625c2e..8a11cae13d 100644
--- a/console/src/app/modules/policies/secret-generator/dialog-add-secret-generator/dialog-add-secret-generator.component.ts
+++ b/console/src/app/modules/policies/secret-generator/dialog-add-secret-generator/dialog-add-secret-generator.component.ts
@@ -1,9 +1,6 @@
import { Component, Inject } from '@angular/core';
import { AbstractControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { Duration } from 'google-protobuf/google/protobuf/duration_pb';
import { requiredValidator } from 'src/app/modules/form-field/validators/validators';
import { UpdateSecretGeneratorRequest } from 'src/app/proto/generated/zitadel/admin_pb';
diff --git a/console/src/app/modules/policies/secret-generator/secret-generator.component.ts b/console/src/app/modules/policies/secret-generator/secret-generator.component.ts
index 491bf52516..9d903ca3fb 100644
--- a/console/src/app/modules/policies/secret-generator/secret-generator.component.ts
+++ b/console/src/app/modules/policies/secret-generator/secret-generator.component.ts
@@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';
import { UpdateSecretGeneratorRequest } from 'src/app/proto/generated/zitadel/admin_pb';
import { OIDCSettings, SecretGenerator, SecretGeneratorType } from 'src/app/proto/generated/zitadel/settings_pb';
import { AdminService } from 'src/app/services/admin.service';
diff --git a/console/src/app/modules/policies/secret-generator/secret-generator.module.ts b/console/src/app/modules/policies/secret-generator/secret-generator.module.ts
index baa127933f..525ef47cf3 100644
--- a/console/src/app/modules/policies/secret-generator/secret-generator.module.ts
+++ b/console/src/app/modules/policies/secret-generator/secret-generator.module.ts
@@ -1,11 +1,11 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
-import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
diff --git a/console/src/app/modules/policies/security-policy/security-policy.component.scss b/console/src/app/modules/policies/security-policy/security-policy.component.scss
index 32d12d7690..24a6da0000 100644
--- a/console/src/app/modules/policies/security-policy/security-policy.component.scss
+++ b/console/src/app/modules/policies/security-policy/security-policy.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin security-policy-theme($theme) {
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
@@ -75,7 +73,7 @@
}
button {
- margin-bottom: 14px;
+ margin-bottom: 0.5rem;
margin-right: -0.5rem;
}
}
diff --git a/console/src/app/modules/policies/security-policy/security-policy.module.ts b/console/src/app/modules/policies/security-policy/security-policy.module.ts
index 4659660f6d..6ec3e72b24 100644
--- a/console/src/app/modules/policies/security-policy/security-policy.module.ts
+++ b/console/src/app/modules/policies/security-policy/security-policy.module.ts
@@ -1,11 +1,11 @@
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 { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
diff --git a/console/src/app/modules/project-members/project-members.component.html b/console/src/app/modules/project-members/project-members.component.html
index 2da9456f0d..1d2117e740 100644
--- a/console/src/app/modules/project-members/project-members.component.html
+++ b/console/src/app/modules/project-members/project-members.component.html
@@ -6,7 +6,7 @@
{{ 'PROJECT.MEMBER.DESCRIPTION' | translate }}
-
+ info_outline
- add
- {{ 'ACTIONS.NEW' | translate }}
-
+
+ add
+ {{ 'ACTIONS.NEW' | translate }}
+
+
+
- |
-
-
+ |
+
+
+
+
|
-
-
-
+ |
+
+
+
+
|
diff --git a/console/src/app/modules/project-roles-table/project-roles-table.component.spec.ts b/console/src/app/modules/project-roles-table/project-roles-table.component.spec.ts
index 17332577a1..d37edf5cf7 100644
--- a/console/src/app/modules/project-roles-table/project-roles-table.component.spec.ts
+++ b/console/src/app/modules/project-roles-table/project-roles-table.component.spec.ts
@@ -1,6 +1,6 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
import { MatSortModule } from '@angular/material/sort';
+import { MatTableModule } from '@angular/material/table';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ProjectRolesTableComponent } from './project-roles-table.component';
diff --git a/console/src/app/modules/project-roles-table/project-roles-table.component.ts b/console/src/app/modules/project-roles-table/project-roles-table.component.ts
index 96ff9da551..ae8633d15d 100644
--- a/console/src/app/modules/project-roles-table/project-roles-table.component.ts
+++ b/console/src/app/modules/project-roles-table/project-roles-table.component.ts
@@ -1,7 +1,7 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
-import { MatLegacyTable as MatTable } from '@angular/material/legacy-table';
+import { MatDialog } from '@angular/material/dialog';
+import { MatTable } from '@angular/material/table';
import { Router } from '@angular/router';
import { Role } from 'src/app/proto/generated/zitadel/project_pb';
import { ManagementService } from 'src/app/services/mgmt.service';
diff --git a/console/src/app/modules/project-roles-table/project-roles-table.module.ts b/console/src/app/modules/project-roles-table/project-roles-table.module.ts
index a39facd539..c30adacd31 100644
--- a/console/src/app/modules/project-roles-table/project-roles-table.module.ts
+++ b/console/src/app/modules/project-roles-table/project-roles-table.module.ts
@@ -1,14 +1,14 @@
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 { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
-import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTableModule } from '@angular/material/table';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
diff --git a/console/src/app/modules/provider-options/provider-options.module.ts b/console/src/app/modules/provider-options/provider-options.module.ts
index 5060a0fea3..38d8578417 100644
--- a/console/src/app/modules/provider-options/provider-options.module.ts
+++ b/console/src/app/modules/provider-options/provider-options.module.ts
@@ -1,7 +1,7 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatCheckboxModule } from '@angular/material/checkbox';
import { TranslateModule } from '@ngx-translate/core';
import { InfoSectionModule } from '../info-section/info-section.module';
import { ProviderOptionsComponent } from './provider-options.component';
diff --git a/console/src/app/modules/providers/provider-apple/provider-apple.component.html b/console/src/app/modules/providers/provider-apple/provider-apple.component.html
index 9a109c2c2f..6e321a5992 100644
--- a/console/src/app/modules/providers/provider-apple/provider-apple.component.html
+++ b/console/src/app/modules/providers/provider-apple/provider-apple.component.html
@@ -102,17 +102,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-apple/provider-apple.component.ts b/console/src/app/modules/providers/provider-apple/provider-apple.component.ts
index 443d586c47..f80a8a8a2c 100644
--- a/console/src/app/modules/providers/provider-apple/provider-apple.component.ts
+++ b/console/src/app/modules/providers/provider-apple/provider-apple.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.html b/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.html
index 259cdc530c..de0a6707d5 100644
--- a/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.html
+++ b/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.html
@@ -65,17 +65,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.ts b/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.ts
index 6d6ba1f0ff..de4fd8efce 100644
--- a/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.ts
+++ b/console/src/app/modules/providers/provider-azure-ad/provider-azure-ad.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-github-es/provider-github-es.component.html b/console/src/app/modules/providers/provider-github-es/provider-github-es.component.html
index a4511570a6..fc3d08fdb0 100644
--- a/console/src/app/modules/providers/provider-github-es/provider-github-es.component.html
+++ b/console/src/app/modules/providers/provider-github-es/provider-github-es.component.html
@@ -80,17 +80,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-github-es/provider-github-es.component.ts b/console/src/app/modules/providers/provider-github-es/provider-github-es.component.ts
index 832fc0b379..276d03eba6 100644
--- a/console/src/app/modules/providers/provider-github-es/provider-github-es.component.ts
+++ b/console/src/app/modules/providers/provider-github-es/provider-github-es.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-github/provider-github.component.html b/console/src/app/modules/providers/provider-github/provider-github.component.html
index 540c178709..e6aa2ec3a1 100644
--- a/console/src/app/modules/providers/provider-github/provider-github.component.html
+++ b/console/src/app/modules/providers/provider-github/provider-github.component.html
@@ -61,17 +61,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-github/provider-github.component.ts b/console/src/app/modules/providers/provider-github/provider-github.component.ts
index c38ebf5b4a..865e2fc5d7 100644
--- a/console/src/app/modules/providers/provider-github/provider-github.component.ts
+++ b/console/src/app/modules/providers/provider-github/provider-github.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.html b/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.html
index 61df5dfbbc..5adc26b624 100644
--- a/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.html
+++ b/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.html
@@ -70,17 +70,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.ts b/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.ts
index d76d5ac777..2fa7170f1f 100644
--- a/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.ts
+++ b/console/src/app/modules/providers/provider-gitlab-self-hosted/provider-gitlab-self-hosted.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.html b/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.html
index c4ec64094b..9382347b4d 100644
--- a/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.html
+++ b/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.html
@@ -60,17 +60,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.ts b/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.ts
index 1d88f64baa..a6d889525f 100644
--- a/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.ts
+++ b/console/src/app/modules/providers/provider-gitlab/provider-gitlab.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-google/provider-google.component.html b/console/src/app/modules/providers/provider-google/provider-google.component.html
index a77006c7af..0e9dca638c 100644
--- a/console/src/app/modules/providers/provider-google/provider-google.component.html
+++ b/console/src/app/modules/providers/provider-google/provider-google.component.html
@@ -59,17 +59,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-google/provider-google.component.ts b/console/src/app/modules/providers/provider-google/provider-google.component.ts
index e9ebfef253..0a1160cd69 100644
--- a/console/src/app/modules/providers/provider-google/provider-google.component.ts
+++ b/console/src/app/modules/providers/provider-google/provider-google.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-oauth/provider-oauth.component.html b/console/src/app/modules/providers/provider-oauth/provider-oauth.component.html
index da85abb3a3..ea23e101ba 100644
--- a/console/src/app/modules/providers/provider-oauth/provider-oauth.component.html
+++ b/console/src/app/modules/providers/provider-oauth/provider-oauth.component.html
@@ -84,17 +84,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-oauth/provider-oauth.component.ts b/console/src/app/modules/providers/provider-oauth/provider-oauth.component.ts
index c838143e6f..1621df4123 100644
--- a/console/src/app/modules/providers/provider-oauth/provider-oauth.component.ts
+++ b/console/src/app/modules/providers/provider-oauth/provider-oauth.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/provider-oidc/provider-oidc.component.html b/console/src/app/modules/providers/provider-oidc/provider-oidc.component.html
index 41f8351629..8dbc345a97 100644
--- a/console/src/app/modules/providers/provider-oidc/provider-oidc.component.html
+++ b/console/src/app/modules/providers/provider-oidc/provider-oidc.component.html
@@ -64,17 +64,11 @@
-
-
+
+
{{ scope }} cancel
-
-
+
+
diff --git a/console/src/app/modules/providers/provider-oidc/provider-oidc.component.ts b/console/src/app/modules/providers/provider-oidc/provider-oidc.component.ts
index 080a850675..037b2dd6ba 100644
--- a/console/src/app/modules/providers/provider-oidc/provider-oidc.component.ts
+++ b/console/src/app/modules/providers/provider-oidc/provider-oidc.component.ts
@@ -2,7 +2,7 @@ import { COMMA, ENTER, SPACE } from '@angular/cdk/keycodes';
import { Location } from '@angular/common';
import { Component, Injector, Type } from '@angular/core';
import { AbstractControl, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatChipInputEvent } from '@angular/material/chips';
import { ActivatedRoute } from '@angular/router';
import { take } from 'rxjs';
import {
diff --git a/console/src/app/modules/providers/providers.module.ts b/console/src/app/modules/providers/providers.module.ts
index 47e2679cfb..5af3fee6a8 100644
--- a/console/src/app/modules/providers/providers.module.ts
+++ b/console/src/app/modules/providers/providers.module.ts
@@ -1,13 +1,13 @@
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 { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
@@ -64,7 +64,7 @@ import { ProvidersRoutingModule } from './providers-routing.module';
MatTooltipModule,
TranslateModule,
ProviderOptionsModule,
- MatLegacyProgressSpinnerModule,
+ MatProgressSpinnerModule,
],
})
export default class ProvidersModule {}
diff --git a/console/src/app/modules/providers/providers.scss b/console/src/app/modules/providers/providers.scss
index 8e96c3428e..0fb8879376 100644
--- a/console/src/app/modules/providers/providers.scss
+++ b/console/src/app/modules/providers/providers.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin identity-provider-theme($theme) {
$is-dark-theme: map-get($theme, is-dark);
$background: map-get($theme, background);
@@ -64,7 +62,7 @@
font-size: 12px;
}
- .mat-chip-input {
+ .mat-mdc-chip-input {
width: 100%;
margin: 0;
}
@@ -181,6 +179,7 @@
button[mat-raised-button] {
border-radius: 0.5rem;
padding: 0.5rem 4rem;
+ height: 3.5rem;
}
}
diff --git a/console/src/app/modules/refresh-table/refresh-table.component.html b/console/src/app/modules/refresh-table/refresh-table.component.html
index 895e937093..b971bb164c 100644
--- a/console/src/app/modules/refresh-table/refresh-table.component.html
+++ b/console/src/app/modules/refresh-table/refresh-table.component.html
@@ -6,15 +6,17 @@
|
-
- {{ 'ORG_DETAIL.TABLE.CLEAR' | translate }}
-
-
+
+
+ {{ 'ORG_DETAIL.TABLE.CLEAR' | translate }}
+
+
+
diff --git a/console/src/app/modules/refresh-table/refresh-table.component.scss b/console/src/app/modules/refresh-table/refresh-table.component.scss
index dbed9fc327..096aab6c85 100644
--- a/console/src/app/modules/refresh-table/refresh-table.component.scss
+++ b/console/src/app/modules/refresh-table/refresh-table.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin refresh-table-theme($theme) {
$foreground: map-get($theme, foreground);
@@ -48,6 +46,8 @@
.icon {
font-size: 1.2rem;
+ height: 1.2rem;
+ width: 1.2rem;
}
}
}
diff --git a/console/src/app/modules/refresh-table/refresh-table.module.ts b/console/src/app/modules/refresh-table/refresh-table.module.ts
index 0d797501fd..36fffce9b6 100644
--- a/console/src/app/modules/refresh-table/refresh-table.module.ts
+++ b/console/src/app/modules/refresh-table/refresh-table.module.ts
@@ -1,10 +1,10 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { PaginatorModule } from 'src/app/modules/paginator/paginator.module';
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
diff --git a/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.component.ts b/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.component.ts
index b3139d7b56..cf8164bd58 100644
--- a/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.component.ts
+++ b/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.component.ts
@@ -1,7 +1,6 @@
import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
-import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
-import { MatLegacyAutocomplete as MatAutocomplete } from '@angular/material/legacy-autocomplete';
+import { MatAutocomplete, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
import { debounceTime, from, map, Subject, switchMap, takeUntil, tap } from 'rxjs';
import { TextQueryMethod } from 'src/app/proto/generated/zitadel/object_pb';
import { Org, OrgNameQuery, OrgQuery, OrgState, OrgStateQuery } from 'src/app/proto/generated/zitadel/org_pb';
@@ -14,7 +13,6 @@ import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
styleUrls: ['./search-org-autocomplete.component.scss'],
})
export class SearchOrgAutocompleteComponent implements OnInit, OnDestroy {
- public selectable: boolean = true;
public myControl: UntypedFormControl = new UntypedFormControl();
public filteredOrgs: Array = [];
public isLoading: boolean = false;
diff --git a/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.module.ts b/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.module.ts
index 36c99d27f3..26bf94292c 100644
--- a/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.module.ts
+++ b/console/src/app/modules/search-org-autocomplete/search-org-autocomplete.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
diff --git a/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.component.ts b/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.component.ts
index 8a4e39ff97..c6613f3951 100644
--- a/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.component.ts
+++ b/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.component.ts
@@ -1,11 +1,8 @@
import { COMMA, ENTER } from '@angular/cdk/keycodes';
import { Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
-import {
- MatLegacyAutocomplete as MatAutocomplete,
- MatLegacyAutocompleteSelectedEvent as MatAutocompleteSelectedEvent,
-} from '@angular/material/legacy-autocomplete';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatAutocomplete, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { MatChipInputEvent } from '@angular/material/chips';
import { forkJoin, from, Subject } from 'rxjs';
import { debounceTime, switchMap, takeUntil, tap } from 'rxjs/operators';
import { ListProjectGrantsResponse, ListProjectsResponse } from 'src/app/proto/generated/zitadel/management_pb';
@@ -26,7 +23,6 @@ export enum ProjectAutocompleteType {
styleUrls: ['./search-project-autocomplete.component.scss'],
})
export class SearchProjectAutocompleteComponent implements OnInit, OnDestroy {
- public selectable: boolean = true;
public removable: boolean = true;
public addOnBlur: boolean = true;
public separatorKeysCodes: number[] = [ENTER, COMMA];
diff --git a/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.module.ts b/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.module.ts
index e018e2708a..2a170e34a5 100644
--- a/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.module.ts
+++ b/console/src/app/modules/search-project-autocomplete/search-project-autocomplete.module.ts
@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
diff --git a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.html b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.html
index 5fa9c90517..77b73f224f 100644
--- a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.html
+++ b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.html
@@ -11,17 +11,11 @@
[matAutocomplete]="auto"
/>
-
-
+
+
{{ selectedRole.displayName }}
cancel
-
+
-
+
diff --git a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.ts b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.ts
index 255103ea45..3aea4bb4da 100644
--- a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.ts
+++ b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.component.ts
@@ -1,11 +1,8 @@
import { COMMA, ENTER } from '@angular/cdk/keycodes';
import { Component, ElementRef, EventEmitter, Input, OnDestroy, Output, ViewChild } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
-import {
- MatLegacyAutocomplete as MatAutocomplete,
- MatLegacyAutocompleteSelectedEvent as MatAutocompleteSelectedEvent,
-} from '@angular/material/legacy-autocomplete';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatAutocomplete, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { MatChipInputEvent } from '@angular/material/chips';
import { from, Subject } from 'rxjs';
import { debounceTime, switchMap, takeUntil, tap } from 'rxjs/operators';
import { Role, RoleDisplayNameQuery, RoleQuery } from 'src/app/proto/generated/zitadel/project_pb';
@@ -17,7 +14,6 @@ import { ManagementService } from 'src/app/services/mgmt.service';
styleUrls: ['./search-roles-autocomplete.component.scss'],
})
export class SearchRolesAutocompleteComponent implements OnDestroy {
- public selectable: boolean = true;
public removable: boolean = true;
public addOnBlur: boolean = true;
public separatorKeysCodes: number[] = [ENTER, COMMA];
diff --git a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.module.ts b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.module.ts
index c4ac3214b9..cff2e7a22c 100644
--- a/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.module.ts
+++ b/console/src/app/modules/search-roles-autocomplete/search-roles-autocomplete.module.ts
@@ -1,11 +1,11 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from 'src/app/modules/input/input.module';
diff --git a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.scss b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.scss
index 78ecaee09a..4f2b918838 100644
--- a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.scss
+++ b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.scss
@@ -1,17 +1,15 @@
-@use '@angular/material' as mat;
-
@mixin search-user-autocomplete-theme($theme) {
$primary: map-get($theme, primary);
- $primary-color: mat.get-color-from-palette($primary, 500);
- $lighter-primary-color: mat.get-color-from-palette($primary, 300);
- $darker-primary-color: mat.get-color-from-palette($primary, 700);
+ $primary-color: map-get($primary, 500);
+ $lighter-primary-color: map-get($primary, 300);
+ $darker-primary-color: map-get($primary, 700);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
$secondary-text: map-get($foreground, secondary-text);
$is-dark-theme: map-get($theme, is-dark);
- $link-hover-color: if($is-dark-theme, mat.get-color-from-palette($primary, 200), $primary-color);
+ $link-hover-color: if($is-dark-theme, map-get($primary, 200), $primary-color);
$link-color: if($is-dark-theme, $lighter-primary-color, $primary-color);
.user-autocomplete-found {
diff --git a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.ts b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.ts
index 987e9f2263..aec06a0416 100644
--- a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.ts
+++ b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.component.ts
@@ -11,11 +11,8 @@ import {
ViewChild,
} from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
-import {
- MatLegacyAutocomplete as MatAutocomplete,
- MatLegacyAutocompleteSelectedEvent as MatAutocompleteSelectedEvent,
-} from '@angular/material/legacy-autocomplete';
-import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
+import { MatAutocomplete, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { MatChipInputEvent } from '@angular/material/chips';
import { from, of, Subject } from 'rxjs';
import { debounceTime, switchMap, takeUntil, tap } from 'rxjs/operators';
import { ListUsersResponse } from 'src/app/proto/generated/zitadel/management_pb';
@@ -35,7 +32,6 @@ export enum UserTarget {
styleUrls: ['./search-user-autocomplete.component.scss'],
})
export class SearchUserAutocompleteComponent implements OnInit, AfterContentChecked {
- public selectable: boolean = true;
public removable: boolean = true;
public addOnBlur: boolean = true;
public separatorKeysCodes: number[] = [ENTER, COMMA];
diff --git a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.module.ts b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.module.ts
index 5d6b0453b1..f4f19e6faa 100644
--- a/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.module.ts
+++ b/console/src/app/modules/search-user-autocomplete/search-user-autocomplete.module.ts
@@ -1,13 +1,13 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSelectModule } from '@angular/material/select';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { AvatarModule } from '../avatar/avatar.module';
diff --git a/console/src/app/modules/settings-grid/settings-grid.module.ts b/console/src/app/modules/settings-grid/settings-grid.module.ts
index 24fc0afd0e..59c1f5dcfc 100644
--- a/console/src/app/modules/settings-grid/settings-grid.module.ts
+++ b/console/src/app/modules/settings-grid/settings-grid.module.ts
@@ -1,8 +1,8 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
diff --git a/console/src/app/modules/shortcuts/shortcuts.component.scss b/console/src/app/modules/shortcuts/shortcuts.component.scss
index 775fc56a90..5dce518130 100644
--- a/console/src/app/modules/shortcuts/shortcuts.component.scss
+++ b/console/src/app/modules/shortcuts/shortcuts.component.scss
@@ -1,20 +1,18 @@
-@use '@angular/material' as mat;
-
@mixin shortcut-theme($theme) {
$primary: map-get($theme, primary);
$warn: map-get($theme, warn);
$background: map-get($theme, background);
$accent: map-get($theme, accent);
- $primary-color: mat.get-color-from-palette($primary, 500);
+ $primary-color: map-get($primary, 500);
- $warn-color: mat.get-color-from-palette($warn, 500);
- $accent-color: mat.get-color-from-palette($accent, 500);
+ $warn-color: map-get($warn, 500);
+ $accent-color: map-get($accent, 500);
$foreground: map-get($theme, foreground);
$is-dark-theme: map-get($theme, is-dark);
$back: map-get($background, background);
- $list-background-color: mat.get-color-from-palette($background, 300);
- $card-background-color: mat.get-color-from-palette($background, cards);
+ $list-background-color: map-get($background, 300);
+ $card-background-color: map-get($background, cards);
$border-color: if($is-dark-theme, rgba(#8795a1, 0.2), rgba(#8795a1, 0.2));
$border-selected-color: if($is-dark-theme, #fff, #000);
diff --git a/console/src/app/modules/shortcuts/shortcuts.module.ts b/console/src/app/modules/shortcuts/shortcuts.module.ts
index 57c593e23e..a48f02dc25 100644
--- a/console/src/app/modules/shortcuts/shortcuts.module.ts
+++ b/console/src/app/modules/shortcuts/shortcuts.module.ts
@@ -1,9 +1,9 @@
import { DragDropModule } from '@angular/cdk/drag-drop';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
diff --git a/console/src/app/modules/show-key-dialog/show-key-dialog.component.ts b/console/src/app/modules/show-key-dialog/show-key-dialog.component.ts
index 7b0c999cf0..e6655ae29b 100644
--- a/console/src/app/modules/show-key-dialog/show-key-dialog.component.ts
+++ b/console/src/app/modules/show-key-dialog/show-key-dialog.component.ts
@@ -1,8 +1,5 @@
import { Component, Inject } from '@angular/core';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { saveAs } from 'file-saver';
import { AddAppKeyResponse, AddMachineKeyResponse } from 'src/app/proto/generated/zitadel/management_pb';
import { InfoSectionType } from '../info-section/info-section.component';
diff --git a/console/src/app/modules/show-key-dialog/show-key-dialog.module.ts b/console/src/app/modules/show-key-dialog/show-key-dialog.module.ts
index 14e7523e22..66a3178747 100644
--- a/console/src/app/modules/show-key-dialog/show-key-dialog.module.ts
+++ b/console/src/app/modules/show-key-dialog/show-key-dialog.module.ts
@@ -1,11 +1,12 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatButtonModule } from '@angular/material/button';
import { TranslateModule } from '@ngx-translate/core';
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';
import { InfoSectionModule } from '../info-section/info-section.module';
+import { MatDialogModule } from '@angular/material/dialog';
import { ShowKeyDialogComponent } from './show-key-dialog.component';
@NgModule({
@@ -15,6 +16,7 @@ import { ShowKeyDialogComponent } from './show-key-dialog.component';
TranslateModule,
MatButtonModule,
LocalizedDatePipeModule,
+ MatDialogModule,
InfoSectionModule,
TimestampToDatePipeModule,
],
diff --git a/console/src/app/modules/show-token-dialog/show-token-dialog.component.ts b/console/src/app/modules/show-token-dialog/show-token-dialog.component.ts
index c42f659006..4ba5d3b508 100644
--- a/console/src/app/modules/show-token-dialog/show-token-dialog.component.ts
+++ b/console/src/app/modules/show-token-dialog/show-token-dialog.component.ts
@@ -1,8 +1,5 @@
import { Component, Inject } from '@angular/core';
-import {
- MatLegacyDialogRef as MatDialogRef,
- MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
-} from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { AddPersonalAccessTokenResponse } from 'src/app/proto/generated/zitadel/management_pb';
import { InfoSectionType } from '../info-section/info-section.component';
diff --git a/console/src/app/modules/show-token-dialog/show-token-dialog.module.ts b/console/src/app/modules/show-token-dialog/show-token-dialog.module.ts
index 207b3a1d2a..78ddb6ee51 100644
--- a/console/src/app/modules/show-token-dialog/show-token-dialog.module.ts
+++ b/console/src/app/modules/show-token-dialog/show-token-dialog.module.ts
@@ -1,12 +1,13 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatButtonModule } from '@angular/material/button';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { CopyToClipboardModule } from 'src/app/directives/copy-to-clipboard/copy-to-clipboard.module';
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';
+import { MatDialogModule } from '@angular/material/dialog';
import { InfoSectionModule } from '../info-section/info-section.module';
import { ShowTokenDialogComponent } from './show-token-dialog.component';
@@ -15,6 +16,7 @@ import { ShowTokenDialogComponent } from './show-token-dialog.component';
imports: [
CommonModule,
TranslateModule,
+ MatDialogModule,
InfoSectionModule,
CopyToClipboardModule,
MatButtonModule,
diff --git a/console/src/app/modules/sidenav/sidenav.component.scss b/console/src/app/modules/sidenav/sidenav.component.scss
index cc0caf57dd..383857751c 100644
--- a/console/src/app/modules/sidenav/sidenav.component.scss
+++ b/console/src/app/modules/sidenav/sidenav.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin sidenav-theme($theme) {
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
@@ -133,7 +131,6 @@
.sidenav-content {
width: 100%;
- overflow-x: auto;
}
@media only screen and (min-width: 824px) {
diff --git a/console/src/app/modules/string-list/string-list.component.scss b/console/src/app/modules/string-list/string-list.component.scss
index d44143914a..b5309d5964 100644
--- a/console/src/app/modules/string-list/string-list.component.scss
+++ b/console/src/app/modules/string-list/string-list.component.scss
@@ -1,5 +1,3 @@
-@use '@angular/material' as mat;
-
@mixin string-list-theme($theme) {
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
@@ -11,7 +9,7 @@
display: flex;
flex-direction: row;
max-width: 400px;
- background: if($is-dark-theme, #00000020, mat.get-color-from-palette($background, cards));
+ background: if($is-dark-theme, #00000020, map-get($background, cards));
margin-left: -1rem;
margin-right: -1rem;
padding: 0 1rem 0.5rem 1rem;
diff --git a/console/src/app/modules/string-list/string-list.module.ts b/console/src/app/modules/string-list/string-list.module.ts
index db9322641b..fb9d7938c8 100644
--- a/console/src/app/modules/string-list/string-list.module.ts
+++ b/console/src/app/modules/string-list/string-list.module.ts
@@ -1,10 +1,10 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
-import { MatLegacyButtonModule } from '@angular/material/legacy-button';
-import { MatLegacyChipsModule } from '@angular/material/legacy-chips';
-import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
import { InputModule } from '../input/input.module';
import { StringListComponent } from './string-list.component';
@@ -16,11 +16,11 @@ import { StringListComponent } from './string-list.component';
InputModule,
FormsModule,
ReactiveFormsModule,
- MatLegacyChipsModule,
+ MatChipsModule,
TranslateModule,
MatIconModule,
- MatLegacyTooltipModule,
- MatLegacyButtonModule,
+ MatTooltipModule,
+ MatButtonModule,
],
exports: [StringListComponent],
})
diff --git a/console/src/app/modules/table-actions/table-actions.component.html b/console/src/app/modules/table-actions/table-actions.component.html
index 5032f4dace..df19103af0 100644
--- a/console/src/app/modules/table-actions/table-actions.component.html
+++ b/console/src/app/modules/table-actions/table-actions.component.html
@@ -5,12 +5,12 @@
| 
-Do you look for a user management that's quickly set up like Auth0 and open source like Keycloak?
+
+Are you searching for a user management tool that is quickly set up like Auth0 and open source like Keycloak?
Do you have a project that requires multi-tenant user management with self-service for your customers?
Look no further — ZITADEL is the identity infrastructure, simplified for you.
-We provide you with a wide range of out-of-the-box features to accelerate your project.
-Multi-tenancy with branding customization, secure login, self-service, OpenID Connect, OAuth2.x, SAML2, LDAP, Passkeys / FIDO2, OTP, U2F, and an unlimited audit trail is there for you, ready to use.
+We provide you with a wide range of out-of-the-box features to accelerate your project, including:
-With ZITADEL you can rely on a hardened and extensible turnkey solution to solve all of your authentication and authorization needs.
+:white_check_mark: Multi-tenancy with branding customization
+
+:white_check_mark: Secure login
+
+:white_check_mark: Self-service
+
+:white_check_mark: OpenID Connect
+
+:white_check_mark: OAuth2.x
+
+:white_check_mark: SAML2
+
+:white_check_mark: LDAP
+
+:white_check_mark: Passkeys / FIDO2
+
+:white_check_mark: OTP
+
+:white_check_mark: U2F, and an unlimited audit trail is there for you, ready to use.
+
+
+With ZITADEL, you are assured of a robust and customizable turnkey solution for all your authentication and authorization needs.
---
@@ -51,7 +72,7 @@ With ZITADEL you can rely on a hardened and extensible turnkey solution to solve
### Deploy ZITADEL (Self-Hosted)
-Deploying ZITADEL locally takes less than 3 minutes. So go ahead and give it a try!
+Deploying ZITADEL locally takes less than 3 minutes. Go ahead and give it a try!
* [Linux](https://zitadel.com/docs/self-hosting/deploy/linux)
* [MacOS](https://zitadel.com/docs/self-hosting/deploy/macos)
@@ -67,7 +88,7 @@ See all guides [here](https://zitadel.com/docs/self-hosting/deploy/overview)
If you want to experience a hands-free ZITADEL, you should use [ZITADEL Cloud](https://zitadel.cloud).
-ZITADEL Cloud comes with a free tier and provides you all the features that you find in the open source version.
+ZITADEL Cloud comes with a free tier, providing you with all the same features as the open-source version.
Learn more about the [pay-as-you-go pricing](https://zitadel.com/pricing).
### Example applications
@@ -122,14 +143,14 @@ Self-Service
- [Administration UI (Console)](https://zitadel.com/docs/guides/manage/console/overview)
Deployment
-- [Postgres](https://zitadel.com/docs/self-hosting/manage/database#postgres) (version >= 14) or [CockroachDB](https://zitadel.com/docs/self-hosting/manage/database#cockroach) (version >= 22.0)
+- [Postgres](https://zitadel.com/docs/self-hosting/manage/database#postgres) (version >= 14) or [CockroachDB](https://zitadel.com/docs/self-hosting/manage/database#cockroach) (version latest stable)
- [Zero Downtime Updates](https://zitadel.com/docs/concepts/architecture/solution#zero-downtime-updates)
Track upcoming features on our [roadmap](https://zitadel.com/roadmap).
## How To Contribute
-Details about how to contribute you can find in the [Contribution Guide](./CONTRIBUTING.md)
+Find details about how you can contribute in our [Contribution Guide](./CONTRIBUTING.md)
## Contributors
@@ -161,13 +182,13 @@ Use [Console](https://zitadel.com/docs/guides/manage/console/overview) or our [A
## Security
-See the policy [here](./SECURITY.md).
+You can find our security policy [here](./SECURITY.md).
[Technical Advisories](https://zitadel.com/docs/support/technical_advisory) are published regarding major issues with the ZITADEL platform that could potentially impact security or stability in production environments.
## License
-See the exact licensing terms [here](./LICENSE)
+[here](./LICENSE) are our exact licensing terms.
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and limitations under the License.
+See our [license](./LICENSE) for detailed information governing permissions and limitations on use.
diff --git a/build/workflow.Dockerfile b/build/workflow.Dockerfile
index c9fb7e6c2b..db27daf91c 100644
--- a/build/workflow.Dockerfile
+++ b/build/workflow.Dockerfile
@@ -103,7 +103,7 @@ COPY --from=core-assets /go/src/github.com/zitadel/zitadel/internal ./internal
# #######################################
# download console dependencies
# #######################################
-FROM node:18-buster AS console-deps
+FROM node:20-buster AS console-deps
WORKDIR /zitadel/console
@@ -115,7 +115,7 @@ RUN yarn install --frozen-lockfile
# #######################################
# generate console client
# #######################################
-FROM node:18-buster AS console-client
+FROM node:20-buster AS console-client
WORKDIR /zitadel/console
diff --git a/cmd/defaults.yaml b/cmd/defaults.yaml
index 7897e12834..cef9c0382e 100644
--- a/cmd/defaults.yaml
+++ b/cmd/defaults.yaml
@@ -201,6 +201,9 @@ Projections:
Customizations:
Projects:
TransactionDuration: 2s
+ custom_texts:
+ TransactionDuration: 2s
+ BulkLimit: 400
# The Notifications projection is used for sending emails and SMS to users
Notifications:
# As notification projections don't result in database statements, retries don't have an effect
@@ -389,11 +392,27 @@ EncryptionKeys:
UserAgentCookieKeyID: "userAgentCookieKey" # ZITADEL_ENCRYPTIONKEYS_USERAGENTCOOKIEKEYID
SystemAPIUsers:
-# Add keys for authentication of the systemAPI here:
-# you can specify any name for the user, but they will have to match the `issuer` and `sub` claim in the JWT:
+# # Add keys for authentication of the systemAPI here:
+# # you can specify any name for the user, but they will have to match the `issuer` and `sub` claim in the JWT:
# - superuser:
-# Path: /path/to/superuser/key.pem # you can provide the key either by reference with the path
+# Path: /path/to/superuser/ey.pem # you can provide the key either by reference with the path
+# Memberships:
+# # MemberType System allows the user to access all APIs for all instances or organizations
+# - MemberType: System
+# Roles:
+# - "SYSTEM_OWNER"
+# # Actually, we don't recommend adding IAM_OWNER and ORG_OWNER to the System membership, as this basically enables god mode for the system user
+# - "IAM_OWNER"
+# - "ORG_OWNER"
+# # MemberType IAM and Organization let you restrict access to a specific instance or organization by specifying the AggregateID
+# - MemberType: IAM
+# Roles: "IAM_OWNER"
+# AggregateID: "123456789012345678"
+# - MemberType: Organization
+# Roles: "ORG_OWNER"
+# AggregateID: "123456789012345678"
# - superuser2:
+# # If no memberships are specified, the user has a membership of type System with the role "SYSTEM_OWNER"
# KeyData: