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 c202e87311..a66b920b71 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,13 +4,14 @@ 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'; +import { GraphQLUnionType, GraphQLInterfaceType, GraphQLObjectType } from 'graphql'; +import type { GraphQLType, GraphQLField, GraphQLSchema } from 'graphql'; type Props = { onNavigateType: (type: Object) => void, onNavigateField: (field: Object) => void, type: GraphQLType, + schema: GraphQLSchema | null, }; @autobind @@ -31,22 +32,31 @@ class GraphQLExplorerType extends React.PureComponent { } renderTypesMaybe() { - const { type, onNavigateType } = this.props; + const { schema, type, onNavigateType } = this.props; - if (typeof type.getTypes !== 'function') { + if (schema === null) { return null; } - if (!(type instanceof GraphQLUnionType)) { + let title = 'Types'; + let types = []; + + if (type instanceof GraphQLUnionType) { + title = 'Possible Types'; + types = schema.getPossibleTypes(type); + } else if (type instanceof GraphQLInterfaceType) { + title = 'Implementations'; + types = schema.getPossibleTypes(type); + } else if (type instanceof GraphQLObjectType) { + title = 'Implements'; + types = type.getInterfaces(); + } else { return null; } - const types = (type: Object).getTypes(); - - console.log('UNION TYPE? ', types); return ( -

Possible Types

+

{title}