Merge from ecomp 718fd196 - Modern UI

Issue-ID: VID-378

Change-Id: I2736b98426e324ec3aa233b034229ba84d99839f
Signed-off-by: Ittay Stern <ittay.stern@att.com>

5 files changed, 238 insertions, 44 deletions

diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.html b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.html
index 91acca0d1..7864808fc 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.html
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.html
@@ -34,7 +34,7 @@
                   [name]="'maximum'">
               </svg-icon>
             </span>
-            <span class="icon-plus" *ngIf="node?.data?.showNodeIcons(node, serviceModelId)?.addIcon">
+            <span class="icon-plus" *ngIf="_store.getState().service.serviceInstance[serviceModelId].action !== 'Delete' && node?.data?.showNodeIcons(node, serviceModelId)?.addIcon">
               <span tooltip="Add" [attr.data-tests-id]="'node-'+node.data.name+'-add-btn'" (click)="onClickAdd(node, serviceModelId)">
                 <i class="fa fa-plus-circle" aria-hidden="true"></i>
               </span>
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.scss b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.scss
index 90c2cd878..62e9be73a 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.scss
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.scss
@@ -168,7 +168,7 @@ available-models-tree {
                 .node-content-wrapper.node-content-wrapper-focused {
                   tree-node-content {
                     > div {
-                      background: #009FDB;
+                      background: #009FDB !important;
                       color: white;
                     }
                   }
@@ -178,7 +178,7 @@ available-models-tree {
                     > div {
                       background: #F2F2F2;
                       &.tree-node-focused:not(.tree-node-disabled) {
-                        background: #009FDB;
+                        background: #009FDB !important;
                         color: white;
                       }
                       span.actions {
@@ -206,6 +206,8 @@ available-models-tree {
                   border-color: #1EB9F3;
                 }
                 .node-content-wrapper-focused{
+                  background: #009FDB !important;
+                  border-color: #1EB9F3;
                   box-shadow: none;
                   tree-node-content {
 
@@ -395,6 +397,7 @@ available-models-tree {
 
   .node-content-wrapper.node-content-wrapper-focused{
      border-color:#1EB9F3 ;
+     background: #009FDB !important;
      tree-node-content > div{
        .vf-type,.model-info,.model-info .property-name {
          color: white;
@@ -410,7 +413,9 @@ available-models-tree {
   }
 
 
-
+  available-models-tree .node-content-wrapper.node-content-wrapper-focused {
+    background: #009FDB !important;
+  }
   .vf-type {
     width: 40px;
     height: 45px;
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.ts
index 31d7b03b8..145ee19da 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.ts
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.component.ts
@@ -25,6 +25,9 @@ import {VnfGroupControlGenerator} from "../../../shared/components/genericForm/f
 import {HighlightPipe} from "../../../shared/pipes/highlight/highlight-filter.pipe";
 import * as _ from 'lodash';
 import {DrawingBoardTreeComponent} from "../drawing-board-tree/drawing-board-tree.component";
+import {ComponentInfoModel} from "../component-info/component-info-model";
+import {ComponentInfoService} from "../component-info/component-info.service";
+import {FeatureFlagsService, Features} from "../../../shared/services/featureFlag/feature-flags.service";
 
 
 @Component({
@@ -72,6 +75,7 @@ export class AvailableModelsTreeComponent {
           value => {
             this.serviceHierarchy = value;
             this.nodes = this._objectToModelTreeService.convertServiceHierarchyModelToTreeNodes(this.serviceHierarchy);
+            this.shouldOpenVRFModal(this.nodes);
           },
           error => {
             console.log('error is ', error)
@@ -102,6 +106,13 @@ export class AvailableModelsTreeComponent {
   };
 
 
+  shouldOpenVRFModal(nodes) :void {
+    const node = this._availableModelsTreeService.shouldOpenVRFModal(nodes, this.serviceModelId, this.store.getState().service);
+    if(!_.isNil(node)){
+      this.onClickAdd(node,  this.serviceModelId);
+    }
+  }
+
   getNodeName(node : ITreeNode, filter : string) {
     return this._highlightPipe.transform(node.data.name ,filter ? filter : '');
   }
@@ -119,6 +130,13 @@ export class AvailableModelsTreeComponent {
     node.expand();
     this._sharedTreeService.setSelectedVNF(null);
     this.highlightInstances.emit(node.data.modelUniqueId);
+    if (FeatureFlagsService.getFlagState(Features.FLAG_1906_COMPONENT_INFO, this.store)) {
+      const serviceHierarchy = this._store.getState().service.serviceHierarchy[this.serviceModelId];
+      const model = node.data.getModel(node.data.name, node.data, serviceHierarchy);
+      const modelInfoItems  = node.data.getInfo(model, null);
+      const componentInfoModel :ComponentInfoModel = this._sharedTreeService.addGeneralInfoItems(modelInfoItems, node.data.componentInfoType, model, null);
+      ComponentInfoService.triggerComponentInfoChange.next(componentInfoModel);
+    }
   }
 
 
@@ -127,7 +145,7 @@ export class AvailableModelsTreeComponent {
     this.isNewObject = isNewObject;
     let data = node.data;
     let dynamicInputs = data.dynamicInputs;
-    let isAlaCarte: boolean = this.serviceHierarchy.service.instantiationType == "A-La-Carte";
+    let isAlaCarte: boolean = this.serviceHierarchy.service.vidNotions.instantiationType == 'ALaCarte';
     let isEcompGeneratedNaming: boolean = data.isEcompGeneratedNaming;
     let type: string = data.type;
     if (!this.store.getState().global.flags['FLAG_SETTING_DEFAULTS_IN_DRAWING_BOARD'] || node.data.type === ServiceNodeTypes.VF ||
@@ -150,7 +168,8 @@ export class AvailableModelsTreeComponent {
           let existVnf = this._store.getState().service.serviceInstance[this.serviceModelId].vnfs;
           if(!_.isNil(existVnf)){
             for(let vnfKey in existVnf){
-              if(existVnf[vnfKey]['modelInfo'].modelUniqueId === node.parent.data.id){
+              const modelUniqueId =  existVnf[vnfKey]['modelInfo'].modelCustomizationId || existVnf[vnfKey]['modelInfo'].modelInvariantId;
+              if(modelUniqueId === node.parent.data.id){
                 this.store.dispatch(createVFModuleInstance(vfModule, node.data.name, this.serviceModelId, null, vnfKey));
                 DrawingBoardTreeComponent.triggerreCalculateIsDirty.next(this.serviceModelId);
               }
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.spec.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.spec.ts
index cf9d04aae..4abc20324 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.spec.ts
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.spec.ts
@@ -1,9 +1,6 @@
-import {TestBed, getTestBed} from '@angular/core/testing';
-import {
-  HttpClientTestingModule,
-  HttpTestingController
-} from '@angular/common/http/testing';
-import {AvailableModelsTreeService, AvailableNodeIcons} from './available-models-tree.service';
+import {getTestBed, TestBed} from '@angular/core/testing';
+import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
+import {AvailableModelsTreeService} from './available-models-tree.service';
 import {ServiceNodeTypes} from "../../../shared/models/ServiceNodeTypes";
 import {DefaultDataGeneratorService} from "../../../shared/services/defaultDataServiceGenerator/default.data.generator.service";
 import {MessageBoxService} from "../../../shared/components/messageBox/messageBox.service";
@@ -63,9 +60,9 @@ describe('Available Models Tree Service', () => {
 
       //  add vfModule with dynamicInputs without defaultValues should return true
       result = service.shouldOpenDialog(ServiceNodeTypes.VFmodule, [{
-        id: '2017488_adiodvpe0_vnf_config_template_version',
+        id: '2017488_pasqualevpe0_vnf_config_template_version',
         type: 'string',
-        name: '2017488_adiodvpe0_vnf_config_template_version',
+        name: '2017488_pasqualevpe0_vnf_config_template_version',
         isRequired: true,
         description: 'VPE Software Version'
       }], true);
@@ -73,9 +70,9 @@ describe('Available Models Tree Service', () => {
 
       // add vfModule with dynamicInputs with defaultValues should return false
       result = service.shouldOpenDialog(ServiceNodeTypes.VFmodule, [{
-        id: '2017488_adiodvpe0_vnf_config_template_version',
+        id: '2017488_pasqualevpe0_vnf_config_template_version',
         type: 'string',
-        name: '2017488_adiodvpe0_vnf_config_template_version',
+        name: '2017488_pasqualevpe0_vnf_config_template_version',
         value: '17.2',
         isRequired: true,
         description: 'VPE Software Version'
@@ -84,6 +81,160 @@ describe('Available Models Tree Service', () => {
     });
   });
 
+
+  test('shouldOpenVRFModal', () => {
+    const nodes = [{
+      "id": "dd024d73-9bd1-425d-9db5-476338d53433",
+      "modelCustomizationId": "dd024d73-9bd1-425d-9db5-476338d53433",
+      "modelVersionId": "9cac02be-2489-4374-888d-2863b4511a59",
+      "modelUniqueId": "dd024d73-9bd1-425d-9db5-476338d53433",
+      "name": "VRF Entry Configuration 0",
+      "tooltip": "VRF",
+      "type": "VRF",
+      "count": 0,
+      "max": 1,
+      "children": [],
+      "disabled": false,
+      "dynamicInputs": [],
+      "isEcompGeneratedNaming": false,
+      "typeName": "VRF",
+      "componentInfoType": "VRF",
+      "getModel" : ()=>{
+        return  {
+          min : 1
+        }
+      }
+    }];
+
+
+    const serviceStore = {
+      "serviceInstance": {
+        "4117a0b6-e234-467d-b5b9-fe2f68c8b0fc": {
+          "action": "Create",
+          "isDirty": false,
+          "vnfs": {},
+          "vrfs": {
+            "VRF Entry Configuration": {
+              "action": "Create",
+              "uuid": "9cac02be-2489-4374-888d-2863b4511a59",
+              "inputs": {},
+              "type": "Configuration",
+              "trackById": "s0z58emiprq",
+              "modelInfo": {
+                "modelInvariantId": "b67a289b-1688-496d-86e8-1583c828be0a",
+                "modelVersionId": "69e09f68-8b63-4cc9-b9ff-860960b5db09",
+                "modelName": "VRF Entry Configuration",
+                "modelVersion": "5.0",
+                "modelCustomizationId": "dd024d73-9bd1-425d-9db5-476338d53433",
+                "modelUniqueId": "dd024d73-9bd1-425d-9db5-476338d53433",
+                "modelCustomizationName": "VRF Entry Configuration",
+                "uuid": "9cac02be-2489-4374-888d-2863b4511a59"
+              },
+              "vpns": {
+                "VRF Entry Configuration vpns 1": {
+                  "action": "Create",
+                  "instanceId": "46fcb25a-e7ba-4d96-99ba-3bb6eae6aba7",
+                  "instanceName": "LPPVPN",
+                  "platformName": "AVPN",
+                  "instanceType": "SERVICE-INFRASTRUCTURE",
+                  "region": "USA,EMEA",
+                  "customerId": "VPN1271",
+                  "modelInfo": {
+                    "modelCustomizationId": null,
+                    "modelInvariantId": null,
+                    "modelVersionId": null
+                  },
+                  "routeTargets": null,
+                  "isSelected": true
+                }
+              },
+              "networks": {
+                "VRF Entry Configuration networks 1": {
+                  "action ": "Create",
+                  "instanceName": "AUK51a_oam_calea_net_0",
+                  "instanceType": "SR-IOV-PROVIDER2-0",
+                  "role": "role-1",
+                  "orchStatus": "Active",
+                  "physicalName": "sriovnet0",
+                  "instanceId": "46fcb25a-e7ba-4d96-99ba-3bb6eae6aba7",
+                  "serviceName": "LPPVPN",
+                  "serv§iceUUID": "VPN1271",
+                  "tenantName": "ecomp_ispt",
+                  "lcpCloudRegionId": "USA,EMEA",
+                  "modelInfo": {
+                    "modelCustomizationId": "46fcb25a-e7ba-4d96-99ba-3bb6eae6aba7",
+                    "modelInvariantId": "46fcb25a-e7ba-4d96-99ba-3bb6eae6aba7",
+                    "modelVersionId": "7010093-df36-4dcb-8428-c3d02bf3f88d",
+                    "modelType": "vpn"
+                  }
+                }
+              }
+            }
+          },
+          "instanceParams": [],
+          "validationCounter": 0,
+          "existingNames": {},
+          "existingVNFCounterMap": {},
+          "existingVRFCounterMap": {},
+          "existingVnfGroupCounterMap": {},
+          "existingNetworksCounterMap": {},
+          "optionalGroupMembersMap": {},
+          "networks": {},
+          "vnfGroups": {},
+          "bulkSize": 1,
+          "service": {
+            "vidNotions": {
+              "instantiationUI": "serviceWithVRF",
+              "modelCategory": "other",
+              "viewEditUI": "serviceWithVRF",
+              "instantiationType": "ALaCarte"
+            },
+            "uuid": "4117a0b6-e234-467d-b5b9-fe2f68c8b0fc",
+            "invariantUuid": "7ee41ce4-4827-44b0-a48e-2707a59905d2",
+            "name": "VRF Service for Test",
+            "version": "1.0",
+            "toscaModelURL": null,
+            "category": "Network L4+",
+            "serviceType": "INFRASTRUCTURE",
+            "serviceRole": "Configuration",
+            "description": "xxx",
+            "serviceEcompNaming": "true",
+            "instantiationType": "A-La-Carte",
+            "inputs": {}
+          },
+          "collectionResources": {},
+          "configurations": {},
+          "fabricConfigurations": {},
+          "serviceProxies": {},
+          "vfModules": {},
+          "volumeGroups": {},
+          "pnfs": {},
+          "isALaCarte": true,
+          "testApi": "VNF_API",
+          "vidNotions": {
+            "instantiationUI": "serviceWithVVRF",
+            "modelCategory": "other",
+            "viewEditUI": "serviceWithVRF",
+            "instantiationType": "ALaCarte"
+          }
+        }
+      }
+    };
+
+    const serviceModelId :string = '4117a0b6-e234-467d-b5b9-fe2f68c8b0fc';
+
+    let result: boolean = service.shouldOpenVRFModal(nodes,  serviceModelId, serviceStore);
+    expect(result).not.toBeNull();
+
+    serviceStore.serviceInstance[serviceModelId].existingVRFCounterMap = {
+      "dd024d73-9bd1-425d-9db5-476338d53433" : 1
+    };
+
+    result = service.shouldOpenVRFModal(nodes,  serviceModelId, serviceStore);
+    expect(result).toBeNull();
+
+  });
+
   function getServiceServiceHierarchy() {
     return JSON.parse(JSON.stringify(
       {
@@ -103,11 +254,11 @@ describe('Available Models Tree Service', () => {
             'inputs': {}
           },
           'vnfs': {
-            'VF_vMee 0': {
+            'VF_vGeraldine 0': {
               'uuid': 'd6557200-ecf2-4641-8094-5393ae3aae60',
               'invariantUuid': '4160458e-f648-4b30-a176-43881ffffe9e',
-              'description': 'VSP_vMee',
-              'name': 'VF_vMee',
+              'description': 'VSP_vGeraldine',
+              'name': 'VF_vGeraldine',
               'version': '2.0',
               'customizationUuid': '91415b44-753d-494c-926a-456a9172bbb9',
               'inputs': {},
@@ -277,54 +428,54 @@ describe('Available Models Tree Service', () => {
                 'sctp-b-egress-dst_end_port': '65535.0'
               },
               'type': 'VF',
-              'modelCustomizationName': 'VF_vMee 0',
+              'modelCustomizationName': 'VF_vGeraldine 0',
               'vfModules': {
-                'vf_vmee0..VfVmee..vmme_vlc..module-1': {
+                'vf_vgeraldine0..VfVgeraldine..vflorence_vlc..module-1': {
                   'uuid': '522159d5-d6e0-4c2a-aa44-5a542a12a830',
                   'invariantUuid': '98a7c88b-b577-476a-90e4-e25a5871e02b',
                   'customizationUuid': '55b1be94-671a-403e-a26c-667e9c47d091',
                   'description': null,
-                  'name': 'VfVmee..vmme_vlc..module-1',
+                  'name': 'VfVgeraldine..vflorence_vlc..module-1',
                   'version': '2',
-                  'modelCustomizationName': 'VfVmee..vmme_vlc..module-1',
+                  'modelCustomizationName': 'VfVgeraldine..vflorence_vlc..module-1',
                   'properties': {'minCountInstances': 0, 'maxCountInstances': null, 'initialCount': 0},
                   'commands': {},
                   'volumeGroupAllowed': false
                 },
-                'vf_vmee0..VfVmee..vmme_gpb..module-2': {
+                'vf_vgeraldine0..VfVgeraldine..vflorence_gpb..module-2': {
                   'uuid': '41708296-e443-4c71-953f-d9a010f059e1',
                   'invariantUuid': '1cca90b8-3490-495e-87da-3f3e4c57d5b9',
                   'customizationUuid': '6add59e0-7fe1-4bc4-af48-f8812422ae7c',
                   'description': null,
-                  'name': 'VfVmee..vmme_gpb..module-2',
+                  'name': 'VfVgeraldine..vflorence_gpb..module-2',
                   'version': '2',
-                  'modelCustomizationName': 'VfVmee..vmme_gpb..module-2',
+                  'modelCustomizationName': 'VfVgeraldine..vflorence_gpb..module-2',
                   'properties': {'minCountInstances': 0, 'maxCountInstances': null, 'initialCount': 0},
                   'commands': {},
                   'volumeGroupAllowed': false
                 },
-                'vf_vmee0..VfVmee..base_vmme..module-0': {
+                'vf_vgeraldine0..VfVgeraldine..base_vflorence..module-0': {
                   'uuid': 'a27f5cfc-7f12-4f99-af08-0af9c3885c87',
                   'invariantUuid': 'a6f9e51a-2b35-416a-ae15-15e58d61f36d',
                   'customizationUuid': 'f8c040f1-7e51-4a11-aca8-acf256cfd861',
                   'description': null,
-                  'name': 'VfVmee..base_vmme..module-0',
+                  'name': 'VfVgeraldine..base_vflorence..module-0',
                   'version': '2',
-                  'modelCustomizationName': 'VfVmee..base_vmme..module-0',
+                  'modelCustomizationName': 'VfVgeraldine..base_vflorence..module-0',
                   'properties': {'minCountInstances': 1, 'maxCountInstances': 1, 'initialCount': 1},
                   'commands': {},
                   'volumeGroupAllowed': true
                 }
               },
               'volumeGroups': {
-                'vf_vmee0..VfVmee..base_vmme..module-0': {
+                'vf_vgeraldine0..VfVgeraldine..base_vflorence..module-0': {
                   'uuid': 'a27f5cfc-7f12-4f99-af08-0af9c3885c87',
                   'invariantUuid': 'a6f9e51a-2b35-416a-ae15-15e58d61f36d',
                   'customizationUuid': 'f8c040f1-7e51-4a11-aca8-acf256cfd861',
                   'description': null,
-                  'name': 'VfVmee..base_vmme..module-0',
+                  'name': 'VfVgeraldine..base_vflorence..module-0',
                   'version': '2',
-                  'modelCustomizationName': 'VfVmee..base_vmme..module-0',
+                  'modelCustomizationName': 'VfVgeraldine..base_vflorence..module-0',
                   'properties': {'minCountInstances': 1, 'maxCountInstances': 1, 'initialCount': 1}
                 }
               }
@@ -370,52 +521,52 @@ describe('Available Models Tree Service', () => {
           },
           'serviceProxies': {},
           'vfModules': {
-            'vf_vmee0..VfVmee..vmme_vlc..module-1': {
+            'vf_vgeraldine0..VfVgeraldine..vflorence_vlc..module-1': {
               'uuid': '522159d5-d6e0-4c2a-aa44-5a542a12a830',
               'invariantUuid': '98a7c88b-b577-476a-90e4-e25a5871e02b',
               'customizationUuid': '55b1be94-671a-403e-a26c-667e9c47d091',
               'description': null,
-              'name': 'VfVmee..vmme_vlc..module-1',
+              'name': 'VfVgeraldine..vflorence_vlc..module-1',
               'version': '2',
-              'modelCustomizationName': 'VfVmee..vmme_vlc..module-1',
+              'modelCustomizationName': 'VfVgeraldine..vflorence_vlc..module-1',
               'properties': {'minCountInstances': 0, 'maxCountInstances': null, 'initialCount': 0},
               'commands': {},
               'volumeGroupAllowed': false
             },
-            'vf_vmee0..VfVmee..vmme_gpb..module-2': {
+            'vf_vgeraldine0..VfVgeraldine..vflorence_gpb..module-2': {
               'uuid': '41708296-e443-4c71-953f-d9a010f059e1',
               'invariantUuid': '1cca90b8-3490-495e-87da-3f3e4c57d5b9',
               'customizationUuid': '6add59e0-7fe1-4bc4-af48-f8812422ae7c',
               'description': null,
-              'name': 'VfVmee..vmme_gpb..module-2',
+              'name': 'VfVgeraldine..vflorence_gpb..module-2',
               'version': '2',
-              'modelCustomizationName': 'VfVmee..vmme_gpb..module-2',
+              'modelCustomizationName': 'VfVgeraldine..vflorence_gpb..module-2',
               'properties': {'minCountInstances': 0, 'maxCountInstances': null, 'initialCount': 0},
               'commands': {},
               'volumeGroupAllowed': false
             },
-            'vf_vmee0..VfVmee..base_vmme..module-0': {
+            'vf_vgeraldine0..VfVgeraldine..base_vflorence..module-0': {
               'uuid': 'a27f5cfc-7f12-4f99-af08-0af9c3885c87',
               'invariantUuid': 'a6f9e51a-2b35-416a-ae15-15e58d61f36d',
               'customizationUuid': 'f8c040f1-7e51-4a11-aca8-acf256cfd861',
               'description': null,
-              'name': 'VfVmee..base_vmme..module-0',
+              'name': 'VfVgeraldine..base_vflorence..module-0',
               'version': '2',
-              'modelCustomizationName': 'VfVmee..base_vmme..module-0',
+              'modelCustomizationName': 'VfVgeraldine..base_vflorence..module-0',
               'properties': {'minCountInstances': 1, 'maxCountInstances': 1, 'initialCount': 1},
               'commands': {},
               'volumeGroupAllowed': true
             }
           },
           'volumeGroups': {
-            'vf_vmee0..VfVmee..base_vmme..module-0': {
+            'vf_vgeraldine0..VfVgeraldine..base_vflorence..module-0': {
               'uuid': 'a27f5cfc-7f12-4f99-af08-0af9c3885c87',
               'invariantUuid': 'a6f9e51a-2b35-416a-ae15-15e58d61f36d',
               'customizationUuid': 'f8c040f1-7e51-4a11-aca8-acf256cfd861',
               'description': null,
-              'name': 'VfVmee..base_vmme..module-0',
+              'name': 'VfVgeraldine..base_vflorence..module-0',
               'version': '2',
-              'modelCustomizationName': 'VfVmee..base_vmme..module-0',
+              'modelCustomizationName': 'VfVgeraldine..base_vflorence..module-0',
               'properties': {'minCountInstances': 1, 'maxCountInstances': 1, 'initialCount': 1}
             }
           },
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.ts
index dc72f8f12..39a3c5070 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.ts
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/available-models-tree/available-models-tree.service.ts
@@ -7,6 +7,8 @@ import {MessageBoxService} from "../../../shared/components/messageBox/messageBo
 import * as _ from "lodash";
 import { SdcUiCommon} from "onap-ui-angular";
 import {SharedTreeService} from "../objectsToTree/shared.tree.service";
+import {VrfModel} from "../../../shared/models/vrfModel";
+import {clearAllGenericModalhelper} from "../../../shared/storeUtil/utils/global/global.actions";
 
 export class AvailableNodeIcons {
    addIcon: boolean;
@@ -16,6 +18,7 @@ export class AvailableNodeIcons {
     this.addIcon = addIcon;
     this.vIcon = vIcon;
   }
+
 }
 
 @Injectable()
@@ -73,4 +76,20 @@ export class AvailableModelsTreeService {
     MessageBoxService.openModal.next(messageBoxData);
   }
 
+  shouldOpenVRFModal(nodes, serviceModelId: string , service)  {
+    for(const node of nodes){
+      if(node.type === 'VRF' && service.serviceInstance[serviceModelId].existingVRFCounterMap && !service.serviceInstance[serviceModelId].existingVRFCounterMap[node.modelUniqueId]){
+        const vrfModel : VrfModel = node.getModel(node.name, node, service.serviceInstance[serviceModelId]);
+        const vrfCounter : number = service.serviceInstance[serviceModelId].existingVRFCounterMap[node.modelUniqueId];
+        console.log('vrfCounter', vrfCounter);
+        if(vrfModel.min > 0 && (_.isNil(vrfCounter) || vrfCounter === 0)){
+          node.data = node;
+          this.store.dispatch(clearAllGenericModalhelper());
+          return node;
+        }
+      }
+    }
+    return null;
+  }
+
 }