From 7ed84c08488284612db5217a5a3588bc68f36d94 Mon Sep 17 00:00:00 2001
From: ele <elemanhillary@gmail.com>
Date: Fri, 10 Jan 2020 17:01:27 +0200
Subject: [PATCH 1/2] adds documentation for union type

---
 .../graph-ql-explorer-type.js                 | 28 +++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
index f092555d97..846066d4b3 100644
--- a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
+++ b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
@@ -29,6 +29,33 @@ class GraphQLExplorerType extends React.PureComponent<Props> {
     return <MarkdownPreview markdown={type.description || '*no description*'} />;
   }
 
+  renderTypesMaybe() {
+    const { type, onNavigateType } = this.props;
+
+    if (
+      Object.prototype.toString.call(type) !== '[object GraphQLUnionType]' &&
+      Object.prototype.toString.call(type.getTypes) !== '[object Function]'
+    ) {
+      return null;
+    }
+    // $FlowFixMe
+    const types = type.getTypes();
+    return (
+      <React.Fragment>
+        <h2 className="graphql-explorer__subheading">Possible Types</h2>
+        <ul className="graphql-explorer__defs">
+          {Object.keys(types).map(key => {
+            return (
+              <li>
+                <GraphQLExplorerTypeLink onNavigate={onNavigateType} type={types[key]} />
+              </li>
+            );
+          })}
+        </ul>
+      </React.Fragment>
+    );
+  }
+
   renderFieldsMaybe() {
     const { type, onNavigateType } = this.props;
     if (typeof type.getFields !== 'function') {
@@ -92,6 +119,7 @@ class GraphQLExplorerType extends React.PureComponent<Props> {
     return (
       <div className="graphql-explorer__type">
         {this.renderDescription()}
+        {this.renderTypesMaybe()}
         {this.renderFieldsMaybe()}
       </div>
     );

From 35a3a1eab2cf4a533b0d87b77e1244cf54040e4e Mon Sep 17 00:00:00 2001
From: Gregory Schier <gschier1990@gmail.com>
Date: Mon, 10 Feb 2020 13:13:19 -0500
Subject: [PATCH 2/2] Fix lint errors

---
 .../graph-ql-explorer-type.js                 | 28 ++++++++++---------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
index 846066d4b3..c202e87311 100644
--- a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
+++ b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-type.js
@@ -4,6 +4,7 @@ import GraphQLExplorerTypeLink from './graph-ql-explorer-type-link';
 import autobind from 'autobind-decorator';
 import MarkdownPreview from '../markdown-preview';
 import GraphQLExplorerFieldLink from './graph-ql-explorer-field-link';
+import { GraphQLUnionType } from 'graphql';
 import type { GraphQLType, GraphQLField } from 'graphql';
 
 type Props = {
@@ -32,25 +33,26 @@ class GraphQLExplorerType extends React.PureComponent<Props> {
   renderTypesMaybe() {
     const { type, onNavigateType } = this.props;
 
-    if (
-      Object.prototype.toString.call(type) !== '[object GraphQLUnionType]' &&
-      Object.prototype.toString.call(type.getTypes) !== '[object Function]'
-    ) {
+    if (typeof type.getTypes !== 'function') {
       return null;
     }
-    // $FlowFixMe
-    const types = type.getTypes();
+
+    if (!(type instanceof GraphQLUnionType)) {
+      return null;
+    }
+
+    const types = (type: Object).getTypes();
+
+    console.log('UNION TYPE? ', types);
     return (
       <React.Fragment>
         <h2 className="graphql-explorer__subheading">Possible Types</h2>
         <ul className="graphql-explorer__defs">
-          {Object.keys(types).map(key => {
-            return (
-              <li>
-                <GraphQLExplorerTypeLink onNavigate={onNavigateType} type={types[key]} />
-              </li>
-            );
-          })}
+          {types.map(type => (
+            <li key={type.name}>
+              <GraphQLExplorerTypeLink onNavigate={onNavigateType} type={type} />
+            </li>
+          ))}
         </ul>
       </React.Fragment>
     );