First draft

web/src/app/administration/administration.module.ts

@@ -74,6 +74,7 @@ import { MatTableModule } from '@angular/material/table';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { ScrollingModule } from '@angular/cdk/scrolling';
+import {ExportDialogComponent} from "./components/export-dialog/export-dialog.component";
 
 const MODULES = [
   CommonModule,
@@ -102,6 +103,7 @@ const DECLARATIONS = [
   ClassificationTypesSelectorComponent,
   ClassificationDetailsComponent,
   ImportExportComponent,
+  ExportDialogComponent,
   AccessItemsManagementComponent,
   AdministrationOverviewComponent
 ];

web/src/app/administration/components/export-dialog/export-dialog.component.html

@@ -0,0 +1,35 @@
+<!--
+  ~ Copyright [2024] [envite consulting GmbH]
+  ~
+  ~    Licensed under the Apache License, Version 2.0 (the "License");
+  ~    you may not use this file except in compliance with the License.
+  ~    You may obtain a copy of the License at
+  ~
+  ~        http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~    Unless required by applicable law or agreed to in writing, software
+  ~    distributed under the License is distributed on an "AS IS" BASIS,
+  ~    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~    See the License for the specific language governing permissions and
+  ~    limitations under the License.
+  ~
+  ~
+  -->
+
+<h1 mat-dialog-title>Export Options</h1>
+<div mat-dialog-content>
+  <p>Select a domain to export:</p>
+  <button (click)="onExport('')" mat-button>
+    All Domains
+  </button>
+  <button
+    *ngFor="let domain of data.domains$ | async"
+    (click)="onExport(domain)"
+    mat-button
+  >
+    {{ domain === '' ? 'Master' : domain }}
+  </button>
+</div>
+<div mat-dialog-actions>
+  <button (click)="onCancel()" mat-button>Cancel</button>
+</div>

web/src/app/administration/components/export-dialog/export-dialog.component.scss

@@ -0,0 +1,17 @@
+/*!
+ * Copyright [2024] [envite consulting GmbH]
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ *
+ *
+ */

web/src/app/administration/components/export-dialog/export-dialog.component.spec.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright [2024] [envite consulting GmbH]
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ *
+ *
+ */

web/src/app/administration/components/export-dialog/export-dialog.component.ts

@@ -0,0 +1,41 @@
+/*
+ * Copyright [2024] [envite consulting GmbH]
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ *
+ *
+ */
+
+import {Component, Inject} from "@angular/core";
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+import {Observable} from "rxjs";
+
+@Component({
+  selector: 'kadai-export-dialog',
+  templateUrl: './export-dialog.component.html',
+  styleUrls: ['./export-dialog.component.scss']
+})
+export class ExportDialogComponent {
+  constructor(
+    public dialogRef: MatDialogRef<ExportDialogComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: { domains$: Observable<string[]> }
+  ) {}
+
+  onExport(domain: string): void {
+    this.dialogRef.close(domain);
+  }
+
+  onCancel(): void {
+    this.dialogRef.close();
+  }
+}

web/src/app/administration/components/import-export/import-export.component.html

@@ -17,27 +17,35 @@
   -->
 
 <div class="import-export">
-  <button (click)="selectedFile.click()" class="mr-1" mat-stroked-button matTooltip="Import {{parentComponent}}"
-          title="Import">
+  <button
+    (click)="selectedFile.click()"
+    class="mr-1"
+    mat-stroked-button
+    matTooltip="Import {{parentComponent}}"
+    title="Import"
+  >
     Import
     <mat-icon>cloud_upload</mat-icon>
   </button>
 
   <form class="hide" enctype="multipart/form-data" method="post">
-    <input #selectedFile (change)="uploadFile()" accept=".json" class="hidden" type="file"/>
+    <input
+      #selectedFile
+      (change)="uploadFile()"
+      accept=".json"
+      class="hidden"
+      type="file"
+    />
   </form>
 
-  <button [matMenuTriggerFor]="menu" class="mr-1" mat-stroked-button matTooltip="Export {{parentComponent}}"
-          title="Export">
+  <button
+    (click)="openExportDialog()"
+    class="mr-1"
+    mat-stroked-button
+    matTooltip="Export {{parentComponent}}"
+    title="Export"
+  >
     Export
     <mat-icon>cloud_download</mat-icon>
   </button>
-  <mat-menu #menu="matMenu">
-    <button (click)="export()" href="javascript:void(0)" mat-menu-item>
-      All Domains
-    </button>
-    <button (click)="export(domain)" *ngFor="let domain of (domains$ | async)" href="javascript:void(0)" mat-menu-item>
-      {{domain === '' ? 'Master' : domain}}
-    </button>
-  </mat-menu>
 </div>

web/src/app/administration/components/import-export/import-export.component.ts

@@ -26,6 +26,8 @@ import { NotificationService } from '../../../shared/services/notifications/noti
 import { Observable, Subject } from 'rxjs';
 import { HotToastService } from '@ngneat/hot-toast';
 import { takeUntil } from 'rxjs/operators';
+import {ExportDialogComponent} from "../export-dialog/export-dialog.component";
+import {MatDialog} from "@angular/material/dialog";
 
 /**
  * Recommendation: Turn this component into presentational component - no logic, instead events are
@@ -53,13 +55,27 @@ export class ImportExportComponent implements OnInit, OnDestroy {
     private classificationDefinitionService: ClassificationDefinitionService,
     private notificationService: NotificationService,
     private importExportService: ImportExportService,
-    private hotToastService: HotToastService
+    private hotToastService: HotToastService,
+    private dialog: MatDialog
   ) {}
 
   ngOnInit() {
     this.domains$ = this.domainService.getDomains();
   }
 
+  openExportDialog(): void {
+    const dialogRef = this.dialog.open(ExportDialogComponent, {
+      width: '400px',
+      data: { domains$: this.domains$ }
+    });
+
+    dialogRef.afterClosed().subscribe((selectedDomain: string) => {
+      if (selectedDomain !== undefined) {
+        this.export(selectedDomain);
+      }
+    });
+  }
+
   export(domain = '') {
     if (this.currentSelection === KadaiType.WORKBASKETS) {
       this.workbasketDefinitionService.exportWorkbaskets(domain);