Support Enums in GraphQL documentation explorer (#1787)

* Support Enums in GraphQL documentation explorer

* Remove additional props being passed

packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer-enum.js

@@ -0,0 +1,58 @@
+// @flow
+import * as React from 'react';
+import autobind from 'autobind-decorator';
+import MarkdownPreview from '../markdown-preview';
+import type { GraphQLEnumValue } from 'graphql';
+import { GraphQLEnumType } from 'graphql';
+
+type Props = {|
+  type: GraphQLEnumType,
+|};
+
+@autobind
+class GraphQLExplorerEnum extends React.PureComponent<Props> {
+  renderDescription() {
+    const { type } = this.props;
+    return <MarkdownPreview markdown={type.description || '*no description*'} />;
+  }
+
+  renderValues() {
+    const { type } = this.props;
+
+    const values = type.getValues();
+
+    return (
+      <React.Fragment>
+        <h2 className="graphql-explorer__subheading">Values</h2>
+        <ul className="graphql-explorer__defs">
+          {values.map((value: GraphQLEnumValue) => {
+            const description =
+              value.description ||
+              'This is a long paragraph that is a description for the enum value ' + value.name;
+            return (
+              <li key={value.name}>
+                <span className="selectable bold">{value.name}</span>
+                {description && (
+                  <div className="graphql-explorer__defs__description">
+                    <MarkdownPreview markdown={description} />
+                  </div>
+                )}
+              </li>
+            );
+          })}
+        </ul>
+      </React.Fragment>
+    );
+  }
+
+  render() {
+    return (
+      <div className="graphql-explorer__type">
+        {this.renderDescription()}
+        {this.renderValues()}
+      </div>
+    );
+  }
+}
+
+export default GraphQLExplorerEnum;

packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer.js

@@ -4,21 +4,23 @@ import autobind from 'autobind-decorator';
 import GraphQLExplorerField from './graph-ql-explorer-field';
 import GraphQLExplorerType from './graph-ql-explorer-type';
 import type { GraphQLArgument, GraphQLField, GraphQLSchema, GraphQLType } from 'graphql';
+import { GraphQLEnumType } from 'graphql';
 import GraphQLExplorerSchema from './graph-ql-explorer-schema';
+import GraphQLExplorerEnum from './graph-ql-explorer-enum';
 
 type Props = {
   handleClose: () => void,
   schema: GraphQLSchema | null,
   visible: boolean,
   reference: null | {
-    type: GraphQLType | null,
+    type: GraphQLType | GraphQLEnumType | null,
     argument: GraphQLArgument | null,
     field: GraphQLField<any, any> | null,
   },
 };
 
 type HistoryItem = {
-  currentType: null | GraphQLType,
+  currentType: null | GraphQLType | GraphQLEnumType,
   currentField: null | GraphQLField<any, any>,
 };
 
@@ -37,7 +39,7 @@ class GraphQLExplorer extends React.PureComponent<Props, State> {
     };
   }
 
-  _handleNavigateType(type: GraphQLType) {
+  _handleNavigateType(type: GraphQLType | GraphQLEnumType) {
     this.setState({
       currentType: type,
       currentField: null,
@@ -160,6 +162,8 @@ class GraphQLExplorer extends React.PureComponent<Props, State> {
       child = (
         <GraphQLExplorerField onNavigateType={this._handleNavigateType} field={currentField} />
       );
+    } else if (currentType && currentType instanceof GraphQLEnumType) {
+      child = <GraphQLExplorerEnum type={currentType} />;
     } else if (currentType) {
       child = (
         <GraphQLExplorerType