Update Interface definition on VFC

Signed-off-by: aribeiro <anderson.ribeiro@est.tech>
Change-Id: I13678c92ae6088016a78554ffaf0da47b82f7e65
Signed-off-by: Vasyl Razinkov <vasyl.razinkov@est.tech>
Issue-ID: SDC-3893
Signed-off-by: andre.schmid <andre.schmid@est.tech>

2 files changed, 23 insertions, 2 deletions

diff --git a/catalog-ui/src/app/models/component-metadata.ts b/catalog-ui/src/app/models/component-metadata.ts
index e135e897de..c79552844d 100644
--- a/catalog-ui/src/app/models/component-metadata.ts
+++ b/catalog-ui/src/app/models/component-metadata.ts
@@ -19,7 +19,7 @@
  */
 
 import { CapabilitiesGroup, RequirementsGroup } from 'app/models';
-import { ComponentType } from 'app/utils';
+import {ComponentState, ComponentType} from 'app/utils';
 import { IMainCategory } from './category';
 import { Metadata } from "app/models/metadata";
 /**
@@ -215,4 +215,8 @@ export class ComponentMetadata implements IComponentMetadata {
     public getTypeUrl(): string {
         return this.componentType === ComponentType.RESOURCE ? 'resources/' : 'services/';
     }
+
+    public isComponentDataEditable(): boolean {
+        return this.lifecycleState !== ComponentState.NOT_CERTIFIED_CHECKOUT;
+    }
 }
diff --git a/catalog-ui/src/app/models/interfaceOperation.ts b/catalog-ui/src/app/models/interfaceOperation.ts
index 9d8ab366a2..0768054df3 100644
--- a/catalog-ui/src/app/models/interfaceOperation.ts
+++ b/catalog-ui/src/app/models/interfaceOperation.ts
@@ -103,6 +103,10 @@ export class BEInterfaceOperationModel {
 }
 
 export class InterfaceOperationModel extends BEInterfaceOperationModel {
+    isCollapsed: boolean = true;
+    isEllipsis: boolean;
+    MAX_LENGTH = 75;
+
     interfaceType: string;
     interfaceId: string;
     operationType: string;
@@ -127,9 +131,22 @@ export class InterfaceOperationModel extends BEInterfaceOperationModel {
     public displayType(): string {
         return displayType(this.interfaceType);
     }
+
+    getDescriptionEllipsis(): string {
+        if (this.isCollapsed && this.description.length > this.MAX_LENGTH) {
+            return this.description.substr(0, this.MAX_LENGTH - 3) + '...';
+        }
+        return this.description;
+    }
+
+    toggleCollapsed(e) {
+        e.stopPropagation();
+        this.isCollapsed = !this.isCollapsed;
+    }
+
 }
 
-export class ComponentInstanceInterfaceModel {
+export class ComponentInterfaceDefinitionModel {
     type: string;
     uniqueId: string;
     operations: Array<InterfaceOperationModel>;