merge from ecomp a88f0072 - Modern UI

Issue-ID: VID-378
Change-Id: Ibcb23dd27f550cf32ce2fe0239f0f496ae014ff6
Signed-off-by: Ittay Stern <ittay.stern@att.com>

7 files changed, 174 insertions, 0 deletions

diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.html b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.html
new file mode 100644
index 000000000..6fb46c256
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.html
@@ -0,0 +1,5 @@
+<div [attr.data-tests-id]="'error-msg-wrapper'" class="error-msg-wrapper" *ngIf="errorMsgService?.errorMsgObject">
+  <div class="title" [attr.data-tests-id]="'error-msg-title'">{{errorMsgService?.errorMsgObject?.title}}</div>
+  <div class="sub-title" [attr.data-tests-id]="'error-msg-sub-title'">{{errorMsgService?.errorMsgObject?.subtitle}}</div>
+  <div *ngIf="errorMsgService?.errorMsgObject?.description" class="description" [attr.data-tests-id]="'error-msg-description'">{{errorMsgService?.errorMsgObject?.description}}</div>
+</div>
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.scss b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.scss
new file mode 100644
index 000000000..98c7e8480
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.scss
@@ -0,0 +1,22 @@
+.error-msg-wrapper{
+  display: block;
+  border-top: 6px solid #CF2A2A;
+  border-bottom: 1px solid #D2D2D2;
+  padding: 20px 45px;
+  font-family: OpenSans-Regular;
+  font-size: 14px;
+  .title{
+    color: #CF2A2A;
+    margin-bottom: 10px;
+    font-family: OpenSans-SemiBold;
+    font-size: 16px;
+  }
+  .sub-title{
+    color: #CF2A2A;
+    margin-bottom: 5px;
+  }
+  .description{
+    color: #191919;
+  }
+}
+
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.spec.ts b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.spec.ts
new file mode 100644
index 000000000..2ca72c533
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.spec.ts
@@ -0,0 +1,48 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ErrorMsgComponent } from './error-msg.component';
+import {ErrorMsgService} from "./error-msg.service";
+import {ErrorMsgObject} from "./error-msg.model";
+
+describe('ErrorMsgComponent', () => {
+
+  let component: ErrorMsgComponent;
+  let fixture: ComponentFixture<ErrorMsgComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ErrorMsgComponent],
+      providers: [ErrorMsgService]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ErrorMsgComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  test('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  test('should triggerShowError fill error msg object', () => {
+    let errorMsgObj:ErrorMsgObject = new ErrorMsgObject("Title", "SubTitle", "Description")
+    component.errorMsgService.triggerShowError.next(errorMsgObj);
+    let errorMsg = component.errorMsgService.errorMsgObject;
+    expect(errorMsg).toBeDefined();
+    expect(errorMsg.title).toBe('Title');
+    expect(errorMsg.subtitle).toBe('SubTitle');
+    expect(errorMsg.description).toBe('Description');
+  });
+
+  test('should triggerClearError delete error msg object', () => {
+    let errorMsgObj:ErrorMsgObject = new ErrorMsgObject("Title", "SubTitle", "Description")
+    component.errorMsgService.triggerShowError.next(errorMsgObj);
+    let errorMsg = component.errorMsgService.errorMsgObject;
+    expect(errorMsg).toBeDefined();
+    component.errorMsgService.triggerClearError.next();
+    expect(component.errorMsgService.errorMsgObject).toBeNull();
+
+  });
+});
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.ts b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.ts
new file mode 100644
index 000000000..e47a06ca6
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.component.ts
@@ -0,0 +1,28 @@
+import {Component, OnChanges, SimpleChanges} from '@angular/core';
+import {ErrorMsgService} from "./error-msg.service";
+import {ErrorMsgObject} from "./error-msg.model";
+
+@Component({
+  selector: 'error-msg',
+  templateUrl: './error-msg.component.html',
+  styleUrls: ['./error-msg.component.scss']
+})
+
+export class ErrorMsgComponent implements OnChanges {
+
+  errorMsgService: ErrorMsgService;
+  constructor(private _errorMsgService: ErrorMsgService) {
+    this.errorMsgService = _errorMsgService;
+    this._errorMsgService.triggerShowError.subscribe((error: ErrorMsgObject) => {
+      this.errorMsgService.errorMsgObject = error;
+    });
+
+    this._errorMsgService.triggerClearError.subscribe(() => {
+      this.errorMsgService.errorMsgObject = null;
+    });
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+  }
+}
+
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.model.ts b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.model.ts
new file mode 100644
index 000000000..0cdb74290
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.model.ts
@@ -0,0 +1,11 @@
+export class ErrorMsgObject {
+  title: string;
+  subtitle: string;
+  description: string;
+
+  constructor(title: string, subtitle: string, description: string) {
+    this.title = title;
+    this.subtitle = subtitle;
+    this.description = description;
+  }
+}
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.spec.ts b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.spec.ts
new file mode 100644
index 000000000..faaef8d41
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.spec.ts
@@ -0,0 +1,38 @@
+import {TestBed, getTestBed } from '@angular/core/testing';
+import {ErrorMsgService} from "./error-msg.service";
+
+describe('Error msg Service', () => {
+  let injector;
+  let service: ErrorMsgService;
+
+  beforeAll(done => (async () => {
+
+    TestBed.configureTestingModule(
+      {
+        providers: [
+          ErrorMsgService
+        ]
+      });
+    await TestBed.compileComponents();
+    injector = getTestBed();
+    service = injector.get(ErrorMsgService);
+  })().then(done).catch(done.fail));
+
+  test('should return error msg object when call to getScalingErrorObject', () => {
+    let errorMsgObject = service.getScalingErrorObject();
+    expect(errorMsgObject).toBeDefined();
+    expect(errorMsgObject.title).toBe('Error : Too many members');
+    expect(errorMsgObject.subtitle).toBe('One or more VNF groups, marked below, exceeds the maximum allowed number of members to associate');
+    expect(errorMsgObject.description).toBe('Please make sure the total amount of VNF instances is less than that amount.');
+  });
+
+  test('should return error msg object when call to getRetryErrorObject', () => {
+    let errorMsgObject = service.getRetryErrorObject(1);
+    expect(errorMsgObject).toBeDefined();
+    expect(errorMsgObject.title).toBe('ERROR!');
+    expect(errorMsgObject.subtitle).toBe(`Attention: You are currently viewing instances from the MSO. \n 1 of the instances failed, please try again.`);
+    expect(errorMsgObject.description).toBe(null);
+  });
+
+});
+
diff --git a/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.ts b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.ts
new file mode 100644
index 000000000..e1bcd423f
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/error-msg/error-msg.service.ts
@@ -0,0 +1,22 @@
+import {Injectable} from '@angular/core';
+import {Subject} from 'rxjs/Subject';
+import {ErrorMsgObject} from "./error-msg.model";
+
+@Injectable()
+export class ErrorMsgService {
+  triggerShowError: Subject<ErrorMsgObject> = new Subject<ErrorMsgObject>();
+  triggerClearError: Subject<boolean> = new Subject<boolean>();
+  errorMsgObject: ErrorMsgObject = null;
+
+  getScalingErrorObject(): ErrorMsgObject {
+    return new ErrorMsgObject("Error : Too many members",
+      "One or more VNF groups, marked below, exceeds the maximum allowed number of members to associate",
+      "Please make sure the total amount of VNF instances is less than that amount.");
+  }
+
+  getRetryErrorObject(numberOfFailed: number): ErrorMsgObject {
+    return new ErrorMsgObject("ERROR!",
+      `Attention: You are currently viewing instances from the MSO. \n ${numberOfFailed} of the instances failed, please try again.`,
+      null);
+  }
+}