Enhance PropertyDocumentMixin with parent name computation and improve code formatting

Author: alexperez

src/PropertyDocumentMixin.d.ts

@@ -25,7 +25,7 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
    * This is used to select/generate examples according to current body
    * media type. When not set it only renders examples that were defined
    * in API spec file in a form as they were written.
-   * 
+   *
    * @attribute
    */
   mediaType: string;
@@ -55,7 +55,7 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
    * @param range AMF property range object
    * @returns Data type of the property.
    */
-  _computeRangeDataType(range: Object): String|undefined;
+  _computeRangeDataType(range: Object): String | undefined;
 
   /**
    * Computes type from a scalar shape.
@@ -78,7 +78,7 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
    * @param range Range object of current shape.
    * @returns List of Array items.
    */
-  _computeArrayProperties(range: Object): ArrayPropertyItem[]|undefined;
+  _computeArrayProperties(range: Object): ArrayPropertyItem[] | undefined;
 
   /**
    * Computes value for `isUnion` property.
@@ -110,7 +110,7 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
   /**
    * Computes value for `isAnyOf` property.
    * AnyOf type is identified as a `http://www.w3.org/ns/shacl#or`
-   * 
+   *
    * @param range Range object of current shape.
    */
   _computeIsAnyOf(range: Object): boolean
@@ -141,7 +141,7 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
    * @param items Array's items property or a single property
    * @returns Label for the union type.
    */
-  _computeArrayUnionLabel(items: object|object[]): string|undefined;
+  _computeArrayUnionLabel(items: object | object[]): string | undefined;
 
   /**
    * Computes name label for the shape.
@@ -150,7 +150,9 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
    * @param shape The shape of the property.
    * @returns Display name of the property
    */
-  _computeDisplayName(range: Object, shape: Object): string|undefined;
+  _computeDisplayName(range: Object, shape: Object): string | undefined;
+
+  _computeParentName(range: Object, shape: Object): string | undefined;
 
   _computeHasMediaType(mediaType: string): boolean;
 
@@ -159,5 +161,5 @@ interface PropertyDocumentMixin extends AmfHelperMixin {
   _isPropertyReadOnly(property: any): boolean;
   _isReadOnly(property: any): boolean;
 }
-export {PropertyDocumentMixinConstructor};
-export {PropertyDocumentMixin};
+export { PropertyDocumentMixinConstructor };
+export { PropertyDocumentMixin };

src/PropertyDocumentMixin.js

@@ -516,6 +516,31 @@ const mxFunction = (base) => {
       return /** @type string */ (this._getValue(range, coreName));
     }
 
+    _computeParentName(range, shape) {
+      if (!shape || !range) {
+        return undefined;
+      }
+      // let name;
+      if (
+        this._hasType(shape, this.ns.aml.vocabularies.apiContract.Parameter)
+      ) {
+        return /** @type string */ (this._getValue(
+          range,
+          this.ns.aml.vocabularies.core.name
+        ));
+      }
+      if (this._hasType(range, this.ns.w3.shacl.NodeShape)) {
+        return /** @type string */ (this._getValue(
+          shape,
+          this.ns.w3.shacl.name
+        ));
+      }
+      return /** @type string */ (this._getValue(
+        range,
+        this.ns.aml.vocabularies.core.name
+      ));
+    }
+
     _computeHasMediaType(mediaType) {
       return !!mediaType;
     }

src/PropertyShapeDocument.js

@@ -123,7 +123,7 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
       /**
        * A description of the shape to render.
        */
-      shapeDescription: { type: String },      
+      shapeDescription: { type: String },
       /**
        * Computed value, true if description is set.
        */
@@ -319,15 +319,15 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
 
   _shapeRangeChanged(shape, range) {
     this.displayName = this._computeDisplayName(range, shape);
+    this.parentName = this.isObject ? this._computeParentName(range, shape) : undefined;
     this.propertyName = this._computePropertyName(range, shape);
     this.avroValue = this._computeAvroShapeRangeSourceMap(range, shape)
     const {size,namespace,aliases, defaultValue} = this._computeAvroProperties(range, shape)
     this.size = size
     this.namespace = namespace
     this.aliases = aliases
     this.defaultValue = defaultValue
-    
-    
+
     this.hasDisplayName = this._computeHasDisplayName(
       this.displayName,
       this.propertyName
@@ -498,7 +498,7 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
     }catch(_){
       return undefined
     }
-   
+
   }
 
   /**
@@ -518,7 +518,6 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
 
 
 
-  
 
   /**
    * Computes value for `hasDisplayName` property.
@@ -714,6 +713,16 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
     return this._hasType(item, this.ns.aml.vocabularies.shapes.ScalarShape);
   }
 
+  _getParentTypeName() {
+    if (this.isArray) {
+      return 'item'
+    }
+    if(this.isObject){
+      return this.parentName
+    }
+    return this.displayName
+  }
+
   /**
    * @return {TemplateResult|string} Template for a complex shape (object/array/union)
    */
@@ -722,7 +731,7 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
       return '';
     }
     const range = this._resolve(this.range);
-    const parentTypeName = this.isArray ? 'item' : this.displayName;
+    const parentTypeName = this._getParentTypeName();
     return html`<api-type-document
       class="children complex"
       .amf="${this.amf}"
@@ -843,7 +852,6 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
   `;
 }
 
-  
 
   /**
    * @return {TemplateResult|string} Template for the description
@@ -893,7 +901,7 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
       parentTypeName,
       hasParentTypeName
     } = this;
-    
+
     return html` ${hasDisplayName
       ? html`<div class="property-display-name">${displayName}</div>`
       : ''}