TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-01-06 13:57:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(console): asset path on signout route, stop event propagation in actions table (#4016)

Browse Source 
fix: asset path, stop event propagation in actions table
This commit is contained in:
Max Peintner 2022-07-22 09:06:16 +02:00 committed by GitHub
parent 5da72dee92
commit 0cc548e3f8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 65 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
console/src/app/pages/actions/action-table/action-table.component.html
View File

@ -1,22 +1,28 @@
<cnsl-refresh-table [hideRefresh]="true" [loading]="loading$ | async" (refreshed)="refreshPage()"
[dataSize]="dataSource?.data?.length ?? 0" [timestamp]="actionsResult?.details?.viewTimestamp"
[selection]="selection">
<cnsl-refresh-table
[hideRefresh]="true"
[loading]="loading$ | async"
(refreshed)="refreshPage()"
[dataSize]="dataSource?.data?.length ?? 0"
[timestamp]="actionsResult?.details?.viewTimestamp"
[selection]="selection"
>
<div actions *ngIf="selection.isEmpty()">
<a class="cnsl-action-button" color="primary" mat-raised-button (click)="openAddAction()">
<mat-icon class="icon">add</mat-icon>{{ 'ACTIONS.NEW' | translate }}
</a>
</div>
<div actions *ngIf="!selection.isEmpty()">
<button class="margin-right action-state-btn cnsl-action-button bg-state inactive" mat-raised-button
(click)="deactivateSelection()">
<button
class="margin-right action-state-btn cnsl-action-button bg-state inactive"
mat-raised-button
(click)="deactivateSelection()"
>
<span>{{ 'ACTIONS.DEACTIVATE' | translate }}</span>
<cnsl-action-keys (actionTriggered)="deactivateSelection()" [type]="ActionKeysType.DEACTIVATE">
</cnsl-action-keys>
<cnsl-action-keys (actionTriggered)="deactivateSelection()" [type]="ActionKeysType.DEACTIVATE"> </cnsl-action-keys>
</button>
<button class="action-state-btn cnsl-action-button bg-state active" mat-raised-button (click)="activateSelection()">
<span>{{ 'ACTIONS.REACTIVATE' | translate }}</span>
<cnsl-action-keys (actionTriggered)="activateSelection()" [type]="ActionKeysType.REACTIVATE">
</cnsl-action-keys>
<cnsl-action-keys (actionTriggered)="activateSelection()" [type]="ActionKeysType.REACTIVATE"> </cnsl-action-keys>
</button>
</div>
@ -24,48 +30,61 @@
<table class="table" mat-table [dataSource]="dataSource">
<ng-container matColumnDef="select">
<th mat-header-cell *matHeaderCellDef class="action-select-cell">
<mat-checkbox color="primary" (change)="$event ? masterToggle() : null"
<mat-checkbox
color="primary"
(change)="$event ? masterToggle() : null"
[checked]="selection.hasValue() && isAllSelected()"
[indeterminate]="selection.hasValue() && !isAllSelected()">
[indeterminate]="selection.hasValue() && !isAllSelected()"
>
</mat-checkbox>
</th>
<td mat-cell *matCellDef="let key" class="action-select-cell">
<mat-checkbox color="primary" (click)="$event.stopPropagation()"
(change)="$event ? selection.toggle(key) : null" [checked]="selection.isSelected(key)">
<mat-checkbox
color="primary"
(click)="$event.stopPropagation()"
(change)="$event ? selection.toggle(key) : null"
[checked]="selection.isSelected(key)"
>
</mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> {{ 'FLOWS.ID' | translate }} </th>
<td mat-cell *matCellDef="let action" class="pointer"> {{ action?.id }} </td>
<th mat-header-cell *matHeaderCellDef>{{ 'FLOWS.ID' | translate }}</th>
<td mat-cell *matCellDef="let action" class="pointer">{{ action?.id }}</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> {{ 'FLOWS.NAME' | translate }} </th>
<td mat-cell *matCellDef="let action" class="pointer"> {{ action?.name }} </td>
<th mat-header-cell *matHeaderCellDef>{{ 'FLOWS.NAME' | translate }}</th>
<td mat-cell *matCellDef="let action" class="pointer">{{ action?.name }}</td>
</ng-container>
<ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef> {{ 'FLOWS.STATE' | translate }} </th>
<th mat-header-cell *matHeaderCellDef>{{ 'FLOWS.STATE' | translate }}</th>
<td mat-cell *matCellDef="let action" class="pointer">
<span class="state"
[ngClass]="{'active': action.state === ActionState.ACTION_STATE_ACTIVE,'inactive': action.state === ActionState.ACTION_STATE_INACTIVE }">
{{'FLOWS.STATES.'+action.state | translate}}</span>
<span
class="state"
[ngClass]="{
active: action.state === ActionState.ACTION_STATE_ACTIVE,
inactive: action.state === ActionState.ACTION_STATE_INACTIVE
}"
>
{{ 'FLOWS.STATES.' + action.state | translate }}</span
>
</td>
</ng-container>
<ng-container matColumnDef="timeout">
<th mat-header-cell *matHeaderCellDef> {{ 'FLOWS.TIMEOUT' | translate }} </th>
<th mat-header-cell *matHeaderCellDef>{{ 'FLOWS.TIMEOUT' | translate }}</th>
<td mat-cell *matCellDef="let key" class="pointer">
{{key.timeout | durationToSeconds}}
{{ key.timeout | durationToSeconds }}
</td>
</ng-container>
<ng-container matColumnDef="allowedToFail">
<th mat-header-cell *matHeaderCellDef> {{ 'FLOWS.ALLOWEDTOFAIL' | translate }} </th>
<th mat-header-cell *matHeaderCellDef>{{ 'FLOWS.ALLOWEDTOFAIL' | translate }}</th>
<td mat-cell *matCellDef="let action" class="pointer">
{{action.allowedToFail}}
{{ action.allowedToFail }}
</td>
</ng-container>
@ -73,8 +92,14 @@
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let action" class="pointer">
<cnsl-table-actions>
<button [disabled]="(['action.write'] | hasRole | async) === false" actions
matTooltip="{{'ACTIONS.REMOVE' | translate}}" color="warn" (click)="deleteAction(action)" mat-icon-button>
<button
[disabled]="(['action.write'] | hasRole | async) === false"
actions
matTooltip="{{ 'ACTIONS.REMOVE' | translate }}"
color="warn"
(click)="$event.stopPropagation(); deleteAction(action)"
mat-icon-button
>
<i class="las la-trash"></i>
</button>
</cnsl-table-actions>
@ -82,12 +107,17 @@
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr class="highlight" mat-row *matRowDef="let action; columns: displayedColumns;" (click)="openDialog(action)">
</tr>
<tr class="highlight" mat-row *matRowDef="let action; columns: displayedColumns" (click)="openDialog(action)"></tr>
</table>
</div>
<cnsl-paginator #paginator class="paginator" [timestamp]="actionsResult?.details?.viewTimestamp"
[length]="actionsResult?.details?.totalResult || 0" [pageSize]="20" [pageSizeOptions]="[10, 20, 50, 100]"
(page)="changePage($event)"></cnsl-paginator>
</cnsl-refresh-table>
<cnsl-paginator
#paginator
class="paginator"
[timestamp]="actionsResult?.details?.viewTimestamp"
[length]="actionsResult?.details?.totalResult || 0"
[pageSize]="20"
[pageSizeOptions]="[10, 20, 50, 100]"
(page)="changePage($event)"
></cnsl-paginator>
</cnsl-refresh-table>

4
console/src/app/pages/signedout/signedout.component.html
View File

@ -1,9 +1,9 @@
<div class="signed-out-wrap">
<div class="block">
<div class="signed-out-header">
<img alt="zitadel logo" *ngIf="dark; else lighttheme" src="../../../assets/images/zitadel-logo-light.svg" />
<img alt="zitadel logo" *ngIf="dark; else lighttheme" src="./assets/images/zitadel-logo-light.svg" />
<ng-template #lighttheme>
<img alt="zitadel logo" src="../../../assets/images/zitadel-logo-dark.svg" />
<img alt="zitadel logo" src="./assets/images/zitadel-logo-dark.svg" />
</ng-template>
<p class="cnsl-secondary-text">{{ 'USER.SIGNEDOUT' | translate }}</p>