add top level arrays for $ref, arrays of primitive values

packages/api-explorer/__tests__/ResponseSchema.test.jsx

@@ -75,7 +75,7 @@ test('should contain ResponseSchemaBody element if $ref exist', () => {
   expect(responseSchema.text()).toContain('ResponseSchemaBody');
 });
 
-test('should contain ResponseSchemaBody element if $ref not exist', () => {
+test('should not contain ResponseSchemaBody element if $ref not exist', () => {
   const testProps = {
     operation: new Operation(
       {},

packages/api-explorer/__tests__/ResponseSchemaBody.test.jsx

@@ -2,6 +2,7 @@ const React = require('react');
 const { shallow } = require('enzyme');
 
 const ResponseSchemaBody = require('../src/ResponseSchemaBody');
+const flattenResponseSchema = require('../src/ResponseSchemaBody').flattenResponseSchema;
 const Oas = require('../src/lib/Oas');
 const petstore = require('./fixtures/petstore/oas.json');
 
@@ -22,21 +23,6 @@ test('display object properties in the table', () => {
   expect(responseSchemaBody.find('td').text()).toEqual('string');
 });
 
-test('display object properties in the table', () => {
-  const schema = {
-    type: 'object',
-    properties: {
-      a: {
-        type: 'string',
-      },
-    },
-  };
-  const responseSchemaBody = shallow(<ResponseSchemaBody oas={oas} schema={schema} />);
-
-  expect(responseSchemaBody.find('th').text()).toContain('a');
-  expect(responseSchemaBody.find('td').text()).toEqual('string');
-});
-
 test('display properties if object contains $ref type', () => {
   const schema = {
     type: 'object',
@@ -50,38 +36,6 @@ test('display properties if object contains $ref type', () => {
       category: {
         $ref: '#/components/schemas/Category',
       },
-      name: {
-        type: 'string',
-        example: 'doggie',
-      },
-      photoUrls: {
-        type: 'array',
-        xml: {
-          name: 'photoUrl',
-          wrapped: true,
-        },
-        items: {
-          type: 'string',
-        },
-      },
-      tags: {
-        type: 'array',
-        xml: {
-          name: 'tag',
-          wrapped: true,
-        },
-        items: {
-          $ref: '#/components/schemas/Tag',
-        },
-      },
-      status: {
-        type: 'string',
-        description: 'pet status in the store',
-        enum: ['available', 'pending', 'sold'],
-      },
-    },
-    xml: {
-      name: 'Pet',
     },
   };
   const responseSchemaBody = shallow(<ResponseSchemaBody oas={oas} schema={schema} />);
@@ -92,3 +46,25 @@ test('display properties if object contains $ref type', () => {
       .filter(a => a === 'category.name').length,
   ).toBe(1);
 });
+
+test('should flatten array ', () => {
+  const responseSchema = {
+    type: 'object',
+    properties: {
+      category: {
+        type: 'array',
+        items: {
+          type: 'string',
+          properties: null,
+        },
+      },
+    },
+  };
+  expect(flattenResponseSchema(responseSchema)).toEqual([
+    {
+      name: 'category',
+      type: 'array of string',
+      description: undefined,
+    },
+  ]);
+});

packages/api-explorer/src/ResponseSchema.jsx

@@ -45,6 +45,13 @@ class ResponseSchema extends React.Component {
     if (content && content['application/xml'].schema && content['application/xml'].schema.$ref) {
       return findSchemaDefinition(content['application/xml'].schema.$ref, oas);
     }
+    if (content['application/xml'] && content['application/xml'].schema) {
+      return content['application/xml'].schema;
+    }
+    if (content['application/json'] && content['application/json'].schema) {
+      return content['application/json'].schema;
+    }
+
     return null;
   }
 
@@ -93,7 +100,6 @@ class ResponseSchema extends React.Component {
     const { operation, oas } = this.props;
     if (!operation.responses || Object.keys(operation.responses).length === 0) return null;
     const schema = this.getSchema(operation);
-
     return (
       <div className="hub-reference-response-definitions">
         {this.renderHeader()}

packages/api-explorer/src/ResponseSchemaBody.jsx

@@ -6,15 +6,51 @@ const findSchemaDefinition = require('./lib/find-schema-definition');
 
 const flatten = list => list.reduce((a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []);
 function flattenResponseSchema(obj, oas, parent = '') {
+  if (obj.type === 'array' && obj.items && obj.items.$ref) {
+    const value = findSchemaDefinition(obj.items.$ref, oas);
+    return flatten(flattenResponseSchema(value, oas, `| `));
+  }
+
   if (obj && !obj.properties) {
     return [];
   }
   const arrayOfObjects = Object.keys(obj.properties).map(prop => {
     let value = obj.properties[prop];
     const array = [];
+    if (value.type === 'object') {
+      array.push(flattenResponseSchema(value, oas, parent ? `${parent}.${prop}` : `${prop}`));
+    }
+
     if (value.$ref) {
       value = findSchemaDefinition(value.$ref, oas);
-      array.push(flattenResponseSchema(value, oas, prop));
+      array.push(flattenResponseSchema(value, oas, parent ? `${parent}.${prop}` : `${prop}`));
+    }
+
+    if (value.type === 'array' && value.items && value.items.$ref) {
+      array.push({
+        name: parent ? `${parent}.${prop}` : `${prop}`,
+        type: `array of objects`,
+        description: value.description,
+      });
+
+      value = findSchemaDefinition(value.items.$ref, oas);
+      array.push(flattenResponseSchema(value, oas, parent ? `| ${parent}.${prop}` : `${prop}`));
+      return array;
+    }
+
+    if (
+      value.type === 'array' &&
+      value.items &&
+      value.items.type &&
+      value.items.type !== 'object'
+    ) {
+      array.push({
+        name: parent ? `${parent}.${prop}` : `${prop}`,
+        type: `array of ${value.items.type}`,
+        description: value.description,
+      });
+
+      return array;
     }
 
     array.unshift({