bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-19 09:43:23 +00:00
Code Issues Releases Wiki Activity

[PM-2049] Update entity events dialog (#5417)

Browse Source 
* [AC-1145] Update entity-events.component.ts to a CL dialog

- Add EntityEventsDialogParams
- Add static helper method to open the dialog with the dialog service
- Update existing usages of the entity-events.component.ts

* [AC-1145] Update entity-events.component.ts to use CL components and form actions

- Use bit-table and TableDataSource
- Update to reactive form for date filter
- Make dialog component standalone
- Use bitAction in-place of component promises
- Remove redundant try/catch that is now handled by bitAction and bitSubmit
- Add new try/catch on first load to catch any errors during initial dialog open

* [PM-2049] Make dataSource and filterFormGroup protected

* [PM-2049] Remove bit-form-field container

Remove the bit-form-field tags that wrapped the date inputs to avoid additional styling that is not applicable to inline form elements.

Add back the missing `-` that was removed by mistake.

* [PM-2049] Remove entity events dialog component selector
This commit is contained in:
Shane Melton
2023-06-14 13:09:56 -07:00
committed by GitHub
parent a7f9984ddd
commit ed04907300
9 changed files with 217 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files

191
apps/web/src/app/admin-console/organizations/manage/entity-events.component.ts
View File

@@ -1,78 +1,114 @@
import { Component, Input, OnInit } from "@angular/core";
import { DIALOG_DATA, DialogConfig } from "@angular/cdk/dialog";
import { Component, Inject, OnInit } from "@angular/core";
import { FormBuilder } from "@angular/forms";
import { UserNamePipe } from "@bitwarden/angular/pipes/user-name.pipe";
import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
import { ApiService } from "@bitwarden/common/abstractions/api.service";
import { OrganizationUserService } from "@bitwarden/common/abstractions/organization-user/organization-user.service";
import { EventResponse } from "@bitwarden/common/models/response/event.response";
import { ListResponse } from "@bitwarden/common/models/response/list.response";
import { EventView } from "@bitwarden/common/models/view/event.view";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
import { ValidationService } from "@bitwarden/common/platform/abstractions/validation.service";
import { TableDataSource } from "@bitwarden/components";
import { EventService } from "../../../core";
import { SharedModule } from "../../../shared";
export interface EntityEventsDialogParams {
entity: "user" | "cipher";
entityId: string;
organizationId?: string;
providerId?: string;
showUser?: boolean;
name?: string;
}
@Component({
selector: "app-entity-events",
imports: [SharedModule],
templateUrl: "entity-events.component.html",
standalone: true,
})
export class EntityEventsComponent implements OnInit {
@Input() name: string;
@Input() entity: "user" | "cipher";
@Input() entityId: string;
@Input() organizationId: string;
@Input() providerId: string;
@Input() showUser = false;
loading = true;
loaded = false;
events: any[];
start: string;
end: string;
continuationToken: string;
refreshPromise: Promise<any>;
morePromise: Promise<any>;
protected dataSource = new TableDataSource<EventView>();
protected filterFormGroup = this.formBuilder.group({
start: [""],
end: [""],
});
private orgUsersUserIdMap = new Map<string, any>();
private orgUsersIdMap = new Map<string, any>();
get name() {
return this.params.name;
}
get showUser() {
return this.params.showUser ?? false;
}
constructor(
@Inject(DIALOG_DATA) private params: EntityEventsDialogParams,
private apiService: ApiService,
private i18nService: I18nService,
private eventService: EventService,
private platformUtilsService: PlatformUtilsService,
private userNamePipe: UserNamePipe,
private logService: LogService,
private organizationUserService: OrganizationUserService
private organizationUserService: OrganizationUserService,
private formBuilder: FormBuilder,
private validationService: ValidationService
) {}
async ngOnInit() {
const defaultDates = this.eventService.getDefaultDateFilters();
this.start = defaultDates[0];
this.end = defaultDates[1];
this.filterFormGroup.setValue({
start: defaultDates[0],
end: defaultDates[1],
});
await this.load();
}
async load() {
if (this.showUser) {
const response = await this.organizationUserService.getAllUsers(this.organizationId);
response.data.forEach((u) => {
const name = this.userNamePipe.transform(u);
this.orgUsersIdMap.set(u.id, { name: name, email: u.email });
this.orgUsersUserIdMap.set(u.userId, { name: name, email: u.email });
});
try {
if (this.showUser) {
const response = await this.organizationUserService.getAllUsers(this.params.organizationId);
response.data.forEach((u) => {
const name = this.userNamePipe.transform(u);
this.orgUsersIdMap.set(u.id, { name: name, email: u.email });
this.orgUsersUserIdMap.set(u.userId, { name: name, email: u.email });
});
}
await this.loadEvents(true);
} catch (e) {
this.logService.error(e);
this.validationService.showError(e);
}
await this.loadEvents(true);
this.loaded = true;
this.loading = false;
}
async loadEvents(clearExisting: boolean) {
if (this.refreshPromise != null || this.morePromise != null) {
return;
}
loadMoreEvents = async () => {
await this.loadEvents(false);
};
refreshEvents = async () => {
await this.loadEvents(true);
};
private async loadEvents(clearExisting: boolean) {
let dates: string[] = null;
try {
dates = this.eventService.formatDateFilters(this.start, this.end);
dates = this.eventService.formatDateFilters(
this.filterFormGroup.value.start,
this.filterFormGroup.value.end
);
} catch (e) {
this.platformUtilsService.showToast(
"error",
@@ -82,46 +118,34 @@ export class EntityEventsComponent implements OnInit {
return;
}
this.loading = true;
let response: ListResponse<EventResponse>;
try {
let promise: Promise<any>;
if (this.entity === "user" && this.providerId) {
promise = this.apiService.getEventsProviderUser(
this.providerId,
this.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
} else if (this.entity === "user") {
promise = this.apiService.getEventsOrganizationUser(
this.organizationId,
this.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
} else {
promise = this.apiService.getEventsCipher(
this.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
}
if (clearExisting) {
this.refreshPromise = promise;
} else {
this.morePromise = promise;
}
response = await promise;
} catch (e) {
this.logService.error(e);
if (this.params.entity === "user" && this.params.providerId) {
response = await this.apiService.getEventsProviderUser(
this.params.providerId,
this.params.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
} else if (this.params.entity === "user") {
response = await this.apiService.getEventsOrganizationUser(
this.params.organizationId,
this.params.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
} else {
response = await this.apiService.getEventsCipher(
this.params.entityId,
dates[0],
dates[1],
clearExisting ? null : this.continuationToken
);
}
this.continuationToken = response.continuationToken;
const events = await Promise.all(
const events: EventView[] = await Promise.all(
response.data.map(async (r) => {
const userId = r.actingUserId == null ? r.userId : r.actingUserId;
const eventInfo = await this.eventService.getEventInfo(r);
@@ -129,8 +153,10 @@ export class EntityEventsComponent implements OnInit {
this.showUser && userId != null && this.orgUsersUserIdMap.has(userId)
? this.orgUsersUserIdMap.get(userId)
: null;
return {
return new EventView({
message: eventInfo.message,
humanReadableMessage: eventInfo.humanReadableMessage,
appIcon: eventInfo.appIcon,
appName: eventInfo.appName,
userId: userId,
@@ -139,18 +165,29 @@ export class EntityEventsComponent implements OnInit {
date: r.date,
ip: r.ipAddress,
type: r.type,
};
installationId: r.installationId,
systemUser: r.systemUser,
serviceAccountId: r.serviceAccountId,
});
})
);
if (!clearExisting && this.events != null && this.events.length > 0) {
this.events = this.events.concat(events);
if (!clearExisting && this.dataSource.data != null && this.dataSource.data.length > 0) {
this.dataSource.data = this.dataSource.data.concat(events);
} else {
this.events = events;
this.dataSource.data = events;
}
this.loading = false;
this.morePromise = null;
this.refreshPromise = null;
}
}
/**
* Strongly typed helper to open a EntityEventsComponent as a dialog
* @param dialogService Instance of the dialog service that will be used to open the dialog
* @param config Configuration for the dialog
*/
export const openEntityEventsDialog = (
dialogService: DialogServiceAbstraction,
config: DialogConfig<EntityEventsDialogParams>
) => {
return dialogService.open<void, EntityEventsDialogParams>(EntityEventsComponent, config);
};