Option to choose project name added

src/app/app.module.ts

@@ -235,6 +235,7 @@ import { TracengTemplatesComponent } from './components/preferences/traceng/trac
 import { TracengService } from './services/traceng.service';
 import { TracengTemplateDetailsComponent } from './components/preferences/traceng/traceng-template-details/traceng-template-details.component';
 import { QemuImageCreatorComponent } from './components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component';
+import { ChooseNameDialogComponent } from './components/projects/choose-name-dialog/choose-name-dialog.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -396,7 +397,8 @@ if (environment.production) {
     TracengPreferencesComponent,
     TracengTemplatesComponent,
     TracengTemplateDetailsComponent,
-    QemuImageCreatorComponent
+    QemuImageCreatorComponent,
+    ChooseNameDialogComponent
   ],
   imports: [
     BrowserModule,
@@ -512,7 +514,8 @@ if (environment.production) {
     ConfiguratorDialogDockerComponent,
     ConfiguratorDialogNatComponent,
     ConfiguratorDialogTracengComponent,
-    QemuImageCreatorComponent
+    QemuImageCreatorComponent,
+    ChooseNameDialogComponent
   ],
   bootstrap: [AppComponent]
 })

src/app/components/projects/choose-name-dialog/choose-name-dialog.component.html

@@ -0,0 +1,12 @@
+<h1 mat-dialog-title>Please choose name for exporting project</h1>
+
+<div class="modal-form-container">
+    <mat-form-field class="form-field">
+        <input matInput placeholder="Project name" [(ngModel)]="name" type="text">
+    </mat-form-field>
+</div>
+
+<div mat-dialog-actions>
+    <button mat-button (click)="onCloseClick()" color="accent">Cancel</button>
+    <button mat-button (click)="onSaveClick()" tabindex="2" mat-raised-button color="primary">Apply</button>
+</div>

src/app/components/projects/choose-name-dialog/choose-name-dialog.component.scss

@@ -0,0 +1,3 @@
+.form-field {
+    width: 100%;
+}

src/app/components/projects/choose-name-dialog/choose-name-dialog.component.ts

@@ -0,0 +1,36 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { MatDialogRef } from '@angular/material';
+import { Server } from '../../../models/server';
+import { ProjectService } from '../../../services/project.service';
+import { Project } from '../../../models/project';
+
+
+@Component({
+    selector: 'app-choose-name-dialog',
+    templateUrl: './choose-name-dialog.component.html',
+    styleUrls: ['./choose-name-dialog.component.scss']
+})
+export class ChooseNameDialogComponent implements OnInit {
+    @Input() server: Server;
+    @Input() project: Project
+    name: string;
+
+    constructor(
+        public dialogRef: MatDialogRef<ChooseNameDialogComponent>,
+        private projectService: ProjectService
+    ) {}
+
+    ngOnInit() {
+        this.name = this.project.name;
+    }
+
+    onCloseClick() {
+        this.dialogRef.close();
+    }
+
+    onSaveClick() {
+        this.projectService.duplicate(this.server, this.project.project_id, this.name).subscribe(() => {
+            this.dialogRef.close();
+        });
+    }
+}

src/app/components/projects/projects.component.ts

@@ -16,6 +16,7 @@ import { ProgressService } from '../../common/progress/progress.service';
 
 import { ImportProjectDialogComponent } from './import-project-dialog/import-project-dialog.component';
 import { AddBlankProjectDialogComponent } from './add-blank-project-dialog/add-blank-project-dialog.component';
+import { ChooseNameDialogComponent } from './choose-name-dialog/choose-name-dialog.component';
 
 @Component({
   selector: 'app-projects',
@@ -110,7 +111,14 @@ export class ProjectsComponent implements OnInit {
   }
 
   duplicate(project: Project) {
-    this.projectService.duplicate(this.server, project.project_id, project.name).subscribe(() => {
+    const dialogRef = this.dialog.open(ChooseNameDialogComponent, {
+      width: '400px',
+      autoFocus: false
+    });
+    let instance = dialogRef.componentInstance;
+    instance.server = this.server;
+    instance.project = project;
+    dialogRef.afterClosed().subscribe(() => {
       this.refresh();
     });
   }