Dialog to choose config type to export

src/app/app.module.ts

@@ -249,6 +249,7 @@ import { PageNotFoundComponent } from './components/page-not-found/page-not-foun
 import { AlignHorizontallyActionComponent } from './components/project-map/context-menu/actions/align-horizontally/align-horizontally.component';
 import { AlignVerticallyActionComponent } from './components/project-map/context-menu/actions/align_vertically/align-vertically.component';
 import { ConfirmationBottomSheetComponent } from './components/projects/confirmation-bottomsheet/confirmation-bottomsheet.component';
+import { ConfigDialogComponent } from './components/project-map/context-menu/dialogs/config-dialog/config-dialog.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -420,7 +421,8 @@ if (environment.production) {
     PageNotFoundComponent,
     AlignHorizontallyActionComponent,
     AlignVerticallyActionComponent,
-    ConfirmationBottomSheetComponent
+    ConfirmationBottomSheetComponent,
+    ConfigDialogComponent
   ],
   imports: [
     BrowserModule,
@@ -544,7 +546,8 @@ if (environment.production) {
     ChooseNameDialogComponent,
     NavigationDialogComponent,
     ScreenshotDialogComponent,
-    ConfirmationBottomSheetComponent
+    ConfirmationBottomSheetComponent,
+    ConfigDialogComponent
   ],
   bootstrap: [AppComponent]
 })

src/app/components/project-map/context-menu/actions/export-config/export-config-action.component.ts

@@ -2,6 +2,8 @@ import { Component, Input } from '@angular/core';
 import { Node } from '../../../../../cartography/models/node';
 import { NodeService } from '../../../../../services/node.service';
 import { Server } from '../../../../../models/server';
+import { MatDialog } from '@angular/material';
+import { ConfigDialogComponent } from '../../dialogs/config-dialog/config-dialog.component';
 
 @Component({
     selector: 'app-export-config-action',
@@ -12,13 +14,33 @@ export class ExportConfigActionComponent {
     @Input() node: Node;
 
     constructor(
-        private nodeService: NodeService
+        private nodeService: NodeService,
+        private dialog: MatDialog
     ) {}
 
     exportConfig() {
-        this.nodeService.getStartupConfiguration(this.server, this.node).subscribe((config: any) => {
+        if (this.node.node_type === 'vpcs') {
-            this.downloadByHtmlTag(config);
+            this.nodeService.getStartupConfiguration(this.server, this.node).subscribe((config: any) => {
-        });
+                this.downloadByHtmlTag(config);
+            });
+        } else {
+            const dialogRef = this.dialog.open(ConfigDialogComponent, {
+                width: '500px',
+                autoFocus: false
+            });
+            let instance = dialogRef.componentInstance;
+            dialogRef.afterClosed().subscribe((configType: string) => {
+                if (configType === 'startup-config') {
+                    this.nodeService.getStartupConfiguration(this.server, this.node).subscribe((config: any) => {
+                        this.downloadByHtmlTag(config);
+                    });
+                } else if (configType === 'private-config') {
+                    this.nodeService.getPrivateConfiguration(this.server, this.node).subscribe((config: any) => {
+                        this.downloadByHtmlTag(config);
+                    });
+                }
+            });
+        }
     }
 
     private downloadByHtmlTag(config: string) {

src/app/components/project-map/context-menu/dialogs/config-dialog/config-dialog.component.html

@@ -0,0 +1,16 @@
+<h1 mat-dialog-title>Choose configuration file</h1>
+
+<div class="modal-form-container">
+    <div class="container">
+        <div>
+            <button mat-raised-button color="primary" (click)="close('startup-config')">
+                startup configuration
+            </button>
+        </div>
+        <div>
+            <button mat-raised-button color="primary" (click)="close('private-config')">
+                private configuration
+            </button>
+        </div>
+    </div>
+</div>

src/app/components/project-map/context-menu/dialogs/config-dialog/config-dialog.component.scss

@@ -0,0 +1,5 @@
+.container {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+}

src/app/components/project-map/context-menu/dialogs/config-dialog/config-dialog.component.ts

@@ -0,0 +1,17 @@
+import { Component, Input } from '@angular/core';
+import { MatDialogRef } from '@angular/material';
+
+@Component({
+    selector: 'app-config-dialog',
+    templateUrl: './config-dialog.component.html',
+    styleUrls: ['./config-dialog.component.scss']
+})
+export class ConfigDialogComponent {
+    constructor(
+        public dialogRef: MatDialogRef<ConfigDialogComponent>,
+    ) {}
+
+    close(fileType: string) {
+        this.dialogRef.close(fileType);
+    }
+}