Skip to content

Commit

Permalink
fix(console): show warn dialog when view switched to instance (#5935)
Browse files Browse the repository at this point in the history
fix: show warn dialog when changed to instance
  • Loading branch information
peintnermax committed May 26, 2023
1 parent 9aed031 commit 6c90f08
Show file tree
Hide file tree
Showing 11 changed files with 70 additions and 14 deletions.
22 changes: 11 additions & 11 deletions console/src/app/modules/idp-table/idp-table.component.html
Expand Up @@ -13,7 +13,7 @@
<th class="availability" mat-header-cell *matHeaderCellDef>
<span>{{ 'IDP.AVAILABILITY' | translate }}</span>
</th>
<td class="availability" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer availability" mat-cell *matCellDef="let idp">
<i
matTooltip="{{ 'IDP.AVAILABLE' | translate }}"
*ngIf="isEnabled(idp) && idp.state === IDPState.IDP_STATE_ACTIVE"
Expand All @@ -29,14 +29,14 @@

<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.NAME' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
<span>{{ idp?.name }}</span>
</td>
</ng-container>

<ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.TYPE' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
<div [ngSwitch]="idp.type">
<div class="idp-table-provider-type" *ngSwitchCase="ProviderType.PROVIDER_TYPE_AZURE_AD">
<img class="idp-logo" src="./assets/images/idp/ms.svg" alt="azure ad" />
Expand Down Expand Up @@ -87,7 +87,7 @@

<ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.STATE' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
<span
class="state"
[ngClass]="{
Expand All @@ -101,21 +101,21 @@

<ng-container matColumnDef="creationDate">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.CREATIONDATE' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
<span>{{ idp.details.creationDate | timestampToDate | localizedDate : 'dd. MMM, HH:mm' }}</span>
</td>
</ng-container>

<ng-container matColumnDef="changeDate">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.CHANGEDATE' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
<span>{{ idp.details.changeDate | timestampToDate | localizedDate : 'dd. MMM, HH:mm' }}</span>
</td>
</ng-container>

<ng-container matColumnDef="owner">
<th mat-header-cell *matHeaderCellDef>{{ 'IDP.OWNER' | translate }}</th>
<td class="pointer" [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<td class="pointer" mat-cell *matCellDef="let idp">
{{ 'IDP.OWNERTYPES.' + idp.owner | translate }}
</td>
</ng-container>
Expand All @@ -140,7 +140,7 @@
"
mat-icon-button
matTooltip="{{ 'IDP.SETAVAILABLE' | translate }}"
(click)="addIdp(idp)"
(click)="addIdp(idp); $event.stopPropagation()"
>
<i class="las la-check-circle"></i>
</button>
Expand All @@ -160,7 +160,7 @@
"
mat-icon-button
matTooltip="{{ 'IDP.SETUNAVAILABLE' | translate }}"
(click)="removeIdp(idp)"
(click)="removeIdp(idp); $event.stopPropagation()"
>
<i class="las la-times-circle"></i>
</button>
Expand All @@ -185,7 +185,7 @@
mat-icon-button
color="warn"
matTooltip="{{ 'ACTIONS.REMOVE' | translate }}"
(click)="deleteIdp(idp)"
(click)="deleteIdp(idp); $event.stopPropagation()"
>
<i class="las la-trash"></i>
</button>
Expand All @@ -194,7 +194,7 @@
</ng-container>

<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr class="highlight" mat-row *matRowDef="let row; columns: displayedColumns"></tr>
<tr class="highlight" (click)="navigateToIDP(row)" mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</div>

Expand Down
22 changes: 20 additions & 2 deletions console/src/app/modules/idp-table/idp-table.component.ts
Expand Up @@ -2,7 +2,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 { RouterLink } from '@angular/router';
import { Router, RouterLink } from '@angular/router';
import { TranslateService } from '@ngx-translate/core';
import { Duration } from 'google-protobuf/google/protobuf/duration_pb';
import { BehaviorSubject, Observable } from 'rxjs';
Expand Down Expand Up @@ -31,6 +31,8 @@ import { AdminService } from 'src/app/services/admin.service';
import { ManagementService } from 'src/app/services/mgmt.service';
import { ToastService } from 'src/app/services/toast.service';

import { OverlayWorkflowService } from 'src/app/services/overlay/overlay-workflow.service';
import { ContextChangedWorkflowOverlays } from 'src/app/services/overlay/workflows';
import { PageEvent, PaginatorComponent } from '../paginator/paginator.component';
import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
import { WarnDialogComponent } from '../warn-dialog/warn-dialog.component';
Expand Down Expand Up @@ -60,7 +62,13 @@ export class IdpTableComponent implements OnInit {
public IDPStylingType: any = IDPStylingType;
public loginPolicy!: LoginPolicy.AsObject;

constructor(public translate: TranslateService, private toast: ToastService, private dialog: MatDialog) {
constructor(
private workflowService: OverlayWorkflowService,
public translate: TranslateService,
private toast: ToastService,
private dialog: MatDialog,
private router: Router,
) {
this.selection.changed.subscribe(() => {
this.changedSelection.emit(this.selection.selected);
});
Expand Down Expand Up @@ -241,6 +249,16 @@ export class IdpTableComponent implements OnInit {
}
}

navigateToIDP(row: Provider.AsObject) {
this.router.navigate(this.routerLinkForRow(row)).then(() => {
if (this.serviceType === PolicyComponentServiceType.MGMT && row.owner === IDPOwnerType.IDP_OWNER_TYPE_SYSTEM) {
setTimeout(() => {
this.workflowService.startWorkflow(ContextChangedWorkflowOverlays, null);
}, 1000);
}
});
}

private async getIdps(): Promise<IDPLoginPolicyLink.AsObject[]> {
switch (this.serviceType) {
case PolicyComponentServiceType.MGMT:
Expand Down
14 changes: 14 additions & 0 deletions console/src/app/services/overlay/workflows.ts
Expand Up @@ -66,3 +66,17 @@ export const OrgContextChangedWorkflowOverlays: CnslOverlay[] = [
},
},
];

export const ContextChangedWorkflowOverlays: CnslOverlay[] = [
{
id: 'contextswitcher',
origin: 'orgbutton',
toHighlight: ['orgbutton'],
content: {
i18nText: 'OVERLAYS.SWITCHEDTOINSTANCE.TEXT',
},
requirements: {
permission: ['iam.read'],
},
},
];
3 changes: 3 additions & 0 deletions console/src/assets/i18n/de.json
Expand Up @@ -204,6 +204,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "Achtung! Soeben wurde die Organisation gewechselt."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "Soeben wurde die Ansicht auf Instanz gewechselt."
}
},
"FILTER": {
Expand Down
5 changes: 4 additions & 1 deletion console/src/assets/i18n/en.json
Expand Up @@ -204,7 +204,10 @@
"TEXT": "This navigation changes based on your selected organization above or your instance"
},
"CONTEXTCHANGED": {
"TEXT": "Attention! The organization context has changed."
"TEXT": "The organization context has changed."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "The view just changed to instance!"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/es.json
Expand Up @@ -205,6 +205,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "¡Atención! El contexto de la organización ha cambiado."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "¡La vista acaba de cambiar a instancia!"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/fr.json
Expand Up @@ -204,6 +204,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "Attention ! Le contexte de l'organisation a changé."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "La vue vient de changer en instance !"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/it.json
Expand Up @@ -204,6 +204,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "Attenzione! L'organizzazione è appena stata cambiata."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "La visualizzazione è appena stata modificata in istanza!"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/ja.json
Expand Up @@ -205,6 +205,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "注意! 組織のコンテキストが変更されました。"
},
"SWITCHEDTOINSTANCE": {
"TEXT": "ビューがインスタンスに変更されました。"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/pl.json
Expand Up @@ -204,6 +204,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "Uwaga! Kontekst organizacji uległ zmianie."
},
"SWITCHEDTOINSTANCE": {
"TEXT": "Widok właśnie zmienił się na instancję!"
}
},
"FILTER": {
Expand Down
3 changes: 3 additions & 0 deletions console/src/assets/i18n/zh.json
Expand Up @@ -204,6 +204,9 @@
},
"CONTEXTCHANGED": {
"TEXT": "注意!组织环境发生了变化。"
},
"SWITCHEDTOINSTANCE": {
"TEXT": "视图刚刚更改为实例!"
}
},
"FILTER": {
Expand Down

1 comment on commit 6c90f08

@vercel
Copy link

@vercel vercel bot commented on 6c90f08 May 26, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

docs – ./

zitadel-docs.vercel.app
docs-git-main-zitadel.vercel.app
docs-zitadel.vercel.app

Please sign in to comment.