1
0
mirror of https://github.com/bitwarden/browser.git synced 2025-02-28 03:21:40 +01:00

pm-18441 add loading icon to member details (#13494)

This commit is contained in:
Vijay Oommen 2025-02-20 16:23:05 -06:00 committed by GitHub
parent 63927d6ba1
commit ef34b30cc1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 3 deletions

View File

@ -5,7 +5,13 @@
class="tw-grow"
></bit-search>
<button type="button" bitButton buttonType="primary" [bitAction]="exportReportAction">
<button
type="button"
bitButton
buttonType="primary"
[bitAction]="exportReportAction"
*ngIf="!(isLoading$ | async)"
>
<span>{{ "export" | i18n }}</span>
<i class="bwi bwi-fw bwi-sign-in" aria-hidden="true"></i>
</button>
@ -17,7 +23,18 @@
</p>
</div>
<bit-table [dataSource]="dataSource" class="tw-mt-2">
<ng-container *ngIf="isLoading$ | async">
<div class="tw-flex-col tw-flex tw-justify-center tw-items-center tw-gap-5 tw-mt-4">
<i
class="bwi bwi-2x bwi-spinner bwi-spin tw-text-primary-600"
title="{{ 'loading' | i18n }}"
aria-hidden="true"
></i>
<h2 bitTypography="h1">{{ "loading" | i18n }}</h2>
</div>
</ng-container>
<bit-table *ngIf="!(isLoading$ | async)" [dataSource]="dataSource" class="tw-mt-2">
<ng-container header>
<tr>
<th bitCell bitSortable="name" default>{{ "members" | i18n }}</th>

View File

@ -4,7 +4,7 @@ import { Component, OnInit } from "@angular/core";
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
import { FormControl } from "@angular/forms";
import { ActivatedRoute } from "@angular/router";
import { debounceTime, firstValueFrom, lastValueFrom } from "rxjs";
import { BehaviorSubject, debounceTime, firstValueFrom, lastValueFrom } from "rxjs";
import { UserNamePipe } from "@bitwarden/angular/pipes/user-name.pipe";
import { safeProvider } from "@bitwarden/angular/platform/utils/safe-provider";
@ -48,6 +48,7 @@ export class MemberAccessReportComponent implements OnInit {
protected searchControl = new FormControl("", { nonNullable: true });
protected organizationId: OrganizationId;
protected orgIsOnSecretsManagerStandalone: boolean;
protected isLoading$ = new BehaviorSubject(true);
constructor(
private route: ActivatedRoute,
@ -64,6 +65,8 @@ export class MemberAccessReportComponent implements OnInit {
}
async ngOnInit() {
this.isLoading$.next(true);
const params = await firstValueFrom(this.route.params);
this.organizationId = params.organizationId;
@ -74,6 +77,8 @@ export class MemberAccessReportComponent implements OnInit {
this.orgIsOnSecretsManagerStandalone = billingMetadata.isOnSecretsManagerStandalone;
await this.load();
this.isLoading$.next(false);
}
async load() {