diff --git a/alfa-client/libs/ui/src/lib/ui/ozgcloud-dialog/ozgcloud-dialog.service.ts b/alfa-client/libs/ui/src/lib/ui/ozgcloud-dialog/ozgcloud-dialog.service.ts
index 6e6bc3d6944283627afe1d9044ec8111e9575742..27769a03b7ebd03c1db3a8ad50ee02d5b5ce9a69 100644
--- a/alfa-client/libs/ui/src/lib/ui/ozgcloud-dialog/ozgcloud-dialog.service.ts
+++ b/alfa-client/libs/ui/src/lib/ui/ozgcloud-dialog/ozgcloud-dialog.service.ts
@@ -10,6 +10,7 @@ export class OzgcloudDialogService {
readonly WIZARD_DIALOG_CONFIG: DialogConfig = {
width: '1000px',
restoreFocus: false,
+ disableClose: true,
};
constructor(private dialog: Dialog) {}
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.html b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.html
index 5ebc616b3fa6376d2cb5437ccf98b74c90f2888b..3868f94249128b79fe4e08b15d228fac0498165d 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.html
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.html
@@ -1,3 +1,7 @@
-<button (click)="onClick()" class="absolute right-3 top-3 text-text" data-test-id="close-bescheid">
+<button
+ (click)="clickEmitter.emit()"
+ class="absolute right-3 top-3 text-text"
+ data-test-id="close-bescheid"
+>
<mat-icon>close</mat-icon>
</button>
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.spec.ts b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.spec.ts
index 88edfcc33994a41c77e6ef8e46d7a53e6637ea0b..d143d1618f0b45bcf78d65061f489811034d219e 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.spec.ts
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.spec.ts
@@ -1,28 +1,15 @@
-import { Mock, mock } from '@alfa-client/test-utils';
-import { OzgcloudDialogService } from '@alfa-client/ui';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MatIcon } from '@angular/material/icon';
-import { VorgangDetailBescheidenAbbrechenDialogComponent } from '../vorgang-detail-bescheiden-abbrechen-dialog/vorgang-detail-bescheiden-abbrechen-dialog.component';
import { VorgangDetailBescheidenAbbrechenButtonComponent } from './vorgang-detail-bescheiden-abbrechen-button.component';
describe('VorgangDetailBescheidenAbbrechenButtonComponent', () => {
let component: VorgangDetailBescheidenAbbrechenButtonComponent;
let fixture: ComponentFixture<VorgangDetailBescheidenAbbrechenButtonComponent>;
- let ozgcloudDialogService: Mock<OzgcloudDialogService>;
-
beforeEach(async () => {
- ozgcloudDialogService = mock(OzgcloudDialogService);
-
await TestBed.configureTestingModule({
declarations: [VorgangDetailBescheidenAbbrechenButtonComponent],
imports: [MatIcon],
- providers: [
- {
- provide: OzgcloudDialogService,
- useValue: ozgcloudDialogService,
- },
- ],
}).compileComponents();
fixture = TestBed.createComponent(VorgangDetailBescheidenAbbrechenButtonComponent);
@@ -33,15 +20,4 @@ describe('VorgangDetailBescheidenAbbrechenButtonComponent', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
-
- describe('onClick', () => {
- it('should call ozgcloudDialogService.open', () => {
- component.onClick();
-
- expect(ozgcloudDialogService.openInCallingComponentContext).toHaveBeenCalledWith(
- VorgangDetailBescheidenAbbrechenDialogComponent,
- component.viewContainerRef,
- );
- });
- });
});
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.ts b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.ts
index 41f0834080232437ba18c70f809071c2f9c3dc8a..4f1051d4c4c98c148725c077185d35463b916a6c 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.ts
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component.ts
@@ -1,6 +1,4 @@
-import { OzgcloudDialogService } from '@alfa-client/ui';
-import { Component, ViewContainerRef } from '@angular/core';
-import { VorgangDetailBescheidenAbbrechenDialogComponent } from '../vorgang-detail-bescheiden-abbrechen-dialog/vorgang-detail-bescheiden-abbrechen-dialog.component';
+import { Component, EventEmitter, Output } from '@angular/core';
@Component({
selector: 'alfa-vorgang-detail-bescheiden-abbrechen-button',
@@ -8,15 +6,5 @@ import { VorgangDetailBescheidenAbbrechenDialogComponent } from '../vorgang-deta
styles: [],
})
export class VorgangDetailBescheidenAbbrechenButtonComponent {
- constructor(
- private readonly ozgcloudDialogService: OzgcloudDialogService,
- readonly viewContainerRef: ViewContainerRef,
- ) {}
-
- public onClick(): void {
- this.ozgcloudDialogService.openInCallingComponentContext<VorgangDetailBescheidenAbbrechenDialogComponent>(
- VorgangDetailBescheidenAbbrechenDialogComponent,
- this.viewContainerRef,
- );
- }
+ @Output() public clickEmitter: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>();
}
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.html b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.html
index e2427e885a079271ae20cac54e8a0ea1f168013f..f1e668502936106b848030aa3635d0fd7323b7f6 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.html
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.html
@@ -6,11 +6,13 @@
data-test-id="bescheid-wizard"
>
<div class="fixed inset-0 z-10 w-screen overflow-y-auto">
- <div class="flex h-full items-end items-center justify-center p-8">
+ <div class="flex h-full items-center justify-center p-8">
<div
class="relative h-full w-full max-w-7xl transform overflow-hidden rounded-lg bg-background-200 px-6 py-10 text-left shadow-xl transition-all"
>
- <alfa-vorgang-detail-bescheiden-abbrechen-button></alfa-vorgang-detail-bescheiden-abbrechen-button>
+ <alfa-vorgang-detail-bescheiden-abbrechen-button
+ (clickEmitter)="cancelWizard()"
+ ></alfa-vorgang-detail-bescheiden-abbrechen-button>
<form [formGroup]="formService.form" class="flex h-full flex-row gap-11">
<alfa-vorgang-detail-bescheiden-steps
class="flex w-1/2"
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.spec.ts b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.spec.ts
index c82b596f3669350ebd42f569cae44749fa9c92f8..b201b90bf4bf872be0f5c3461dd719624462f58b 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.spec.ts
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.spec.ts
@@ -1,6 +1,7 @@
import { BescheidResource, BescheidService } from '@alfa-client/bescheid-shared';
import { PostfachService } from '@alfa-client/postfach-shared';
import { Mock, dispatchEventFromFixture, mock, useFromMock } from '@alfa-client/test-utils';
+import { OzgcloudDialogService } from '@alfa-client/ui';
import { VorgangService, VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
import { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';
import { ComponentFixture, TestBed } from '@angular/core/testing';
@@ -8,11 +9,13 @@ import { ReactiveFormsModule, UntypedFormBuilder } from '@angular/forms';
import { MatIcon } from '@angular/material/icon';
import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
import { MockComponent } from 'ng-mocks';
+import { Subscription, of } from 'rxjs';
import { createBescheidResource } from '../../../../../bescheid-shared/src/test/bescheid';
import { createVorgangWithEingangResource } from '../../../../../vorgang-shared/test/vorgang';
import { BescheidenFormService } from './bescheiden.formservice';
import { VorgangDetailBescheidenResultComponent } from './vorgang-detail-bescheiden-result/vorgang-detail-bescheiden-result.component';
import { VorgangDetailBescheidenAbbrechenButtonComponent } from './vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-button/vorgang-detail-bescheiden-abbrechen-button.component';
+import { VorgangDetailBescheidenAbbrechenDialogComponent } from './vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-dialog/vorgang-detail-bescheiden-abbrechen-dialog.component';
import { VorgangDetailBescheidenStepsComponent } from './vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps.component';
import { VorgangDetailBescheidenComponent } from './vorgang-detail-bescheiden.component';
@@ -23,8 +26,8 @@ describe('VorgangDetailBescheidenComponent', () => {
let bescheidService: Mock<BescheidService>;
let vorgangService: Mock<VorgangService>;
let formService: BescheidenFormService;
- let dialogRef: Mock<DialogRef>;
let postfachService: Mock<PostfachService>;
+ let ozgcloudDialogService: Mock<OzgcloudDialogService>;
let vorgangWithEingangResource: VorgangWithEingangResource;
let bescheidDraftResource: BescheidResource;
@@ -35,8 +38,8 @@ describe('VorgangDetailBescheidenComponent', () => {
bescheidService = mock(BescheidService);
vorgangService = mock(VorgangService);
formService = new BescheidenFormService(new UntypedFormBuilder(), useFromMock(bescheidService));
- dialogRef = mock(DialogRef);
postfachService = mock(PostfachService);
+ ozgcloudDialogService = mock(OzgcloudDialogService);
vorgangWithEingangResource = createVorgangWithEingangResource();
bescheidDraftResource = createBescheidResource();
@@ -70,7 +73,7 @@ describe('VorgangDetailBescheidenComponent', () => {
},
{
provide: DialogRef,
- useValue: dialogRef,
+ useValue: { keydownEvents: of(KeyboardEvent), close: jest.fn(), disableClose: false },
},
{
provide: DIALOG_DATA,
@@ -80,12 +83,17 @@ describe('VorgangDetailBescheidenComponent', () => {
provide: PostfachService,
useValue: postfachService,
},
+ {
+ provide: OzgcloudDialogService,
+ useValue: ozgcloudDialogService,
+ },
],
imports: [ReactiveFormsModule],
}).compileComponents();
fixture = TestBed.createComponent(VorgangDetailBescheidenComponent);
component = fixture.componentInstance;
+
fixture.detectChanges();
});
@@ -109,13 +117,40 @@ describe('VorgangDetailBescheidenComponent', () => {
expect(patchValues).toBeCalledWith(bescheidDraftResource);
});
+
+ it('should call handleEscapeKey', () => {
+ component.handleEscapeKey = jest.fn();
+
+ component.ngOnInit();
+
+ expect(component.handleEscapeKey).toHaveBeenCalled();
+ });
+ });
+
+ describe('handleEscapeKey', () => {
+ it('should subscribe to dialogRef.keydownEvents', () => {
+ component.handleEscapeKey();
+
+ expect(component.keydownEventsSubscription).toBeInstanceOf(Subscription);
+ });
+ });
+
+ describe('ngOnDestroy', () => {
+ it('should unsubscribe keydownEventsSubscription', () => {
+ component.keydownEventsSubscription = new Subscription();
+ jest.spyOn(component.keydownEventsSubscription, 'unsubscribe');
+
+ component.ngOnDestroy();
+
+ expect(component.keydownEventsSubscription.unsubscribe).toHaveBeenCalled();
+ });
});
describe('onClose', () => {
it('should call dialogRef.close', () => {
component.onClose();
- expect(dialogRef.close).toHaveBeenCalled();
+ expect(component.dialogRef.close).toHaveBeenCalled();
});
it('should call vorgang service to reload current vorgang', () => {
@@ -135,7 +170,18 @@ describe('VorgangDetailBescheidenComponent', () => {
it('should close dialog ref', () => {
dispatchEventFromFixture(fixture, bescheidenResult, 'closeDialog');
- expect(dialogRef.close).toHaveBeenCalled();
+ expect(component.dialogRef.close).toHaveBeenCalled();
+ });
+ });
+
+ describe('cancelWizard', () => {
+ it('should call ozgcloudDialogService.open', () => {
+ component.cancelWizard();
+
+ expect(ozgcloudDialogService.openInCallingComponentContext).toHaveBeenCalledWith(
+ VorgangDetailBescheidenAbbrechenDialogComponent,
+ component.viewContainerRef,
+ );
});
});
});
diff --git a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.ts b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.ts
index c3a880423edbb95b2b2153db66b3202ae9dd7bad..a88075f699841c8e2b5d9c085023f6f087efc854 100644
--- a/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.ts
+++ b/alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component.ts
@@ -1,19 +1,24 @@
import { BescheidResource } from '@alfa-client/bescheid-shared';
import { PostfachService } from '@alfa-client/postfach-shared';
+import { OzgcloudDialogService } from '@alfa-client/ui';
import { VorgangService } from '@alfa-client/vorgang-shared';
import { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';
-import { Component, Inject, OnInit } from '@angular/core';
+import { Component, Inject, OnDestroy, OnInit, ViewContainerRef } from '@angular/core';
+import { Subscription, filter } from 'rxjs';
import { BescheidenFormService } from './bescheiden.formservice';
import { BescheidenDialogData } from './bescheiden.model';
+import { VorgangDetailBescheidenAbbrechenDialogComponent } from './vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps-content/vorgang-detail-bescheiden-abbrechen-dialog/vorgang-detail-bescheiden-abbrechen-dialog.component';
@Component({
selector: 'alfa-vorgang-detail-bescheiden',
templateUrl: './vorgang-detail-bescheiden.component.html',
providers: [BescheidenFormService],
})
-export class VorgangDetailBescheidenComponent implements OnInit {
+export class VorgangDetailBescheidenComponent implements OnDestroy, OnInit {
private readonly bescheidDraftResource: BescheidResource;
+ keydownEventsSubscription: Subscription;
+
public activeStep: number = 1;
constructor(
@@ -22,6 +27,8 @@ export class VorgangDetailBescheidenComponent implements OnInit {
private readonly vorgangService: VorgangService,
private readonly postfachService: PostfachService,
@Inject(DIALOG_DATA) private readonly dialogData: BescheidenDialogData,
+ private readonly ozgcloudDialogService: OzgcloudDialogService,
+ readonly viewContainerRef: ViewContainerRef,
) {
this.bescheidDraftResource = dialogData.bescheidDraftResource;
}
@@ -29,6 +36,17 @@ export class VorgangDetailBescheidenComponent implements OnInit {
ngOnInit(): void {
this.formService.setVorgangWithEingangResource(this.dialogData.vorgangWithEingangResource);
this.formService.patchValues(this.bescheidDraftResource);
+ this.handleEscapeKey();
+ }
+
+ handleEscapeKey(): void {
+ this.keydownEventsSubscription = this.dialogRef.keydownEvents
+ .pipe(filter((event) => event.key === 'Escape'))
+ .subscribe(() => this.cancelWizard());
+ }
+
+ ngOnDestroy(): void {
+ this.keydownEventsSubscription.unsubscribe();
}
public onClose(): void {
@@ -36,4 +54,11 @@ export class VorgangDetailBescheidenComponent implements OnInit {
this.vorgangService.reloadCurrentVorgang();
this.postfachService.setPostfachMailOnReload();
}
+
+ public cancelWizard(): void {
+ this.ozgcloudDialogService.openInCallingComponentContext<VorgangDetailBescheidenAbbrechenDialogComponent>(
+ VorgangDetailBescheidenAbbrechenDialogComponent,
+ this.viewContainerRef,
+ );
+ }
}