diff --git a/src/Explorer.js b/src/Explorer.js index 5f0f918..deb5b30 100644 --- a/src/Explorer.js +++ b/src/Explorer.js @@ -24,6 +24,8 @@ import { isScalarType, isUnionType, isWrappingType, + buildClientSchema, + getIntrospectionQuery, parse, print, } from 'graphql'; @@ -68,6 +70,7 @@ type Props = { query: string, width?: number, title?: string, + fetcher?: any => Promise<{data: any}>, schema?: ?GraphQLSchema, onEdit: string => void, getDefaultFieldNames?: ?(type: GraphQLObjectType) => Array, @@ -1428,12 +1431,14 @@ class RootView extends React.PureComponent { } } -class Explorer extends React.PureComponent { +class Explorer extends React.PureComponent { static defaultProps = { getDefaultFieldNames: defaultGetDefaultFieldNames, getDefaultScalarArgValue: defaultGetDefaultScalarArgValue, }; + state = {schema: this.props.schema}; + _ref: ?any; _resetScroll = () => { const container = this._ref; @@ -1441,13 +1446,32 @@ class Explorer extends React.PureComponent { container.scrollLeft = 0; } }; + _fetchSchema = () => { + const {fetcher} = this.props; + + if (fetcher) { + fetcher({ + query: getIntrospectionQuery() + }).then(result => { + if (this.state.schema !== undefined) { + return; + } + + this.setState({ schema: buildClientSchema(result.data) }); + }); + } + } componentDidMount() { + if (this.state.schema === undefined) { + this._fetchSchema(); + } this._resetScroll(); } _onEdit = (query: string): void => this.props.onEdit(query); render() { - const {schema, query, makeDefaultArg} = this.props; + const {query, makeDefaultArg} = this.props; + const {schema} = this.state; if (!schema) { return (