mirror of
https://github.com/andwati/zitadel.git
synced 2026-10-31 19:42:15 +00:00
fix(console): user create loading state and i18n, improved app create stepper, invalid token dialog, cleanup, new home (#509)
* fix iam member model * fix org member model * fix auth user loading * copytoclipboard directive * directive logs, load bar on init, create user * typo * welcome section, contributor spinner * fix home link * fix stepper flow * show dialog on invalid token * fix app table refresh, pin icons light theme * cleanup contributor * Update console/src/assets/i18n/en.json Co-authored-by: Florian Forster <[email protected]> * Update console/src/assets/i18n/de.json Co-authored-by: Florian Forster <[email protected]> * Update console/src/assets/i18n/de.json Co-authored-by: Florian Forster <[email protected]> * Update console/src/assets/i18n/de.json Co-authored-by: Florian Forster <[email protected]> Co-authored-by: Florian Forster <[email protected]>
This commit is contained in:
Max Peintner
co-authored by
Florian Forster
Florian Forster
parent
c105bf483b
commit
af60b88997
@@ -7,7 +7,7 @@
|
||||
<span class="u-email">{{profile?.preferredLoginName}}</span>
|
||||
<span class="iamuser" *ngIf="iamuser">IAM USER</span>
|
||||
|
||||
<button (click)="editUserProfile()" mat-stroked-button>{{'USER.EDITACCOUNT' | translate}}</button>
|
||||
<button color="primary" (click)="editUserProfile()" mat-stroked-button>{{'USER.EDITACCOUNT' | translate}}</button>
|
||||
<div class="l-accounts">
|
||||
<mat-progress-bar *ngIf="loadingUsers" color="primary" mode="indeterminate"></mat-progress-bar>
|
||||
<a class="row" *ngFor="let user of users" (click)="selectAccount(user.loginName)">
|
||||
@@ -35,5 +35,5 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<button (click)="logout()" mat-stroked-button>{{'MENU.LOGOUT' | translate}}</button>
|
||||
<button (click)="logout()" color="primary" mat-stroked-button>{{'MENU.LOGOUT' | translate}}</button>
|
||||
</div>
|
||||
@@ -1,4 +1,5 @@
|
||||
<div class="avatar-circle dontcloseonclick"
|
||||
<div class="avatar-circle dontcloseonclick" matRipple [matRippleColor]="'#ffffff20'" matRippleUnbounded="true"
|
||||
matRippleCentered="true"
|
||||
[ngStyle]="{'height': size+'px', 'width': size+'px', 'fontSize': (fontSize-1)+'px', 'background-color': color}"
|
||||
[ngClass]="{'active': active}">
|
||||
{{credentials}}
|
||||
|
||||
@@ -16,8 +16,8 @@
|
||||
outline: none;
|
||||
color: white;
|
||||
|
||||
&.active:hover {
|
||||
border: 2px solid #8795a1;
|
||||
}
|
||||
// &.active:hover {
|
||||
// border: 2px solid #8795a1;
|
||||
// }
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { MatRippleModule } from '@angular/material/core';
|
||||
|
||||
import { AvatarComponent } from './avatar.component';
|
||||
|
||||
@@ -9,6 +10,7 @@ import { AvatarComponent } from './avatar.component';
|
||||
declarations: [AvatarComponent],
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatRippleModule,
|
||||
],
|
||||
exports: [
|
||||
AvatarComponent,
|
||||
|
||||
@@ -3,6 +3,8 @@
|
||||
<span class="sub-header">{{ description }}</span>
|
||||
<div class="people">
|
||||
<div class="img-list">
|
||||
<mat-spinner diameter="20" *ngIf="loading"></mat-spinner>
|
||||
|
||||
<ng-container *ngIf="totalResult < 10; else compact">
|
||||
<ng-container *ngFor="let member of membersSubject | async; index as i">
|
||||
<div (click)="emitShowDetail()" class="avatar-circle"
|
||||
|
||||
@@ -28,10 +28,13 @@
|
||||
margin-left: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: all .15s ease-in-out;
|
||||
|
||||
mat-spinner {
|
||||
margin-left: -15px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.avatar-circle {
|
||||
transition: all .3s ease-in-out;
|
||||
float: left;
|
||||
margin: 0 8px 0 -15px;
|
||||
height: 32px;
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { animate, animateChild, query, stagger, style, transition, trigger } from '@angular/animations';
|
||||
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
||||
import { BehaviorSubject } from 'rxjs';
|
||||
|
||||
@@ -5,12 +6,28 @@ import { BehaviorSubject } from 'rxjs';
|
||||
selector: 'app-contributors',
|
||||
templateUrl: './contributors.component.html',
|
||||
styleUrls: ['./contributors.component.scss'],
|
||||
animations: [
|
||||
trigger('list', [
|
||||
transition(':enter', [
|
||||
query('@animate',
|
||||
stagger(80, animateChild()),
|
||||
),
|
||||
]),
|
||||
]),
|
||||
trigger('animate', [
|
||||
transition(':enter', [
|
||||
style({ opacity: 0, transform: 'translateX(100%)' }),
|
||||
animate('100ms', style({ opacity: 1, transform: 'translateX(0)' })),
|
||||
]),
|
||||
]),
|
||||
],
|
||||
})
|
||||
export class ContributorsComponent {
|
||||
@Input() title: string = '';
|
||||
@Input() description: string = '';
|
||||
@Input() disabled: boolean = false;
|
||||
@Input() totalResult: number = 0;
|
||||
@Input() loading: boolean = false;
|
||||
@Input() membersSubject!: BehaviorSubject<any[]>;
|
||||
@Output() addClicked: EventEmitter<void> = new EventEmitter();
|
||||
@Output() showDetailClicked: EventEmitter<void> = new EventEmitter();
|
||||
|
||||
@@ -2,6 +2,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
||||
import { MatTooltipModule } from '@angular/material/tooltip';
|
||||
|
||||
import { AvatarModule } from '../avatar/avatar.module';
|
||||
@@ -17,6 +18,7 @@ import { ContributorsComponent } from './contributors.component';
|
||||
MatIconModule,
|
||||
MatTooltipModule,
|
||||
MatButtonModule,
|
||||
MatProgressSpinnerModule,
|
||||
],
|
||||
exports: [
|
||||
ContributorsComponent,
|
||||
|
||||
@@ -3,10 +3,10 @@
|
||||
<p class="desc"> {{data.descriptionKey | translate}}</p>
|
||||
</div>
|
||||
<div mat-dialog-actions class="action">
|
||||
<button mat-button (click)="closeDialog()">
|
||||
<button *ngIf="data.cancelKey" mat-button (click)="closeDialog()">
|
||||
{{data.cancelKey | translate}}
|
||||
</button>
|
||||
|
||||
<span class="fill-space"></span>
|
||||
<button color="warn" mat-raised-button class="ok-button" (click)="closeDialogWithSuccess()">
|
||||
{{data.confirmKey | translate}}
|
||||
</button>
|
||||
|
||||
@@ -10,12 +10,15 @@
|
||||
|
||||
.action {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.ok-button {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.fill-space {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
button {
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user