mirror of
https://github.com/andwati/zitadel.git
synced 2026-11-05 13:52:15 +00:00
fix(console): hide granted project navigation if none, cache zitadel permissions, emit refresh on org change, cleanup contributors, styling (#511)
* 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 * inherit parent color, animations * use localized date pipe everywhere * cmp styles refactor, dont show granted p if none * fix navitem desc, fixed header * change permissions, caching * roles on org emit, use prom instead of hot obs * dont calc 100vh
This commit is contained in:
+4
-4
@@ -14,12 +14,12 @@
|
||||
<div class="text-part">
|
||||
<span *ngIf="item.changeDate" class="top">{{'PROJECT.PAGES.LASTMODIFIED' | translate}}
|
||||
{{
|
||||
item.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="name" *ngIf="item.projectName">{{ item.projectName }}</span>
|
||||
<span class="description" *ngIf="item.resourceOwnerName">{{item.resourceOwnerName}}</span>
|
||||
<span *ngIf="item.changeDate" class="created">{{'PROJECT.PAGES.CREATEDON' | translate}}
|
||||
{{ item.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm' }}</span>
|
||||
{{ item.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm' }}</span>
|
||||
<span class="fill-space"></span>
|
||||
<div class="icons">
|
||||
</div>
|
||||
@@ -41,12 +41,12 @@
|
||||
<div class="text-part">
|
||||
<span *ngIf="item.changeDate" class="top">{{'PROJECT.PAGES.LASTMODIFIED' | translate}}
|
||||
{{
|
||||
item.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="name" *ngIf="item.projectName">{{ item.projectName }}</span>
|
||||
<span class="description" *ngIf="item.resourceOwnerName">{{item.resourceOwnerName}}</span>
|
||||
<span *ngIf="item.changeDate" class="created">{{'PROJECT.PAGES.CREATEDON' | translate}}
|
||||
{{ item.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm' }}</span>
|
||||
{{ item.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm' }}</span>
|
||||
<span class="fill-space"></span>
|
||||
<div class="icons">
|
||||
</div>
|
||||
|
||||
+2
-2
@@ -72,7 +72,7 @@
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.TABLE.CREATIONDATE' | translate }} </th>
|
||||
<td mat-cell *matCellDef="let project">
|
||||
<span
|
||||
*ngIf="project.creationDate">{{project.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
*ngIf="project.creationDate">{{project.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
@@ -81,7 +81,7 @@
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.TABLE.CHANGEDATE' | translate }} </th>
|
||||
<td mat-cell *matCellDef="let project">
|
||||
<span
|
||||
*ngIf="project.changeDate">{{project.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
*ngIf="project.changeDate">{{project.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
|
||||
@@ -25,6 +25,7 @@ import { ProjectRolesModule } from 'src/app/modules/project-roles/project-roles.
|
||||
import { SharedModule } from 'src/app/modules/shared/shared.module';
|
||||
import { UserGrantsModule } from 'src/app/modules/user-grants/user-grants.module';
|
||||
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe.module';
|
||||
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe.module';
|
||||
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe.module';
|
||||
|
||||
import { GrantedProjectDetailComponent } from './granted-project-detail/granted-project-detail.component';
|
||||
@@ -70,6 +71,7 @@ import { GrantedProjectsComponent } from './granted-projects.component';
|
||||
TranslateModule,
|
||||
TimestampToDatePipeModule,
|
||||
SharedModule,
|
||||
LocalizedDatePipeModule,
|
||||
MemberCreateDialogModule,
|
||||
],
|
||||
})
|
||||
|
||||
+2
@@ -23,6 +23,7 @@ import { RefreshTableModule } from 'src/app/modules/refresh-table/refresh-table.
|
||||
import { UserGrantsModule } from 'src/app/modules/user-grants/user-grants.module';
|
||||
import { WarnDialogModule } from 'src/app/modules/warn-dialog/warn-dialog.module';
|
||||
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe.module';
|
||||
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe.module';
|
||||
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe.module';
|
||||
|
||||
import { ApplicationGridComponent } from './application-grid/application-grid.component';
|
||||
@@ -65,6 +66,7 @@ import { ProjectGrantsComponent } from './project-grants/project-grants.componen
|
||||
MetaLayoutModule,
|
||||
RefreshTableModule,
|
||||
MemberCreateDialogModule,
|
||||
LocalizedDatePipeModule,
|
||||
],
|
||||
})
|
||||
export class OwnedProjectDetailModule { }
|
||||
|
||||
+2
-2
@@ -43,14 +43,14 @@
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.GRANT.CREATIONDATE' | translate }} </th>
|
||||
<td [routerLink]="['/projects',grant.projectId,'grant', grant.id]" class="pointer" mat-cell
|
||||
*matCellDef="let grant">
|
||||
{{grant.creationDate | timestampToDate | date: 'dd. MMM, HH:mm' }} </td>
|
||||
{{grant.creationDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="changeDate">
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.GRANT.CHANGEDATE' | translate }} </th>
|
||||
<td [routerLink]="['/projects',grant.projectId,'grant', grant.id]" class="pointer" mat-cell
|
||||
*matCellDef="let grant">
|
||||
{{grant.changeDate | timestampToDate | date: 'dd. MMM, HH:mm' }} </td>
|
||||
{{grant.changeDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td>
|
||||
|
||||
</ng-container>
|
||||
|
||||
|
||||
+4
-4
@@ -15,13 +15,13 @@
|
||||
<div class="text-part">
|
||||
<span *ngIf="item.changeDate" class="top">{{'PROJECT.PAGES.LASTMODIFIED' | translate}}
|
||||
{{
|
||||
item.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="name" *ngIf="item.name">{{ item.name }}</span>
|
||||
|
||||
<span *ngIf="item.changeDate" class="created">{{'PROJECT.PAGES.CREATEDON' | translate}}
|
||||
{{
|
||||
item.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="fill-space"></span>
|
||||
<div class="icons">
|
||||
@@ -44,13 +44,13 @@
|
||||
<div class="text-part">
|
||||
<span *ngIf="item.changeDate" class="top">{{'PROJECT.PAGES.LASTMODIFIED' | translate}}
|
||||
{{
|
||||
item.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="name" *ngIf="item.name">{{ item.name }}</span>
|
||||
|
||||
<span *ngIf="item.changeDate" class="created">{{'PROJECT.PAGES.CREATEDON' | translate}}
|
||||
{{
|
||||
item.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'
|
||||
item.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'
|
||||
}}</span>
|
||||
<span class="fill-space"></span>
|
||||
<div class="icons">
|
||||
|
||||
+14
-10
@@ -1,4 +1,4 @@
|
||||
import { animate, animateChild, query, stagger, style, transition, trigger } from '@angular/animations';
|
||||
import { animate, animateChild, keyframes, query, stagger, style, transition, trigger } from '@angular/animations';
|
||||
import { SelectionModel } from '@angular/cdk/collections';
|
||||
import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
@@ -10,21 +10,25 @@ import { AuthService } from 'src/app/services/auth.service';
|
||||
templateUrl: './owned-project-grid.component.html',
|
||||
styleUrls: ['./owned-project-grid.component.scss'],
|
||||
animations: [
|
||||
trigger('list', [
|
||||
transition(':enter', [
|
||||
query('@animate',
|
||||
stagger(100, animateChild()),
|
||||
),
|
||||
trigger('cardAnimation', [
|
||||
transition('* => *', [
|
||||
query('@animate', stagger('100ms', animateChild()), { optional: true }),
|
||||
]),
|
||||
]),
|
||||
trigger('animate', [
|
||||
transition(':enter', [
|
||||
style({ opacity: 0, transform: 'translateY(-100%)' }),
|
||||
animate('100ms', style({ opacity: 1, transform: 'translateY(0)' })),
|
||||
animate('.2s ease-in', keyframes([
|
||||
style({ opacity: 0, transform: 'translateY(-50%)', offset: 0 }),
|
||||
style({ opacity: .5, transform: 'translateY(-10px) scale(1.1)', offset: 0.3 }),
|
||||
style({ opacity: 1, transform: 'translateY(0)', offset: 1 }),
|
||||
])),
|
||||
]),
|
||||
transition(':leave', [
|
||||
style({ opacity: 1, transform: 'translateY(0)' }),
|
||||
animate('100ms', style({ opacity: 0, transform: 'translateY(100%)' })),
|
||||
animate('.2s ease-out', keyframes([
|
||||
style({ opacity: 1, transform: 'scale(1.1)', offset: 0 }),
|
||||
style({ opacity: .5, transform: 'scale(.5)', offset: 0.3 }),
|
||||
style({ opacity: 0, transform: 'scale(0)', offset: 1 }),
|
||||
])),
|
||||
]),
|
||||
]),
|
||||
],
|
||||
|
||||
+2
-2
@@ -61,7 +61,7 @@
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.TABLE.CREATIONDATE' | translate }} </th>
|
||||
<td mat-cell *matCellDef="let project">
|
||||
<span
|
||||
*ngIf="project.creationDate">{{project.creationDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
*ngIf="project.creationDate">{{project.creationDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
@@ -70,7 +70,7 @@
|
||||
<th mat-header-cell *matHeaderCellDef> {{ 'PROJECT.TABLE.CHANGEDATE' | translate }} </th>
|
||||
<td mat-cell *matCellDef="let project">
|
||||
<span
|
||||
*ngIf="project.changeDate">{{project.changeDate | timestampToDate | date: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
*ngIf="project.changeDate">{{project.changeDate | timestampToDate | localizedDate: 'EEE dd. MMM, HH:mm'}}</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
|
||||
+1
-1
@@ -88,7 +88,7 @@ export class OwnedProjectListComponent implements OnInit, OnDestroy {
|
||||
this.projectService.SearchProjects(limit, offset).then(res => {
|
||||
this.ownedProjectList = res.toObject().resultList;
|
||||
this.totalResult = res.toObject().totalResult;
|
||||
if (this.totalResult > 5) {
|
||||
if (this.totalResult > 10) {
|
||||
this.grid = false;
|
||||
}
|
||||
this.dataSource.data = this.ownedProjectList;
|
||||
|
||||
@@ -20,6 +20,7 @@ import { CardModule } from 'src/app/modules/card/card.module';
|
||||
import { SharedModule } from 'src/app/modules/shared/shared.module';
|
||||
import { UserGrantsModule } from 'src/app/modules/user-grants/user-grants.module';
|
||||
import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe.module';
|
||||
import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe.module';
|
||||
import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe.module';
|
||||
|
||||
import { OwnedProjectGridComponent } from './owned-project-list/owned-project-grid/owned-project-grid.component';
|
||||
@@ -58,6 +59,7 @@ import { OwnedProjectsComponent } from './owned-projects.component';
|
||||
MatSortModule,
|
||||
HasRolePipeModule,
|
||||
TimestampToDatePipeModule,
|
||||
LocalizedDatePipeModule,
|
||||
SharedModule,
|
||||
],
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user