OZG-6989 7281 archive dialog

alfa-client/apps/alfa-e2e/docker-compose.yml

@@ -99,6 +99,7 @@ services:
       - OZGCLOUD_VORGANG_PROCESSOR_1_FORM_ENGINE_NAME=AFM
       - OZGCLOUD_VORGANG_PROCESSOR_1_FORM_ID=Erstattung_FAIL
       - OZGCLOUD_VORGANG_PROCESSOR_NAMES_0=ticketCheck
+      - OZGCLOUD_DMS_ENABLED=true
       - SPRING_PROFILES_ACTIVE=remotekc, e2e
       - LOGGING_CONFIG=classpath:log4j2-local.xml
       - BPL_DEBUG_ENABLED=true

alfa-client/libs/design-system/src/index.ts

@@ -16,6 +16,7 @@ export * from './lib/form/radio-button-card/radio-button-card.component';
 export * from './lib/form/text-input/text-input.component';
 export * from './lib/form/textarea/textarea.component';
 export * from './lib/icons/admin-logo-icon/admin-logo-icon.component';
+export * from './lib/icons/archive-icon/archive-icon.component';
 export * from './lib/icons/attachment-icon/attachment-icon.component';
 export * from './lib/icons/bescheid-generate-icon/bescheid-generate-icon.component';
 export * from './lib/icons/bescheid-upload-icon/bescheid-upload-icon.component';

alfa-client/libs/ui/src/lib/ui/ui.module.ts

@@ -239,6 +239,7 @@ import { ValidationErrorComponent } from './validation-error/validation-error.co
     OzgcloudPasteTextButtonComponent,
     CheckboxEnumEditorComponent,
     FileUploadButtonComponent,
+    OzgcloudButtonContentComponent,
   ],
   providers: [
     {

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component.html

+<alfa-vorgang-archive-confirmation-dialog
+  (confirmationButtonClicked)="onConfirmationButtonClicked()"
+  (cancelButtonClicked)="onCancelButtonClicked()"
+/>
\ No newline at end of file

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { createStateResource, StateResource } from '@alfa-client/tech-shared';
+import { mock } from '@alfa-client/test-utils';
+import { VorgangService, VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
+import { DialogRef } from '@angular/cdk/dialog';
+import { createVorgangWithEingangResource } from 'libs/vorgang-shared/test/vorgang';
+import { MockComponent } from 'ng-mocks';
+import { describe } from 'node:test';
+import { of } from 'rxjs';
+import { VorgangArchiveConfirmationDialogContainerComponent } from './vorgang-archive-confirmation-dialog-container.component';
+import { VorgangArchiveConfirmationDialogComponent } from './vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.component';
+
+describe('VorgangArchiveConfirmationDialogContainerComponent', () => {
+  let component: VorgangArchiveConfirmationDialogContainerComponent;
+  let fixture: ComponentFixture<VorgangArchiveConfirmationDialogContainerComponent>;
+
+  const vorgangWithEingang: VorgangWithEingangResource = createVorgangWithEingangResource();
+  const dialogRef = { ...mock(DialogRef), config: { data: { vorgangWithEingang } } };
+
+  const vorgangArchiveState: StateResource<boolean> = createStateResource(true);
+  const vorgangService = {
+    ...mock(VorgangService),
+    getVorgangArchive: jest.fn().mockReturnValue(of(createStateResource(vorgangArchiveState))),
+  };
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [
+        VorgangArchiveConfirmationDialogContainerComponent,
+        MockComponent(VorgangArchiveConfirmationDialogComponent),
+      ],
+      providers: [
+        { provide: DialogRef, useValue: dialogRef },
+        {
+          provide: VorgangService,
+          useValue: vorgangService,
+        },
+      ],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(VorgangArchiveConfirmationDialogContainerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  describe('component', () => {
+    describe('ngOnInit', () => {
+      it('should get archive', () => {
+        component.ngOnInit();
+
+        expect(vorgangService.getVorgangArchive).toHaveBeenCalled();
+      });
+    });
+
+    describe('archiveDoneHandler', () => {
+      it('should close dialog if archive is done', () => {
+        component.archiveDoneHandler(vorgangArchiveState);
+
+        expect(dialogRef.close).toHaveBeenCalled();
+      });
+    });
+
+    describe('onCancelButtonClicked', () => {
+      it('should close dialog', () => {
+        component.onCancelButtonClicked();
+
+        expect(dialogRef.close).toHaveBeenCalled();
+      });
+    });
+
+    describe('onConfirmationButtonClicked', () => {
+      it('should archive vorgang', () => {
+        component.onConfirmationButtonClicked();
+
+        expect(vorgangService.archive).toHaveBeenCalledWith(vorgangWithEingang);
+      });
+    });
+  });
+});

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component.ts

+import { StateResource } from '@alfa-client/tech-shared';
+import { VorgangService, VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
+import { DialogRef } from '@angular/cdk/dialog';
+import { Component, inject, OnInit } from '@angular/core';
+import { Observable, tap } from 'rxjs';
+import { VorgangArchiveConfirmationDialogData } from './vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.model';
+
+@Component({
+  selector: 'alfa-vorgang-archive-confirmation-dialog-container',
+  templateUrl: './vorgang-archive-confirmation-dialog-container.component.html',
+})
+export class VorgangArchiveConfirmationDialogContainerComponent implements OnInit {
+  private vorgangService = inject(VorgangService);
+  private dialogRef = inject(DialogRef<unknown, VorgangArchiveConfirmationDialogData>);
+
+  private vorgangWithEingang: VorgangWithEingangResource = this.dialogRef.config.data.vorgangWithEingang;
+
+  public archiveStateResource$: Observable<StateResource<boolean>>;
+
+  ngOnInit(): void {
+    this.archiveStateResource$ = this.vorgangService
+      .getVorgangArchive()
+      .pipe(tap((vorgangArchiveStateResource) => this.archiveDoneHandler(vorgangArchiveStateResource)));
+  }
+
+  archiveDoneHandler(vorgangArchiveStateResource: StateResource<boolean>): void {
+    if (vorgangArchiveStateResource.resource) this.dialogRef.close();
+  }
+
+  public onCancelButtonClicked(): void {
+    this.dialogRef.close();
+  }
+
+  public onConfirmationButtonClicked(): void {
+    this.vorgangService.archive(this.vorgangWithEingang);
+  }
+}

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.component.html

+<div class="border border-grayborder rounded bg-background-50 p-8 shadow shadow-grayborder">
+  <h1 class="text-xl font-bold text-primary-600 mb-8">
+    Möchten Sie den Vorgang aus Alfa löschen und im DMS archivieren?
+  </h1>
+
+  <p class="text-base mb-8">
+    Diese Aktion kann nicht rückgängig gemacht werden!
+  </p>
+
+  <div class="flex gap-6">
+    <ods-button-with-spinner
+      dataTestId="archive-confirmation-button"
+      text="Löschen und archivieren"
+      [stateResource]="archiveStateResource"
+      (click)="confirmationButtonClicked.emit()"
+    />
+
+    <ods-button
+      dataTestId="archive-cancel-button"
+      text="Abbrechen"
+      variant="outline"
+      (click)="cancelButtonClicked.emit()"
+    />
+  </div>
+</div>

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ButtonWithSpinnerComponent } from '@ods/component';
+import { ButtonComponent } from '@ods/system';
+import { MockComponent } from 'ng-mocks';
+import { VorgangArchiveConfirmationDialogComponent } from './vorgang-archive-confirmation-dialog.component';
+
+describe('VorgangArchiveConfirmationDialogComponent', () => {
+  let component: VorgangArchiveConfirmationDialogComponent;
+  let fixture: ComponentFixture<VorgangArchiveConfirmationDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        VorgangArchiveConfirmationDialogComponent,
+        MockComponent(ButtonWithSpinnerComponent),
+        MockComponent(ButtonComponent),
+      ],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(VorgangArchiveConfirmationDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.component.ts

+import { StateResource } from '@alfa-client/tech-shared';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+
+@Component({
+  selector: 'alfa-vorgang-archive-confirmation-dialog',
+  templateUrl: './vorgang-archive-confirmation-dialog.component.html',
+})
+export class VorgangArchiveConfirmationDialogComponent {
+  @Input() archiveStateResource: StateResource<boolean>;
+
+  @Output() cancelButtonClicked = new EventEmitter();
+  @Output() confirmationButtonClicked = new EventEmitter();
+}

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.model.ts

+import { VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
+
+export type VorgangArchiveConfirmationDialogData = {
+  vorgangWithEingang: VorgangWithEingangResource;
+};

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-container.component.html

 <ozgcloud-button-with-spinner
   dataTestId="archive-vorgang"
-  [showSpinner]="(archiveStateResource$ | async)?.loading"
-  (clickEmitter)="archive()"
-  text="Herunterladen"
-  icon="save_alt"
+  (click)="openArchiveConfirmationDialog()"
+  text="Archivierung starten"
+  icon="archive"
 />
\ No newline at end of file

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-container.component.spec.ts

 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { createEmptyStateResource, createStateResource, StateResource } from '@alfa-client/tech-shared';
 import { mock } from '@alfa-client/test-utils';
-import { OzgcloudButtonWithSpinnerComponent } from '@alfa-client/ui';
-import { VorgangService } from '@alfa-client/vorgang-shared';
+import { OzgcloudButtonWithSpinnerComponent, OzgcloudDialogService } from '@alfa-client/ui';
+import { createVorgangWithEingangResource } from 'libs/vorgang-shared/test/vorgang';
 import { MockComponent } from 'ng-mocks';
 import { describe } from 'node:test';
-import { of } from 'rxjs';
+import { VorgangArchiveConfirmationDialogContainerComponent } from './vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component';
 import { VorgangArchiveContainerComponent } from './vorgang-archive-container.component';
 
 describe('VorgangArchiveContainerComponent', () => {
   let component: VorgangArchiveContainerComponent;
   let fixture: ComponentFixture<VorgangArchiveContainerComponent>;
 
-  const vorgangArchiveState: StateResource<boolean> = createStateResource(true);
-  const vorgangService = {
-    ...mock(VorgangService),
-    getVorgangArchive: jest.fn().mockReturnValue(of(createStateResource(vorgangArchiveState))),
-  };
+  const vorgangWithEingang = createVorgangWithEingangResource();
+
+  const dialogService = mock(OzgcloudDialogService);
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [VorgangArchiveContainerComponent, MockComponent(OzgcloudButtonWithSpinnerComponent)],
+      imports: [
+        VorgangArchiveContainerComponent,
+        MockComponent(OzgcloudButtonWithSpinnerComponent),
+        MockComponent(VorgangArchiveConfirmationDialogContainerComponent),
+      ],
       providers: [
         {
-          provide: VorgangService,
-          useValue: vorgangService,
+          provide: OzgcloudDialogService,
+          useValue: dialogService,
         },
       ],
     }).compileComponents();
 
     fixture = TestBed.createComponent(VorgangArchiveContainerComponent);
     component = fixture.componentInstance;
+    component.vorgangWithEingang = vorgangWithEingang;
     fixture.detectChanges();
   });
 
@@ -40,29 +42,13 @@ describe('VorgangArchiveContainerComponent', () => {
   });
 
   describe('component', () => {
-    describe('ngOnInit', () => {
-      it('should get archive', () => {
-        vorgangService.getVorgangArchive.mockReturnValueOnce(of(createEmptyStateResource<boolean>()));
-        component.ngOnInit();
+    describe('openArchiveConfirmationDialog', () => {
+      it('should call dialog service open', () => {
+        component.openArchiveConfirmationDialog();
 
-        expect(vorgangService.getVorgangArchive).toHaveBeenCalled();
-      });
+        expect(dialogService.open).toHaveBeenCalledWith(VorgangArchiveConfirmationDialogContainerComponent, {
+          vorgangWithEingang,
         });
-
-    describe('archiveDoneHandler', () => {
-      it('should closeMenu if archive is done', () => {
-        jest.spyOn(component.closeMenu, 'emit');
-        component.archiveDoneHandler(vorgangArchiveState);
-
-        expect(component.closeMenu.emit).toHaveBeenCalled();
-      });
-    });
-
-    describe('archive', () => {
-      it('should call archive', () => {
-        component.archive();
-
-        expect(vorgangService.archive).toHaveBeenCalled();
       });
     });
   });

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-container.component.ts

-import { StateResource } from '@alfa-client/tech-shared';
-import { VorgangService, VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
-import { Component, EventEmitter, inject, Input, OnInit, Output } from '@angular/core';
-import { Observable, tap } from 'rxjs';
+import { OzgcloudDialogService } from '@alfa-client/ui';
+import { VorgangWithEingangLinkRel, VorgangWithEingangResource } from '@alfa-client/vorgang-shared';
+import { Component, inject, Input } from '@angular/core';
+import { VorgangArchiveConfirmationDialogContainerComponent } from './vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component';
+import { VorgangArchiveConfirmationDialogData } from './vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.model';
 
 @Component({
   selector: 'alfa-vorgang-archive-container',
   templateUrl: './vorgang-archive-container.component.html',
 })
-export class VorgangArchiveContainerComponent implements OnInit {
-  private vorgangService = inject(VorgangService);
+export class VorgangArchiveContainerComponent {
+  private dialogService = inject(OzgcloudDialogService);
 
   @Input() vorgangWithEingang: VorgangWithEingangResource;
 
-  @Output() public closeMenu: EventEmitter<void> = new EventEmitter();
+  protected readonly vorgangWithEingangLinkRel = VorgangWithEingangLinkRel;
 
-  public archiveStateResource$: Observable<StateResource<boolean>>;
-
-  ngOnInit(): void {
-    this.archiveStateResource$ = this.vorgangService
-      .getVorgangArchive()
-      .pipe(tap((vorgangArchiveStateResource) => this.archiveDoneHandler(vorgangArchiveStateResource)));
-  }
-
-  archiveDoneHandler(vorgangArchiveStateResource: StateResource<boolean>): void {
-    if (vorgangArchiveStateResource.resource) this.closeMenu.emit();
+  public openArchiveConfirmationDialog(): void {
+    this.dialogService.open<unknown, VorgangArchiveConfirmationDialogData>(
+      VorgangArchiveConfirmationDialogContainerComponent,
+      this.buildDialogData(),
+    );
   }
 
-  public archive(): void {
-    this.vorgangService.archive(this.vorgangWithEingang);
+  private buildDialogData(): VorgangArchiveConfirmationDialogData {
+    return {
+      vorgangWithEingang: this.vorgangWithEingang,
+    };
   }
 }

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-detail-more-menu.component.html

@@ -19,7 +19,6 @@
   >
     <alfa-vorgang-archive-container
       [vorgangWithEingang]="vorgangWithEingang"
-      (closeMenu)="closeMenu()"
     ></alfa-vorgang-archive-container>
   </ozgcloud-menu-item>
   <ozgcloud-menu-item

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-more-menu/vorgang-detail-more-menu.component.spec.ts

@@ -213,7 +213,6 @@ describe('VorgangDetailMoreMenuComponent', () => {
       });
 
       it('should contains icon', () => {
-        // TODO: change icon
         expect(menuItem.icon).toBe('xdomea_file');
       });
 

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail.module.ts

@@ -49,6 +49,7 @@ import {
   TextareaEditorComponent,
 } from '@ods/component';
 import {
+  ArchiveIconComponent,
   AttachmentComponent,
   AttachmentWrapperComponent,
   BescheidGenerateIconComponent,
@@ -110,6 +111,8 @@ import { VorgangDetailBescheidenUeberspringenDialogComponent } from './vorgang-d
 import { VorgangDetailBescheidenStepsComponent } from './vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-steps.component';
 import { VorgangDetailBescheidenWeiterButtonComponent } from './vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden-steps/vorgang-detail-bescheiden-weiter-button/vorgang-detail-bescheiden-weiter-button.component';
 import { VorgangDetailBescheidenComponent } from './vorgang-detail-page/vorgang-detail-bescheiden/vorgang-detail-bescheiden.component';
+import { VorgangArchiveConfirmationDialogContainerComponent } from './vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog-container.component';
+import { VorgangArchiveConfirmationDialogComponent } from './vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-confirmation-dialog-container/vorgang-archive-confirmation-dialog/vorgang-archive-confirmation-dialog.component';
 import { VorgangArchiveContainerComponent } from './vorgang-detail-page/vorgang-detail-more-menu/vorgang-archive-container/vorgang-archive-container.component';
 import { VorgangDetailMoreMenuComponent } from './vorgang-detail-page/vorgang-detail-more-menu/vorgang-detail-more-menu.component';
 import { VorgangExportContainerComponent } from './vorgang-detail-page/vorgang-detail-more-menu/vorgang-export-container/vorgang-export-container.component';
@@ -164,6 +167,7 @@ const routes: Routes = [
     BescheidStatusTextComponent,
     ErrorMessageComponent,
     CollaborationModule,
+    ArchiveIconComponent,
   ],
   declarations: [
     VorgangDetailPageComponent,
@@ -216,6 +220,8 @@ const routes: Routes = [
     VorgangDetailBescheidenResultNachrichtComponent,
     VorgangDetailDateienContainerComponent,
     VorgangArchiveContainerComponent,
+    VorgangArchiveConfirmationDialogContainerComponent,
+    VorgangArchiveConfirmationDialogComponent,
   ],
   exports: [VorgangDetailAntragstellerComponent, VorgangDetailAntragDataComponent, VorgangDetailBescheidenComponent],
 })

alfa-client/libs/vorgang-detail/src/test-setup.ts

@@ -25,10 +25,7 @@ import '@testing-library/jest-dom';
 import 'jest-preset-angular/setup-jest';
 
 import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting,
-} from '@angular/platform-browser-dynamic/testing';
+import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
 getTestBed().resetTestEnvironment();
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {

alfa-client/libs/vorgang-shared/src/lib/vorgang.service.ts

@@ -172,7 +172,9 @@ export class VorgangService {
     return of(createEmptyStateResource<boolean>());
   }
 
-  public archive(vorgangWithEingang: VorgangWithEingangResource): void {}
+  public archive(vorgangWithEingang: VorgangWithEingangResource): Observable<StateResource<CommandResource>> {
+    return of(createEmptyStateResource<CommandResource>());
+  }
 
   public processVorgang(vorgangWithEingang: VorgangWithEingangResource): Observable<StateResource<CommandResource>> {
     return this.commandService.createCommandByProps(this.createProcessVorgangCommandProps(vorgangWithEingang));