vaultwarden
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

[SM-470] fix SM edit secret spinner (#4958)

This commit is contained in:
Will Martin 2023-03-09 13:43:47 -05:00 committed by GitHub
parent 5caabd7157
commit 2b4a8705da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 40 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
bitwarden_license/bit-web/src/app/secrets-manager/secrets/dialog/secret-dialog.component.html
View File

@ -1,11 +1,13 @@
<form [formGroup]="formGroup" [bitSubmit]="submit"> <form [formGroup]="formGroup" [bitSubmit]="submit">
<bit-dialog dialogSize="default"> <bit-dialog dialogSize="default">
<ng-container bitDialogTitle>{{ title | i18n }}</ng-container> <ng-container bitDialogTitle>{{ title | i18n }}</ng-container>
<div bitDialogContent> <div bitDialogContent class="tw-relative">
<div *ngIf="loading" class="tw-text-center"> <div
*ngIf="showSpinner"
class="tw-absolute tw-flex tw-h-full tw-w-full tw-items-center tw-justify-center tw-bg-background-alt"
>
<i class="bwi bwi-spinner bwi-spin bwi-3x"></i> <i class="bwi bwi-spinner bwi-spin bwi-3x"></i>
</div> </div>
<ng-container *ngIf="!loading">
<div class="tw-flex tw-gap-4 tw-pt-4"> <div class="tw-flex tw-gap-4 tw-pt-4">
<bit-form-field class="tw-w-1/3"> <bit-form-field class="tw-w-1/3">
<bit-label for="secret-name">{{ "name" | i18n }}</bit-label> <bit-label for="secret-name">{{ "name" | i18n }}</bit-label>
@ -32,7 +34,6 @@
</option> </option>
</select> </select>
</bit-form-field> </bit-form-field>
</ng-container>
</div> </div>
<div bitDialogFooter class="tw-flex tw-gap-2"> <div bitDialogFooter class="tw-flex tw-gap-2">
<button type="submit" bitButton buttonType="primary" bitFormButton> <button type="submit" bitButton buttonType="primary" bitFormButton>

17
bitwarden_license/bit-web/src/app/secrets-manager/secrets/dialog/secret-dialog.component.ts
View File

@ -40,7 +40,7 @@ export class SecretDialogComponent implements OnInit {
project: new FormControl("", [Validators.required]), project: new FormControl("", [Validators.required]),
}); });
protected loading = false; private loading = true;
projects: ProjectListView[]; projects: ProjectListView[];
private destroy$ = new Subject<void>(); private destroy$ = new Subject<void>();
@ -55,10 +55,6 @@ export class SecretDialogComponent implements OnInit {
) {} ) {}
async ngOnInit() { async ngOnInit() {
this.projects = await this.projectService
.getProjects(this.data.organizationId)
.then((projects) => projects.sort((a, b) => a.name.localeCompare(b.name)));
if (this.data.operation === OperationType.Edit && this.data.secretId) { if (this.data.operation === OperationType.Edit && this.data.secretId) {
await this.loadData(); await this.loadData();
} else if (this.data.operation !== OperationType.Add) { } else if (this.data.operation !== OperationType.Add) {
@ -69,10 +65,14 @@ export class SecretDialogComponent implements OnInit {
if (this.data.projectId) { if (this.data.projectId) {
this.formGroup.get("project").setValue(this.data.projectId); this.formGroup.get("project").setValue(this.data.projectId);
} }
this.projects = await this.projectService
.getProjects(this.data.organizationId)
.then((projects) => projects.sort((a, b) => a.name.localeCompare(b.name)));
} }
async loadData() { async loadData() {
this.loading = true; this.formGroup.disable();
const secret: SecretView = await this.secretService.getBySecretId(this.data.secretId); const secret: SecretView = await this.secretService.getBySecretId(this.data.secretId);
this.formGroup.setValue({ this.formGroup.setValue({
name: secret.name, name: secret.name,
@ -81,6 +81,7 @@ export class SecretDialogComponent implements OnInit {
project: secret.projects[0]?.id ?? "", project: secret.projects[0]?.id ?? "",
}); });
this.loading = false; this.loading = false;
this.formGroup.enable();
} }
ngOnDestroy(): void { ngOnDestroy(): void {
@ -92,6 +93,10 @@ export class SecretDialogComponent implements OnInit {
return this.data.operation === OperationType.Add ? "newSecret" : "editSecret"; return this.data.operation === OperationType.Add ? "newSecret" : "editSecret";
} }
get showSpinner() {
return this.data.operation === OperationType.Edit && this.loading;
}
submit = async () => { submit = async () => {
this.formGroup.markAllAsTouched(); this.formGroup.markAllAsTouched();