fix(console): simplify instance page (#7274)

* move settings, rm nav for single org * move instance pages to settings * i18n * revalidate orgs on create * Update bg.json * show custome portal link * Update console/src/app/modules/settings-list/settings.ts Co-authored-by: Livio Spring <[email protected]> * Update console/src/app/modules/settings-list/settings.ts Co-authored-by: Livio Spring <[email protected]> * Update console/src/app/modules/settings-list/settings.ts Co-authored-by: Livio Spring <[email protected]> * add org page to instance settings * iam.read for org list * i18n * instance imgs, cleanup * rm unused imgs * remove unused imgs, replace default settings imgs * event image * e2e url * instance url --------- Co-authored-by: Livio Spring <[email protected]>
2026-10-23 07:52:15 +00:00 · 2024-02-06 14:35:43 +01:00
parent 7f7fb55f34
commit ca49e0f532
178 changed files with 598 additions and 729 deletions
@@ -1,8 +1,8 @@
 import { Component } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
-import { Router } from '@angular/router';
-import { BehaviorSubject, from, Observable, of } from 'rxjs';
-import { catchError, finalize, map } from 'rxjs/operators';
+import { ActivatedRoute, Params, Router } from '@angular/router';
+import { BehaviorSubject, from, Observable, of, Subject } from 'rxjs';
+import { catchError, finalize, map, takeUntil } from 'rxjs/operators';
 import { CreationType, MemberCreateDialogComponent } from 'src/app/modules/add-member-dialog/member-create-dialog.component';
 import { PolicyComponentServiceType } from 'src/app/modules/policies/policy-component-types.enum';
 import { InstanceDetail, State } from 'src/app/proto/generated/zitadel/instance_pb';
@@ -11,7 +11,31 @@ import { User } from 'src/app/proto/generated/zitadel/user_pb';
 import { AdminService } from 'src/app/services/admin.service';
 import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service';
 import { ToastService } from 'src/app/services/toast.service';
-
+import {
+  BRANDING,
+  COMPLEXITY,
+  DOMAIN,
+  LANGUAGES,
+  IDP,
+  LOCKOUT,
+  LOGIN,
+  LOGINTEXTS,
+  MESSAGETEXTS,
+  NOTIFICATIONS,
+  OIDC,
+  PRIVACYPOLICY,
+  SECRETS,
+  SECURITY,
+  SMS_PROVIDER,
+  SMTP_PROVIDER,
+  VIEWS,
+  FAILEDEVENTS,
+  EVENTS,
+  ORGANIZATIONS,
+} from '../../modules/settings-list/settings';
+import { SidenavSetting } from 'src/app/modules/sidenav/sidenav.component';
+import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
+import { EnvironmentService } from 'src/app/services/environment.service';
@Component({
  selector: 'cnsl-instance',
  templateUrl: './instance.component.html',
@@ -25,12 +49,51 @@ export class InstanceComponent {
  public totalMemberResult: number = 0;
  public membersSubject: BehaviorSubject<Member.AsObject[]> = new BehaviorSubject<Member.AsObject[]>([]);
  public State: any = State;
+
+  public id: string = '';
+  public defaultSettingsList: SidenavSetting[] = [
+    ORGANIZATIONS,
+    // notifications
+    // { showWarn: true, ...NOTIFICATIONS },
+    NOTIFICATIONS,
+    SMTP_PROVIDER,
+    SMS_PROVIDER,
+    // login
+    LOGIN,
+    IDP,
+    COMPLEXITY,
+    LOCKOUT,
+
+    DOMAIN,
+    // appearance
+    BRANDING,
+    MESSAGETEXTS,
+    LOGINTEXTS,
+    // storage
+    VIEWS,
+    EVENTS,
+    FAILEDEVENTS,
+    // others
+    PRIVACYPOLICY,
+    LANGUAGES,
+    OIDC,
+    SECRETS,
+    SECURITY,
+  ];
+
+  public settingsList: Observable<SidenavSetting[]> = of([]);
+  public customerPortalLink$ = this.envService.env.pipe(map((env) => env.customer_portal));
+
+  private destroy$: Subject<void> = new Subject();
  constructor(
    public adminService: AdminService,
    private dialog: MatDialog,
    private toast: ToastService,
    breadcrumbService: BreadcrumbService,
    private router: Router,
+    private authService: GrpcAuthService,
+    private envService: EnvironmentService,
+    activatedRoute: ActivatedRoute,
  ) {
    this.loadMembers();

@@ -52,6 +115,13 @@ export class InstanceComponent {
      .catch((error) => {
        this.toast.showError(error);
      });
+
+    activatedRoute.queryParams.pipe(takeUntil(this.destroy$)).subscribe((params: Params) => {
+      const { id } = params;
+      if (id) {
+        this.id = id;
+      }
+    });
  }

  public loadMembers(): void {
@@ -113,4 +183,16 @@ export class InstanceComponent {
  public showDetail(): void {
    this.router.navigate(['/instance', 'members']);
  }
+
+  ngOnInit(): void {
+    this.settingsList = this.authService.isAllowedMapper(
+      this.defaultSettingsList,
+      (setting) => setting.requiredRoles.admin || [],
+    );
+  }
+
+  ngOnDestroy(): void {
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
 }