Merge pull request #233 from Authress-Engineering/add-fallback-for-ar…

…ray-titles Display typed arrays item title as array title when not present. fix #231
Authress-Engineering · Feb 8, 2024 · fe0b73d · fe0b73d
2 parents b2fdfcd + ce8b3e8
commit fe0b73d
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 7 deletions.
diff --git a/src/components/schema-table.js b/src/components/schema-table.js
@@ -114,7 +114,8 @@ export default class SchemaTable extends LitElement {
 
   /* eslint-disable indent */
   render() {
-    const displayLine = [this.data?.['::title'], this.data?.['::description']].filter(d => d).join(' - ');
+    const title = this.data?.['::title'] || this.data?.['::type'] === 'array' && this.data?.['::props']?.['::title'] && `[${this.data?.['::props']?.['::title']}]`;
+    const displayLine = [title, this.data?.['::description']].filter(d => d).join(' - ');
 
     const { result, keyLabelMaxCharacterLength, typeMaxCharacterLength } = this.data ? this.generateTree(this.data['::type'] === 'array' ? this.data['::props'] : this.data, this.data['::type']) : {};
     return html`

diff --git a/src/components/schema-tree.js b/src/components/schema-tree.js
@@ -117,7 +117,9 @@ export default class SchemaTree extends LitElement {
 
   /* eslint-disable indent */
   render() {
-    const displayLine = [this.data?.['::title'], this.data?.['::description']].filter(d => d).join(' - ');
+    const title = this.data?.['::title'] || this.data?.['::type'] === 'array' && this.data?.['::props']?.['::title'] && `[${this.data?.['::props']?.['::title']}]`;
+    const displayLine = [title, this.data?.['::description']].filter(d => d).join(' - ');
+
     return html`
       <div class="tree ${this.interactive ? 'interactive' : ''}">
         <div class="toolbar">

diff --git a/src/templates/components-template.js b/src/templates/components-template.js
@@ -70,8 +70,7 @@ export function getComponentInfo(componentKeyId) {
 }
 
 export default function componentsTemplate() {
-  return html`
-  ${this.resolvedSpec.components.map((component) => {
+  return this.resolvedSpec.components.map((component) => {
     const componentInfo = getComponentInfo(component.componentKeyId);
     return html`
       <div id="cmp--${componentInfo.name.toLowerCase()}" class='regular-font section-gap--focused-mode observe-me' style="padding-bottom: 0">
@@ -84,8 +83,6 @@ export default function componentsTemplate() {
         ${component.subComponents.filter(c => c.expanded).map((sComponent) => componentBodyTemplate.call(this, sComponent))}
       </div>
     `;
-  })};
-}
-`;
+  });
 }
 /* eslint-enable indent */