import 'package:angel_framework/angel_framework.dart';
import 'package:http_parser/http_parser.dart';
/// Returns a simple [RequestHandler] that renders the GraphiQL visual interface for GraphQL.
///
/// By default, the interface expects your backend to be mounted at `/graphql`; this is configurable
/// via [graphQLEndpoint].
RequestHandler graphiQL(
{String graphQLEndpoint = '/graphql', String subscriptionsEndpoint}) {
return (req, res) {
res
..contentType = new MediaType('text', 'html')
..write(renderGraphiql(
graphqlEndpoint: graphQLEndpoint,
subscriptionsEndpoint: subscriptionsEndpoint))
..close();
};
}
String renderGraphiql(
{String graphqlEndpoint = '/graphql', String subscriptionsEndpoint}) {
var subscriptionsScripts = '',
subscriptionsFetcher = '',
fetcherName = 'graphQLFetcher';
if (subscriptionsEndpoint != null) {
fetcherName = 'subscriptionsFetcher';
subscriptionsScripts = '''
''';
subscriptionsFetcher = '''
let subscriptionsClient = new window.SubscriptionsTransportWs.SubscriptionClient('$subscriptionsEndpoint', {
reconnect: true
});
let $fetcherName = window.GraphiQLSubscriptionsFetcher.graphQLFetcher(subscriptionsClient, graphQLFetcher);
''';
}
return '''
Angel GraphQL
$subscriptionsScripts
'''
.trim();
}