Enable using substitution mapping type directly

Issue-ID: SDC-4435
Signed-off-by: shikha0203 <shivani.khare@est.tech>
Change-Id: Ia3120eb6f03ad861dc87de64a2cb81a61e048f4e

4 files changed, 14 insertions, 8 deletions

diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
index 038f5f5317..58303a9319 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
@@ -52,13 +52,14 @@
                 [name]="property.name"
                 [path]="property.propertiesName"
                 (elementChanged)="onElementChanged($event)"
-                [readonly]="readonly || property.isDeclared || property.isDisabled || property.isToscaFunction()"
+                [readonly]="readonly || property.isDeclared || property.isDisabled || property.isToscaFunction() || disablePropertyValue"
                 [testId]="'prop-' + propertyTestsId"
                 [declared] = "property.isDeclared"
                 [constraints] = "constraints"
             ></dynamic-element>
         </div>
     </ng-container>
+
     <ng-container *ngIf="!isPropertyFEModel && propType != derivedPropertyTypes.SIMPLE && !property.isDeclared && (!property.isToscaFunction() || (property.isToscaFunction() && property.isChildOfListOrMap && propType != derivedPropertyTypes.SIMPLE))"> <!-- right cell for complex elements, or list complex -->
         <div class="table-cell" *ngIf="propType == derivedPropertyTypes.COMPLEX">{{property.type | contentAfterLastDot }}</div>
         <div class="table-cell" *ngIf="propType == derivedPropertyTypes.MAP && !property.schema.property.isSimpleType">{{property.schema.property.type | contentAfterLastDot }}</div>
@@ -81,6 +82,7 @@
         <dynamic-property
             [selectedPropertyId]="selectedPropertyId"
             [hasDeclareOption]="hasDeclareOption"
+            [disablePropertyValue]="disablePropertyValue"
             [canBeDeclared]="hasDeclareOption && prop.canBeDeclared"
             [property]="prop"
             [rootProperty]="rootProperty || property"
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
index 7be44c3075..b632dddf6f 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
@@ -54,6 +54,7 @@ export class DynamicPropertyComponent {
     @Input() readonly: boolean;
     @Input() hasChildren: boolean;
     @Input() hasDeclareOption:boolean;
+    @Input() disablePropertyValue: boolean;
     @Input() rootProperty: PropertyFEModel;
 
     @Output('propertyChanged') emitter: EventEmitter<void> = new EventEmitter<void>();
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
index 6e4edddeb4..526ccf21ce 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
@@ -75,8 +75,8 @@
                     </div>
                 </div>
                 <!-- Property Value -->
-                <div class="table-cell valueCol">
-                    <!-- [ngClass]="{'filtered':property.name === propertyNameSearchText}" (selectProperty)="propertySelected(property, $event, flatProperty.propertiesName)" [propType]="property.type" [propSchema]="property.schema" [propKey]="" [propValue]="property.value"-->
+                <div class="table-cell valueCol" >
+<!--     [ngClass]="{'filtered':property.name === propertyNameSearchText}" (selectProperty)="propertySelected(property, $event, flatProperty.propertiesName)" [propType]="property.type" [propSchema]="property.schema" [propKey]="" [propValue]="property.value"-->
                     <dynamic-property
                         [selectedPropertyId]="selectedPropertyId"
                         [hasDeclareOption]="hasDeclareOption"
@@ -85,6 +85,7 @@
                         [expandedChildId]="property.expandedChildPropertyId"
                         [propertyNameSearchText]="propertyNameSearchText"
                         [readonly]="readonly"
+                        [disablePropertyValue]="disablePropertyValue"
                         (propertyChanged)="onPropertyChanged(property)"
                         (expandChild)="property.updateExpandedChildPropertyId($event)"
                         (clickOnPropertyRow)="onClickPropertyInnerRow($event, instanceId)"
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
index a0b401386b..2f6cad29fc 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
@@ -19,12 +19,11 @@
  * ============LICENSE_END=========================================================
  */
 
-import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
-import { DerivedFEProperty, InstanceFePropertiesMap, PropertyFEModel } from 'app/models';
+import {Component, EventEmitter, Inject, Input, OnChanges, Output, SimpleChanges} from '@angular/core';
+import { DerivedFEProperty, InstanceFePropertiesMap, PropertyFEModel} from 'app/models';
 import { InstanceFeDetails } from '../../../../models/instance-fe-details';
 import { PropertiesService } from '../../../services/properties.service';
 import { ModalService } from '../../../services/modal.service';
-
 @Component({
     selector: 'properties-table',
     templateUrl: './properties-table.component.html',
@@ -42,7 +41,7 @@ export class PropertiesTableComponent implements OnChanges {
     @Input() hasDeclareOption: boolean;
     @Input() hidePropertyType: boolean;
     @Input() showDelete:boolean;
-
+    @Input() disablePropertyValue:boolean;
     @Output('propertyChanged') emitter: EventEmitter<PropertyFEModel> = new EventEmitter<PropertyFEModel>();
     @Output() selectPropertyRow: EventEmitter<PropertyRowSelectedEvent> = new EventEmitter<PropertyRowSelectedEvent>();
     @Output() updateCheckedPropertyCount: EventEmitter<boolean> = new EventEmitter<boolean>(); // only for hasDeclareOption
@@ -51,6 +50,8 @@ export class PropertiesTableComponent implements OnChanges {
     @Output() deleteProperty: EventEmitter<PropertyFEModel> = new EventEmitter<PropertyFEModel>();
     private selectedPropertyToDelete: PropertyFEModel;
 
+
+
     sortBy: String;
     reverse: boolean;
     direction: number;
@@ -59,7 +60,7 @@ export class PropertiesTableComponent implements OnChanges {
     readonly ascUpperLettersFirst = 1;
     readonly descLowerLettersFirst = -1;
 
-    constructor(private propertiesService: PropertiesService, private modalService: ModalService ) {
+    constructor(private propertiesService: PropertiesService, private modalService: ModalService) {
     }
 
     ngOnChanges(changes: SimpleChanges): void {
@@ -113,6 +114,7 @@ export class PropertiesTableComponent implements OnChanges {
         this.togggleToscaBtn.emit(prop.isSelected);
     };
 
+
     onDeleteProperty = () => {
         this.deleteProperty.emit(this.selectedPropertyToDelete);
         this.modalService.closeCurrentModal();