mirror of
https://github.com/andwati/zitadel.git
synced 2026-11-10 16:15:12 +00:00
feat: console flat navigation, settings (#3581)
* instance routing * instance naming * org list * rm isonsystem * breadcrumb type * routing * instance members * fragment refresh org * settings pages * settings list, sidenav grouping, i18n * org-settings, policy changes * lint * grid * rename grid * fallback to general * cleanup * general settings, remove cards * sidenav for settings, label policy * i18n * header, nav backbuild * general, project nav rehaul * login text background adapt * org nav anim * org, instance settings, fix policy layout, roles * i18n, active route for project * lint
This commit is contained in:
Max Peintner
@@ -0,0 +1,37 @@
|
||||
<cnsl-sidenav
|
||||
[title]="title"
|
||||
[description]="description"
|
||||
[indented]="true"
|
||||
[(ngModel)]="currentSetting"
|
||||
[settingsList]="settingsList"
|
||||
queryParam="id"
|
||||
>
|
||||
<ng-container *ngIf="currentSetting === 'general' && serviceType === PolicyComponentServiceType.ADMIN">
|
||||
<cnsl-general-settings [serviceType]="serviceType"></cnsl-general-settings>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'complexity'">
|
||||
<cnsl-password-complexity-policy [serviceType]="serviceType"></cnsl-password-complexity-policy>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'lockout'">
|
||||
<cnsl-password-lockout-policy [serviceType]="serviceType"></cnsl-password-lockout-policy>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'login'">
|
||||
<!-- <cnsl-org-iam-policy [serviceType]="serviceType"></cnsl-org-iam-policy> -->
|
||||
<cnsl-login-policy [serviceType]="serviceType"></cnsl-login-policy>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'idp'">
|
||||
<cnsl-idp-settings [serviceType]="serviceType"></cnsl-idp-settings>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'branding'">
|
||||
<cnsl-private-labeling-policy [serviceType]="serviceType"></cnsl-private-labeling-policy>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'messagetexts'">
|
||||
<cnsl-message-texts [serviceType]="serviceType"></cnsl-message-texts>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'logintexts'">
|
||||
<cnsl-login-texts [serviceType]="serviceType"></cnsl-login-texts>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="currentSetting === 'privacypolicy'">
|
||||
<cnsl-privacy-policy [serviceType]="PolicyComponentServiceType.ADMIN"></cnsl-privacy-policy>
|
||||
</ng-container>
|
||||
</cnsl-sidenav>
|
||||
@@ -0,0 +1,3 @@
|
||||
.divider {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SettingsListComponent } from './settings-list.component';
|
||||
|
||||
describe('SettingsListComponent', () => {
|
||||
let component: SettingsListComponent;
|
||||
let fixture: ComponentFixture<SettingsListComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ SettingsListComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(SettingsListComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,31 @@
|
||||
import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
|
||||
|
||||
import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
|
||||
import { SidenavSetting } from '../sidenav/sidenav.component';
|
||||
|
||||
@Component({
|
||||
selector: 'cnsl-settings-list',
|
||||
templateUrl: './settings-list.component.html',
|
||||
styleUrls: ['./settings-list.component.scss'],
|
||||
})
|
||||
export class SettingsListComponent implements OnChanges {
|
||||
@Input() public title: string = '';
|
||||
@Input() public description: string = '';
|
||||
@Input() public serviceType!: PolicyComponentServiceType;
|
||||
@Input() public selectedId: string = '';
|
||||
@Input() public settingsList: SidenavSetting[] = [];
|
||||
public currentSetting: string | undefined = '';
|
||||
public PolicyComponentServiceType: any = PolicyComponentServiceType;
|
||||
constructor() {}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
if (changes.selectedId?.currentValue) {
|
||||
this.currentSetting =
|
||||
this.settingsList && this.settingsList.find((l) => l.id === changes.selectedId.currentValue)
|
||||
? changes.selectedId.currentValue
|
||||
: '';
|
||||
} else {
|
||||
this.currentSetting = this.settingsList ? this.settingsList[0].id : '';
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module';
|
||||
|
||||
import { CardModule } from '../card/card.module';
|
||||
import { GeneralSettingsModule } from '../policies/general-settings/general-settings.module';
|
||||
import { IdpSettingsModule } from '../policies/idp-settings/idp-settings.module';
|
||||
import { LoginPolicyModule } from '../policies/login-policy/login-policy.module';
|
||||
import { LoginTextsPolicyModule } from '../policies/login-texts/login-texts.module';
|
||||
import { MessageTextsPolicyModule } from '../policies/message-texts/message-texts.module';
|
||||
import { OrgIamPolicyModule } from '../policies/org-iam-policy/org-iam-policy.module';
|
||||
import { PasswordComplexityPolicyModule } from '../policies/password-complexity-policy/password-complexity-policy.module';
|
||||
import { PasswordLockoutPolicyModule } from '../policies/password-lockout-policy/password-lockout-policy.module';
|
||||
import { PrivacyPolicyModule } from '../policies/privacy-policy/privacy-policy.module';
|
||||
import { PrivateLabelingPolicyModule } from '../policies/private-labeling-policy/private-labeling-policy.module';
|
||||
import { SidenavModule } from '../sidenav/sidenav.module';
|
||||
import { SettingsListComponent } from './settings-list.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [SettingsListComponent],
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
SidenavModule,
|
||||
LoginPolicyModule,
|
||||
CardModule,
|
||||
PasswordComplexityPolicyModule,
|
||||
PasswordLockoutPolicyModule,
|
||||
PrivateLabelingPolicyModule,
|
||||
GeneralSettingsModule,
|
||||
IdpSettingsModule,
|
||||
PrivacyPolicyModule,
|
||||
MessageTextsPolicyModule,
|
||||
LoginTextsPolicyModule,
|
||||
OrgIamPolicyModule,
|
||||
TranslateModule,
|
||||
HasRolePipeModule,
|
||||
],
|
||||
exports: [SettingsListComponent],
|
||||
})
|
||||
export class SettingsListModule {}
|
||||
@@ -0,0 +1,66 @@
|
||||
import { SidenavSetting } from '../sidenav/sidenav.component';
|
||||
|
||||
export const GENERAL: SidenavSetting = {
|
||||
id: 'general',
|
||||
i18nKey: 'SETTINGS.LIST.GENERAL',
|
||||
};
|
||||
|
||||
export const LOGIN: SidenavSetting = {
|
||||
id: 'login',
|
||||
i18nKey: 'SETTINGS.LIST.LOGIN',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.LOGIN',
|
||||
// requiredRoles: {
|
||||
// [PolicyComponentServiceType.ADMIN]: true,
|
||||
// [PolicyComponentServiceType.MGMT]: true,
|
||||
// }
|
||||
};
|
||||
|
||||
export const LOCKOUT: SidenavSetting = {
|
||||
id: 'lockout',
|
||||
i18nKey: 'SETTINGS.LIST.LOCKOUT',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.LOGIN',
|
||||
};
|
||||
|
||||
export const COMPLEXITY: SidenavSetting = {
|
||||
id: 'complexity',
|
||||
i18nKey: 'SETTINGS.LIST.COMPLEXITY',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.LOGIN',
|
||||
};
|
||||
|
||||
export const IDP: SidenavSetting = { id: 'idp', i18nKey: 'SETTINGS.LIST.IDP', groupI18nKey: 'SETTINGS.GROUPS.LOGIN' };
|
||||
|
||||
export const NOTIFICATIONPROVIDERS: SidenavSetting = {
|
||||
id: 'notificationproviders',
|
||||
i18nKey: 'SETTINGS.LIST.NOTIFICATIONPROVIDERS',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.NOTIFICATIONS',
|
||||
};
|
||||
|
||||
export const NOTIFICATIONS: SidenavSetting = {
|
||||
id: 'notifications',
|
||||
i18nKey: 'SETTINGS.LIST.NOTIFICATIONS',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.NOTIFICATIONS',
|
||||
};
|
||||
|
||||
export const MESSAGETEXTS: SidenavSetting = {
|
||||
id: 'messagetexts',
|
||||
i18nKey: 'SETTINGS.LIST.MESSAGETEXTS',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.APPEARANCE',
|
||||
};
|
||||
|
||||
export const LOGINTEXTS: SidenavSetting = {
|
||||
id: 'logintexts',
|
||||
i18nKey: 'SETTINGS.LIST.LOGINTEXTS',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.APPEARANCE',
|
||||
};
|
||||
|
||||
export const PRIVACYPOLICY: SidenavSetting = {
|
||||
id: 'privacypolicy',
|
||||
i18nKey: 'SETTINGS.LIST.PRIVACYPOLICY',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.OTHER',
|
||||
};
|
||||
|
||||
export const BRANDING: SidenavSetting = {
|
||||
id: 'branding',
|
||||
i18nKey: 'SETTINGS.LIST.BRANDING',
|
||||
groupI18nKey: 'SETTINGS.GROUPS.APPEARANCE',
|
||||
};
|
||||
Reference in New Issue
Block a user