Generate examples for form inputs/parameters etc...

Authress-Engineering · Jan 13, 2024 · 80e78f6 · 80e78f6
1 parent ebbc44f
commit 80e78f6
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 9 deletions.
diff --git a/mocks/index-schema.json b/mocks/index-schema.json
@@ -59,6 +59,18 @@
                     }
                 },
                 "parameters": [
+                    {
+                        "name": "If-Unmodified-Since",
+                        "in": "header",
+                        "description": "The expected last time the record was modified.",
+                        "required": false,
+                        "schema": {
+                          "type": "string",
+                          "format": "date-time",
+                          "minLength": 1,
+                          "maxLength": 32
+                        }
+                      },
                     {
                         "name": "uri_test",
                         "in": "path",

diff --git a/src/components/api-request.js b/src/components/api-request.js
@@ -134,7 +134,7 @@ export default class ApiRequest extends LitElement {
       if (!param.schema) {
         continue;
       }
-      const paramSchema = getTypeInfo(param.schema, { includeNulls: this.includeNulls });
+      const paramSchema = getTypeInfo(param, { includeNulls: this.includeNulls, enableExampleGeneration: true });
       if (!paramSchema) {
         continue;
       }
@@ -309,7 +309,7 @@ export default class ApiRequest extends LitElement {
 
   exampleListTemplate(param, paramType) {
     const paramName = param.name;
-    const paramSchema = getTypeInfo(param.schema, { includeNulls: this.includeNulls });
+    const paramSchema = getTypeInfo(param, { includeNulls: this.includeNulls });
 
     const examples = generateExample(
       param.examples || param.example && { Example: { value: param.example } } || paramSchema.examples || paramSchema.example && { Example: { value: paramSchema.example } },
@@ -434,7 +434,7 @@ export default class ApiRequest extends LitElement {
       }
       const displayedBodyExample = reqBodyExamples.find(v => v.exampleId === this.selectedRequestBodyExample) || reqBodyExamples[0];
       reqBodyDefaultHtml = html`
-        <div class = 'example-panel border-top pad-top-8'>
+        <div class = 'example-panel pad-top-8'>
           ${reqBodyExamples.length === 1
             ? ''
             : html`

diff --git a/src/components/api-response.js b/src/components/api-response.js
@@ -224,7 +224,7 @@ export default class ApiResponse extends LitElement {
       <table role="presentation" style="border-collapse: collapse; margin-bottom:16px; border:1px solid var(--border-color); border-radius: var(--border-radius)"
         class="small-font-size mono-font">
         ${respHeaders.map((v) => {
-          const typeData = getTypeInfo(v.schema);
+          const typeData = getTypeInfo(v, { enableExampleGeneration: true });
           return html`
             <tr>
               <td style="padding:8px; vertical-align: baseline; min-width:160px; border-top: 1px solid var(--light-border-color); text-overflow: ellipsis;">
@@ -238,7 +238,7 @@ export default class ApiResponse extends LitElement {
                 <div class="m-markdown-small regular-font" >${unsafeHTML(marked(v.description || ''))}</div>
               </td>
               <td style="padding:8px; vertical-align: baseline; border-top: 1px solid var(--light-border-color); text-overflow: ellipsis;">
-                ${typeData?.example || ''}
+                ${typeData?.example || typeData?.default || ''}
               </td>
             </tr>
           `;
@@ -273,7 +273,7 @@ export default class ApiResponse extends LitElement {
         ? html`
           ${mimeRespDetails.examples[0].exampleSummary && mimeRespDetails.examples[0].exampleSummary.length > 80 ? html`<div style="padding: 4px 0"> ${mimeRespDetails.examples[0].exampleSummary} </div>` : ''}
           ${mimeRespDetails.examples[0].exampleDescription ? html`<div class="m-markdown-small" style="padding: 4px 0"> ${unsafeHTML(marked(mimeRespDetails.examples[0].exampleDescription || ''))} </div>` : ''}
-          <syntax-highlighter class='example-panel generic-tree border-top pad-top-8' mime-type="${mimeRespDetails.examples[0].exampleType}" .content="${mimeRespDetails.examples[0].exampleValue}"/>`
+          <syntax-highlighter class='example-panel generic-tree pad-top-8' mime-type="${mimeRespDetails.examples[0].exampleType}" .content="${mimeRespDetails.examples[0].exampleValue}"/>`
         : html`
           <span class = 'example-panel generic-tree ${this.renderStyle === 'read' ? 'border pad-8-16' : 'border-top pad-top-8'}'>
             <select aria-label='response body example' @change='${(e) => this.onSelectExample(e)}'>

diff --git a/src/utils/schema-utils.js b/src/utils/schema-utils.js
@@ -8,11 +8,13 @@ const IS_MISSING_TYPE_INFO_TYPE = '';
 const EXAMPLE_VALUE_FOR_MISSING_TYPE = '';
 
 /* Generates an schema object containing type and constraint info */
-export function getTypeInfo(schema, options = { includeNulls: false }) {
-  if (!schema) {
+export function getTypeInfo(parameter, options = { includeNulls: false, enableExampleGeneration: false }) {
+  if (!parameter) {
     return undefined;
   }
 
+  const schema = Object.assign({}, parameter, parameter.schema);
+
   let dataType = IS_MISSING_TYPE_INFO_TYPE;
   let format = schema.format || schema.items?.format || '';
   if (schema.circularReference) {
@@ -32,14 +34,15 @@ export function getTypeInfo(schema, options = { includeNulls: false }) {
     }
   }
 
+  const examples = schema.examples || schema.example || options?.enableExampleGeneration && getSampleValueByType(schema, null) || '';
   const info = {
     type: dataType,
     format,
     cssType: dataType.replace(/┃.*/g, '').replace(/[^a-zA-Z0-9+\s]/g, '').toLowerCase(),
     pattern: (schema.pattern && !schema.enum) ? schema.pattern.replace(/(^\^)|(\$$)/g, '') : '',
     readOrWriteOnly: schema.readOnly && '🆁' || schema.writeOnly && '🆆' || '',
     deprecated: !!schema.deprecated,
-    example: Array.isArray(schema.example) ? schema.example : (typeof schema.example !== 'undefined' ? `${schema.example}` : ''),
+    example: examples || '',
     default: schema.default || '',
     title: schema.title || '',
     description: schema.description || '',