mirror of
https://github.com/andwati/zitadel.git
synced 2026-11-02 12:22:15 +00:00
fix(console): ui issues (#1670)
* mark required fields * membership overflow, deactivate btn * app create show info * remove padding * lint scss * fix count of results * rm log
This commit is contained in:
@@ -7,8 +7,8 @@ import { Member } from 'src/app/proto/generated/zitadel/member_pb';
|
||||
import { ManagementService } from 'src/app/services/mgmt.service';
|
||||
|
||||
export enum ProjectType {
|
||||
PROJECTTYPE_OWNED = 'OWNED',
|
||||
PROJECTTYPE_GRANTED = 'GRANTED',
|
||||
PROJECTTYPE_OWNED = 'OWNED',
|
||||
PROJECTTYPE_GRANTED = 'GRANTED',
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -17,68 +17,70 @@ export enum ProjectType {
|
||||
* (including sorting, pagination, and filtering).
|
||||
*/
|
||||
export class ProjectMembersDataSource extends DataSource<Member.AsObject> {
|
||||
public totalResult: number = 0;
|
||||
public viewTimestamp!: Timestamp.AsObject;
|
||||
public totalResult: number = 0;
|
||||
public viewTimestamp!: Timestamp.AsObject;
|
||||
|
||||
public membersSubject: BehaviorSubject<Member.AsObject[]> = new BehaviorSubject<Member.AsObject[]>([]);
|
||||
private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
|
||||
public loading$: Observable<boolean> = this.loadingSubject.asObservable();
|
||||
public membersSubject: BehaviorSubject<Member.AsObject[]> = new BehaviorSubject<Member.AsObject[]>([]);
|
||||
private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
|
||||
public loading$: Observable<boolean> = this.loadingSubject.asObservable();
|
||||
|
||||
constructor(private mgmtService: ManagementService) {
|
||||
super();
|
||||
}
|
||||
constructor(private mgmtService: ManagementService) {
|
||||
super();
|
||||
}
|
||||
|
||||
public loadMembers(projectId: string,
|
||||
projectType: ProjectType,
|
||||
pageIndex: number, pageSize: number, grantId?: string): void {
|
||||
const offset = pageIndex * pageSize;
|
||||
public loadMembers(projectId: string,
|
||||
projectType: ProjectType,
|
||||
pageIndex: number, pageSize: number, grantId?: string): void {
|
||||
const offset = pageIndex * pageSize;
|
||||
|
||||
this.loadingSubject.next(true);
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
const promise:
|
||||
Promise<ListProjectMembersResponse.AsObject> |
|
||||
Promise<ListProjectGrantMembersResponse.AsObject>
|
||||
| undefined =
|
||||
projectType === ProjectType.PROJECTTYPE_OWNED ?
|
||||
this.mgmtService.listProjectMembers(projectId, pageSize, offset) :
|
||||
projectType === ProjectType.PROJECTTYPE_GRANTED && grantId ?
|
||||
this.mgmtService.listProjectGrantMembers(projectId,
|
||||
grantId, pageSize, offset) : undefined;
|
||||
if (promise) {
|
||||
from(promise).pipe(
|
||||
map(resp => {
|
||||
if (resp.details?.totalResult) {
|
||||
this.totalResult = resp.details?.totalResult;
|
||||
}
|
||||
if (resp.details?.viewTimestamp) {
|
||||
this.viewTimestamp = resp.details.viewTimestamp;
|
||||
}
|
||||
return resp.resultList;
|
||||
}),
|
||||
catchError(() => of([])),
|
||||
finalize(() => this.loadingSubject.next(false)),
|
||||
).subscribe(members => {
|
||||
this.membersSubject.next(members);
|
||||
});
|
||||
}
|
||||
const promise:
|
||||
Promise<ListProjectMembersResponse.AsObject> |
|
||||
Promise<ListProjectGrantMembersResponse.AsObject>
|
||||
| undefined =
|
||||
projectType === ProjectType.PROJECTTYPE_OWNED ?
|
||||
this.mgmtService.listProjectMembers(projectId, pageSize, offset) :
|
||||
projectType === ProjectType.PROJECTTYPE_GRANTED && grantId ?
|
||||
this.mgmtService.listProjectGrantMembers(projectId,
|
||||
grantId, pageSize, offset) : undefined;
|
||||
if (promise) {
|
||||
from(promise).pipe(
|
||||
map(resp => {
|
||||
if (resp.details?.totalResult) {
|
||||
this.totalResult = resp.details?.totalResult;
|
||||
} else {
|
||||
this.totalResult = 0;
|
||||
}
|
||||
if (resp.details?.viewTimestamp) {
|
||||
this.viewTimestamp = resp.details.viewTimestamp;
|
||||
}
|
||||
return resp.resultList;
|
||||
}),
|
||||
catchError(() => of([])),
|
||||
finalize(() => this.loadingSubject.next(false)),
|
||||
).subscribe(members => {
|
||||
this.membersSubject.next(members);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Connect this data source to the table. The table will only update when
|
||||
* the returned stream emits new items.
|
||||
* @returns A stream of the items to be rendered.
|
||||
*/
|
||||
public connect(): Observable<Member.AsObject[]> {
|
||||
return this.membersSubject.asObservable();
|
||||
}
|
||||
/**
|
||||
* Connect this data source to the table. The table will only update when
|
||||
* the returned stream emits new items.
|
||||
* @returns A stream of the items to be rendered.
|
||||
*/
|
||||
public connect(): Observable<Member.AsObject[]> {
|
||||
return this.membersSubject.asObservable();
|
||||
}
|
||||
|
||||
/**
|
||||
* Called when the table is being destroyed. Use this function, to clean up
|
||||
* any open connections or free any held resources that were set up during connect.
|
||||
*/
|
||||
public disconnect(): void {
|
||||
this.membersSubject.complete();
|
||||
this.loadingSubject.complete();
|
||||
}
|
||||
/**
|
||||
* Called when the table is being destroyed. Use this function, to clean up
|
||||
* any open connections or free any held resources that were set up during connect.
|
||||
*/
|
||||
public disconnect(): void {
|
||||
this.membersSubject.complete();
|
||||
this.loadingSubject.complete();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,150 +4,152 @@ import { BehaviorSubject, from, Observable, of } from 'rxjs';
|
||||
import { catchError, finalize, map } from 'rxjs/operators';
|
||||
import { ListUserGrantResponse } from 'src/app/proto/generated/zitadel/management_pb';
|
||||
import {
|
||||
UserGrant,
|
||||
UserGrantProjectGrantIDQuery,
|
||||
UserGrantProjectIDQuery,
|
||||
UserGrantQuery,
|
||||
UserGrantUserIDQuery,
|
||||
UserGrant,
|
||||
UserGrantProjectGrantIDQuery,
|
||||
UserGrantProjectIDQuery,
|
||||
UserGrantQuery,
|
||||
UserGrantUserIDQuery,
|
||||
} from 'src/app/proto/generated/zitadel/user_pb';
|
||||
import { ManagementService } from 'src/app/services/mgmt.service';
|
||||
|
||||
export enum UserGrantContext {
|
||||
NONE = 'none',
|
||||
USER = 'user',
|
||||
OWNED_PROJECT = 'owned',
|
||||
GRANTED_PROJECT = 'granted',
|
||||
NONE = 'none',
|
||||
USER = 'user',
|
||||
OWNED_PROJECT = 'owned',
|
||||
GRANTED_PROJECT = 'granted',
|
||||
}
|
||||
|
||||
export class UserGrantsDataSource extends DataSource<UserGrant.AsObject> {
|
||||
public totalResult: number = 0;
|
||||
public viewTimestamp!: Timestamp.AsObject;
|
||||
public totalResult: number = 0;
|
||||
public viewTimestamp!: Timestamp.AsObject;
|
||||
|
||||
public grantsSubject: BehaviorSubject<UserGrant.AsObject[]> = new BehaviorSubject<UserGrant.AsObject[]>([]);
|
||||
private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
|
||||
public loading$: Observable<boolean> = this.loadingSubject.asObservable();
|
||||
public grantsSubject: BehaviorSubject<UserGrant.AsObject[]> = new BehaviorSubject<UserGrant.AsObject[]>([]);
|
||||
private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
|
||||
public loading$: Observable<boolean> = this.loadingSubject.asObservable();
|
||||
|
||||
constructor(private userService: ManagementService) {
|
||||
super();
|
||||
}
|
||||
constructor(private userService: ManagementService) {
|
||||
super();
|
||||
}
|
||||
|
||||
public loadGrants(
|
||||
context: UserGrantContext,
|
||||
pageIndex: number,
|
||||
pageSize: number,
|
||||
data: {
|
||||
projectId?: string;
|
||||
grantId?: string;
|
||||
userId?: string;
|
||||
},
|
||||
queries?: UserGrantQuery[],
|
||||
): void {
|
||||
switch (context) {
|
||||
case UserGrantContext.USER:
|
||||
if (data && data.userId) {
|
||||
this.loadingSubject.next(true);
|
||||
public loadGrants(
|
||||
context: UserGrantContext,
|
||||
pageIndex: number,
|
||||
pageSize: number,
|
||||
data: {
|
||||
projectId?: string;
|
||||
grantId?: string;
|
||||
userId?: string;
|
||||
},
|
||||
queries?: UserGrantQuery[],
|
||||
): void {
|
||||
switch (context) {
|
||||
case UserGrantContext.USER:
|
||||
if (data && data.userId) {
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
const userfilter = new UserGrantQuery();
|
||||
const ugUiq = new UserGrantUserIDQuery();
|
||||
ugUiq.setUserId(data.userId);
|
||||
userfilter.setUserIdQuery(ugUiq);
|
||||
const userfilter = new UserGrantQuery();
|
||||
const ugUiq = new UserGrantUserIDQuery();
|
||||
ugUiq.setUserId(data.userId);
|
||||
userfilter.setUserIdQuery(ugUiq);
|
||||
|
||||
if (queries) {
|
||||
queries.push(userfilter);
|
||||
} else {
|
||||
queries = [userfilter];
|
||||
}
|
||||
if (queries) {
|
||||
queries.push(userfilter);
|
||||
} else {
|
||||
queries = [userfilter];
|
||||
}
|
||||
|
||||
const promise = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise);
|
||||
}
|
||||
break;
|
||||
case UserGrantContext.OWNED_PROJECT:
|
||||
if (data && data.projectId) {
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
const projectfilter = new UserGrantQuery();
|
||||
const ugPfq = new UserGrantProjectIDQuery();
|
||||
ugPfq.setProjectId(data.projectId);
|
||||
projectfilter.setProjectIdQuery(ugPfq);
|
||||
|
||||
if (queries) {
|
||||
queries.push(projectfilter);
|
||||
} else {
|
||||
queries = [projectfilter];
|
||||
}
|
||||
|
||||
const promise1 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise1);
|
||||
}
|
||||
break;
|
||||
case UserGrantContext.GRANTED_PROJECT:
|
||||
if (data && data.grantId && data.projectId) {
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
const grantfilter = new UserGrantQuery();
|
||||
|
||||
const uggiq = new UserGrantProjectGrantIDQuery();
|
||||
uggiq.setProjectGrantId(data.grantId);
|
||||
grantfilter.setProjectGrantIdQuery(uggiq);
|
||||
|
||||
const projectfilter = new UserGrantQuery();
|
||||
const ugPfq = new UserGrantProjectIDQuery();
|
||||
ugPfq.setProjectId(data.projectId);
|
||||
projectfilter.setProjectIdQuery(ugPfq);
|
||||
|
||||
if (queries) {
|
||||
queries.push(grantfilter);
|
||||
} else {
|
||||
queries = [grantfilter];
|
||||
}
|
||||
|
||||
const promise2 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise2);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
this.loadingSubject.next(true);
|
||||
const promise3 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries ?? []);
|
||||
this.loadResponse(promise3);
|
||||
break;
|
||||
const promise = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise);
|
||||
}
|
||||
}
|
||||
break;
|
||||
case UserGrantContext.OWNED_PROJECT:
|
||||
if (data && data.projectId) {
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
private loadResponse(promise: Promise<ListUserGrantResponse.AsObject>): void {
|
||||
from(promise).pipe(
|
||||
map(resp => {
|
||||
if (resp.details?.totalResult) {
|
||||
this.totalResult = resp.details.totalResult;
|
||||
}
|
||||
if (resp.details?.viewTimestamp) {
|
||||
this.viewTimestamp = resp.details.viewTimestamp;
|
||||
}
|
||||
return resp.resultList;
|
||||
}),
|
||||
catchError(() => of([])),
|
||||
finalize(() => this.loadingSubject.next(false)),
|
||||
).subscribe(grants => {
|
||||
this.grantsSubject.next(grants);
|
||||
});
|
||||
const projectfilter = new UserGrantQuery();
|
||||
const ugPfq = new UserGrantProjectIDQuery();
|
||||
ugPfq.setProjectId(data.projectId);
|
||||
projectfilter.setProjectIdQuery(ugPfq);
|
||||
|
||||
if (queries) {
|
||||
queries.push(projectfilter);
|
||||
} else {
|
||||
queries = [projectfilter];
|
||||
}
|
||||
|
||||
const promise1 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise1);
|
||||
}
|
||||
break;
|
||||
case UserGrantContext.GRANTED_PROJECT:
|
||||
if (data && data.grantId && data.projectId) {
|
||||
this.loadingSubject.next(true);
|
||||
|
||||
const grantfilter = new UserGrantQuery();
|
||||
|
||||
const uggiq = new UserGrantProjectGrantIDQuery();
|
||||
uggiq.setProjectGrantId(data.grantId);
|
||||
grantfilter.setProjectGrantIdQuery(uggiq);
|
||||
|
||||
const projectfilter = new UserGrantQuery();
|
||||
const ugPfq = new UserGrantProjectIDQuery();
|
||||
ugPfq.setProjectId(data.projectId);
|
||||
projectfilter.setProjectIdQuery(ugPfq);
|
||||
|
||||
if (queries) {
|
||||
queries.push(grantfilter);
|
||||
} else {
|
||||
queries = [grantfilter];
|
||||
}
|
||||
|
||||
const promise2 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries);
|
||||
this.loadResponse(promise2);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
this.loadingSubject.next(true);
|
||||
const promise3 = this.userService.listUserGrants(pageSize, pageSize * pageIndex, queries ?? []);
|
||||
this.loadResponse(promise3);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
private loadResponse(promise: Promise<ListUserGrantResponse.AsObject>): void {
|
||||
from(promise).pipe(
|
||||
map(resp => {
|
||||
if (resp.details?.totalResult) {
|
||||
this.totalResult = resp.details.totalResult;
|
||||
} else {
|
||||
this.totalResult = 0;
|
||||
}
|
||||
if (resp.details?.viewTimestamp) {
|
||||
this.viewTimestamp = resp.details.viewTimestamp;
|
||||
}
|
||||
return resp.resultList;
|
||||
}),
|
||||
catchError(() => of([])),
|
||||
finalize(() => this.loadingSubject.next(false)),
|
||||
).subscribe(grants => {
|
||||
this.grantsSubject.next(grants);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Connect this data source to the table. The table will only update when
|
||||
* the returned stream emits new items.
|
||||
* @returns A stream of the items to be rendered.
|
||||
*/
|
||||
public connect(): Observable<UserGrant.AsObject[]> {
|
||||
return this.grantsSubject.asObservable();
|
||||
}
|
||||
/**
|
||||
* Connect this data source to the table. The table will only update when
|
||||
* the returned stream emits new items.
|
||||
* @returns A stream of the items to be rendered.
|
||||
*/
|
||||
public connect(): Observable<UserGrant.AsObject[]> {
|
||||
return this.grantsSubject.asObservable();
|
||||
}
|
||||
|
||||
/**
|
||||
* Called when the table is being destroyed. Use this function, to clean up
|
||||
* any open connections or free any held resources that were set up during connect.
|
||||
*/
|
||||
public disconnect(): void {
|
||||
this.grantsSubject.complete();
|
||||
this.loadingSubject.complete();
|
||||
}
|
||||
/**
|
||||
* Called when the table is being destroyed. Use this function, to clean up
|
||||
* any open connections or free any held resources that were set up during connect.
|
||||
*/
|
||||
public disconnect(): void {
|
||||
this.grantsSubject.complete();
|
||||
this.loadingSubject.complete();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user