For modals, response error messages is shown in the footer. For modals, Accept button is always on the right.

This commit is contained in:
Tom
2025-03-20 13:14:09 +00:00
parent 1acda7978e
commit c8bfeed396
16 changed files with 120 additions and 41 deletions

View File

@ -121,5 +121,11 @@
disabled="{{!formsDirty || !formsValidity || waitForResponse}}"
(click)="save()">Save</button>
</mat-card-actions>
@if (responseError) {
<mat-card-footer>
<small class="error below">{{responseError}}</small>
</mat-card-footer>
}
</mat-card>
</body>

View File

@ -14,6 +14,14 @@
color: #ba1a1a;
}
.below {
display: block;
justify-self: center;
align-items: center;
align-self: center;
text-align: center;
}
.actions {
display: flex;
flex-direction: row;

View File

@ -203,6 +203,7 @@ export class ActionItemEditComponent implements OnInit {
isNew: boolean = true;
previousName: string = this.action.name;
responseError: string | undefined;
waitForResponse: boolean = false;
readonly formGroup = new FormGroup({
@ -239,16 +240,17 @@ export class ActionItemEditComponent implements OnInit {
return;
this.waitForResponse = true;
this.responseError = undefined;
this.client.first((d: any) => d.op == 4 && d.d.request.type == 'delete_redeemable_action' && d.d.request.data.name == this.action.name)
.subscribe({
next: (d) => {
if (d.d.error) {
// TODO: update & show response error message.
this.responseError = d.d.error;
} else {
this.dialogRef.close();
}
},
error: () => this.waitForResponse = false,
error: () => this.responseError = 'Something went wrong.',
complete: () => this.waitForResponse = false,
});
this.client.deleteRedeemableAction(action.name);
@ -260,6 +262,7 @@ export class ActionItemEditComponent implements OnInit {
}
this.waitForResponse = true;
this.responseError = undefined;
const fields = this.actionEntries[this.action.type];
if (fields.some(f => f.control.invalid)) {
@ -285,12 +288,12 @@ export class ActionItemEditComponent implements OnInit {
.subscribe({
next: (d) => {
if (d.d.error) {
// TODO: update & show response error message.
this.responseError = d.d.error;
} else {
this.dialogRef.close(this.action);
}
},
error: () => this.waitForResponse = false,
error: () => this.responseError = 'Something went wrong.',
complete: () => this.waitForResponse = false,
});
if (isNewAction)