Enable using substitution mapping type directly

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

2 files changed, 41 insertions, 6 deletions

diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
index 1d8a01d4c8..17c67f4929 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
@@ -29,7 +29,8 @@
                             [readonly]="isReadonly || resourceIsReadonly"
                             [isLoading]="loadingProperties || savingChangedData"
                             [hasDeclareOption]="true"
-                            [showDelete]="!isReadOnly && isSelf()"
+                            [showDelete]="!isReadonly && isSelf()"
+                            [disablePropertyValue] = "disablePropertyValue()"
                             (propertyChanged)="dataChanged($event)"
                             (propertySelected)="propertySelected($event)"
                             (selectPropertyRow)="selectPropertyRow($event)"
@@ -38,14 +39,15 @@
                             (updateCheckedChildPropertyCount)="updateCheckedChildPropertyCount($event)"
                             (togggleToscaBtn)="togggleToscaBtn($event)"
                             (selectInstanceRow)="selectInstanceRow($event)"
-                            (deleteProperty)="deleteProperty($event)">
+                            (deleteProperty)="deleteProperty($event)"
+                        >
                         </properties-table>
                     </tab>
                     <tab tabTitle="Inputs" [show]="isSelf()">
                         <inputs-table class="properties-table"
                             [fePropertiesMap]="instanceFePropertiesMap"
                             [readonly]="isReadonly"
-                            [showDelete]="!isReadOnly && isSelf()"
+                            [showDelete]="!isReadonly && isSelf()"
                             [inputs]="inputs | searchFilter:'name':searchQuery"
                             [instanceNamesMap]="componentInstanceNamesMap"
                             [componentInstancePropertyMap]="componentInstancePropertyMap"
@@ -90,7 +92,7 @@
         </div>
         <div class="right-column">
             <div *ngIf="!isReadonly && !isInputsTabSelected" class="add-btn"
-                 (click)="addProperty(component.model)" data-tests-id="properties-add-button" [ngClass]="{'disabled': !showAddProperties()}">Add Property</div>
+                 (click)="addProperty(component.model)" data-tests-id="properties-add-button" [ngClass]="{'disabled': !showAddProperties()}" >Add Property</div>
             <div *ngIf="!isReadonly && isInputsTabSelected" class="add-btn"
                  (click)="addInput()" [ngClass]="{'disabled': !isSelf()}">Add Input</div>
             <tabs #hierarchyNavTabs tabStyle="simple-tabs" class="gray-border">
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
index a987564df4..834f28ed27 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
@@ -71,6 +71,7 @@ import {TranslateService} from "../../shared/translator/translate.service";
 import {ToscaFunction} from "../../../models/tosca-function";
 import {SubPropertyToscaFunction} from "../../../models/sub-property-tosca-function";
 import {DeclareInputComponent} from "./declare-input/declare-input.component";
+import {ElementService} from "../../services/element.service";
 import {CustomToscaFunction} from "../../../models/default-custom-functions";
 import {ToscaFunctionType} from "../../../models/tosca-function-type.enum";
 
@@ -128,6 +129,7 @@ export class PropertiesAssignmentComponent {
     selectedInstance_FlattenCapabilitiesList: Capability[];
     componentInstancePropertyMap : PropertiesGroup;
     defaultInputName: string;
+    doNotExtendBaseType: boolean;
 
     @ViewChild('hierarchyNavTabs') hierarchyNavTabs: Tabs;
     @ViewChild('propertyInputTabs') propertyInputTabs: Tabs;
@@ -150,7 +152,8 @@ export class PropertiesAssignmentComponent {
                 private modalService: ModalService,
                 private keysPipe: KeysPipe,
                 private topologyTemplateService: TopologyTemplateService,
-                private translateService: TranslateService) {
+                private translateService: TranslateService,
+                private service: ElementService) {
 
         this.instanceFePropertiesMap = new InstanceFePropertiesMap();
         /* This is the way you can access the component data, please do not use any data except metadata, all other data should be received from the new api calls on the first time
@@ -236,7 +239,19 @@ export class PropertiesAssignmentComponent {
         }, error => {
             this.loadingInstances = false;
         }); //ignore error
+        let modelName = this.component.model ? this.component.model : null;
+        const categoryName= this.component.categories[0].name;
+        if (this.component.categories[0].name != null && this.component.model != null) {
+            this.service.getCategoryBaseTypes(categoryName, modelName).subscribe((response: ListBaseTypesResponse) => {
+                this.doNotExtendBaseType = response.doNotExtendBaseType;
+                this.loadingProperties = false;
 
+            }, error => {
+                //ignore error
+            }, () => {
+                this.loadingProperties = false;
+            });
+        }
         this.stateChangeStartUnregister = this.$scope.$on('$stateChangeStart', (event, toState, toParams) => {
             // stop if has changed properties
             if (this.hasChangedData) {
@@ -251,7 +266,7 @@ export class PropertiesAssignmentComponent {
       this.loadDataTypesByComponentModel(this.component.model);
     }
 
-    ngOnDestroy() {
+    ngOnDestroy(){
         this.eventListenerService.unRegisterObserver(EVENTS.ON_LIFECYCLE_CHANGE);
         this.stateChangeStartUnregister();
     }
@@ -278,8 +293,26 @@ export class PropertiesAssignmentComponent {
     showAddProperties = (): boolean => {
         if (this.component.isService() && !(<Service>this.component).isSubstituteCandidate()) {
             return false;
+        } else if (this.hideAddProperties()) {
+            return false;
         }
         return this.isSelf();
+
+    }
+
+    hideAddProperties = (): boolean => {
+        if (this.component.isService() && this.doNotExtendBaseType && this.isSelf) {
+            return true;
+        }
+            return false;
+
+    }
+
+    disablePropertyValue = () : boolean => {
+        if (this.component.isService() && this.doNotExtendBaseType){
+            return true;
+        }
+        return false;
     }
 
     getServiceProperties() {