Removing stepper

src/app/components/projects/import-project-dialog/import-project-confirmation-dialog/import-project-confirmation-dialog.component.ts

@@ -1,8 +1,5 @@
-import { Component, OnInit, Inject, ViewChild } from '@angular/core';
+import { Component, OnInit, Inject } from '@angular/core';
-import { MatStepper, MatDialogRef, MAT_DIALOG_DATA } from "@angular/material";
+import { MatDialogRef, MAT_DIALOG_DATA } from "@angular/material";
-import { FileUploader, ParsedResponseHeaders, FileItem } from 'ng2-file-upload';
-import { v4 as uuid } from 'uuid';
-import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
 import { Project } from '../../../../models/project';
 
 @Component({

src/app/components/projects/import-project-dialog/import-project-dialog.component.html

@@ -1,7 +1,5 @@
 <h1 mat-dialog-title>Import project</h1>
-<mat-horizontal-stepper #stepper [linear]="true">
+<div [hidden]="isFirstStepCompleted">
-  <mat-step label="Choose file" editable="false" completed="false">
-    <div>
   <form [formGroup]="projectNameForm" class="file-name-form">
     <input type="file" accept=".gns3project, .gns3p" class="non-visible" #file (change)="uploadProjectFile($event)" ng2FileSelect [uploader]="uploader"/>
     <button mat-raised-button color="primary" (click)="file.click()" class="file-button">Choose file</button>
@@ -18,9 +16,8 @@
       <button mat-button [disabled]="!isImportEnabled" (click)="onImportClick()" tabindex="2" mat-raised-button color="primary">Import</button>
     </div>
   </form>
-    </div>
+</div>
-  </mat-step>
+<div [hidden]="!isFirstStepCompleted">
-  <mat-step label="Progress" editable="false" completed="false">
   <div class="progress">
     <div class="progress-bar" role="progressbar" [ngStyle]="{ 'width': uploader.progress + '%' }"></div>
   </div>
@@ -30,5 +27,4 @@
   <div mat-dialog-actions>
     <button mat-button [disabled]="!isFinishEnabled" (click)="onNoClick()" tabindex="2" mat-raised-button color="primary">Finish</button>
   </div>
-  </mat-step>
+</div>
-</mat-horizontal-stepper>

src/app/components/projects/import-project-dialog/import-project-dialog.component.spec.ts

@@ -36,7 +36,7 @@ export class MockedProjectService {
     }
 }
 
-describe('ImportProjectDialogComponent', () => {
+fdescribe('ImportProjectDialogComponent', () => {
     let component: ImportProjectDialogComponent;
     let fixture: ComponentFixture<ImportProjectDialogComponent>;
     let server: Server;
@@ -160,26 +160,22 @@ describe('ImportProjectDialogComponent', () => {
         expect(fileSelectDirective.uploader.queue[0].url).toContain("newProject");
     });
 
-    it('should navigate to next step after clicking import', () => {
+    it('should navigate to progress view after clicking import', () => {
         let fileItem = new FileItem(fileSelectDirective.uploader, new File([],"fileName"),{});
         fileSelectDirective.uploader.queue.push(fileItem);
 
-        spyOn(component.stepper, "next");
-
         component.onImportClick();
 
-        expect(component.stepper.next).toHaveBeenCalled();
+        expect(component.isFirstStepCompleted).toBe(true);
     });
 
     it('should detect if file input is empty', () => {
         component.projectNameForm.controls['projectName'].setValue("");
         fixture.detectChanges();
-        spyOn(component.stepper, "next");
         spyOn(fileSelectDirective.uploader, 'uploadItem');
 
         component.onImportClick();
 
-        expect(component.stepper.next).not.toHaveBeenCalled();
         expect(fileSelectDirective.uploader.uploadItem).not.toHaveBeenCalled();
         expect(component.projectNameForm.valid).toBeFalsy();
     });
@@ -187,12 +183,10 @@ describe('ImportProjectDialogComponent', () => {
     it('should sanitize file name input', () => {
         component.projectNameForm.controls['projectName'].setValue("[][]");
         fixture.detectChanges();
-        spyOn(component.stepper, "next");
         spyOn(fileSelectDirective.uploader, 'uploadItem');
 
         component.onImportClick();
 
-        expect(component.stepper.next).not.toHaveBeenCalled();
         expect(fileSelectDirective.uploader.uploadItem).not.toHaveBeenCalled();
         expect(component.projectNameForm.valid).toBeFalsy();
     });

src/app/components/projects/import-project-dialog/import-project-dialog.component.ts

@@ -35,8 +35,7 @@ export class ImportProjectDialogComponent implements OnInit {
     resultMessage : string = "The project is being imported... Please wait";
     projectNameForm: FormGroup;
     submitted: boolean = false;
-
+    isFirstStepCompleted: boolean = false;
-    @ViewChild('stepper') stepper: MatStepper;
   
     constructor(
       private dialog: MatDialog,
@@ -98,8 +97,7 @@ export class ImportProjectDialogComponent implements OnInit {
         const url = this.prepareUploadPath();
         this.uploader.queue.forEach(elem => elem.url = url);
 
-        this.stepper.selected.completed = true;
+        this.isFirstStepCompleted = true;
-        this.stepper.next();
 
         const itemToUpload = this.uploader.queue[0];
         this.uploader.uploadItem(itemToUpload);