Haxe + Apollo: getting started

README.md

Basic apollo setup

Apollo client

First, you'll need an ApolloClient instance. You can setup one any way you want via ApolloClient. I use this (see DefaultClient.hx) kind of config to get a "default" client, and this might end up in haxe apollo lib in the future.

Apollo provider

Then you'll need a Provider to be able to use your client from anywhere. Near the root of your component tree, add this:

var client = new DefaultClient(uri);

<ApolloProvider client={client}>
	{/* Inner component tree */}
</ApolloProvider>

Queries

Example query, using GraphQLMeta helper and an external graphql query file:

// Note: my-query.gql path is relative to MyComponent
@:graphql('my-query.gql')
class MyComponent extends ReactComponent {
	override function render():ReactFragment {
		return jsx(
			<Query query={query}>
				{function(result:QueryResult<Any, Any>) {
					if (result.loading) return "Loading...";
					if (result.error != null) return "Error!";

					trace(result.data);
					return "Ok!";
				}}
			</Query>
		);
	}
}

DefaultClient.hx

import apollo.client.ApolloClient;
import apollo.cache.inmemory.InMemoryCache;
import apollo.link.ApolloLink;
import apollo.link.http.HttpLink;
import apollo.link.error.ErrorLink;
import apollo.link.error.ErrorResponse;

class DefaultClient extends ApolloClient<Any> {
	public function new(uri:String) {
		super({
			queryDeduplication: false,
			link: ApolloLink.from([
				new ErrorLink(function(errors:ErrorResponse) {
					if (errors.graphQLErrors != null) {
						for (err in errors.graphQLErrors) {
							// Handle error
						}
					}

					if (errors.networkError != null) {
						// Handle error
					}
				}),
				new HttpLink({uri: uri, credentials: 'same-origin'})
			]),
			cache: new InMemoryCache(),
			#if debug connectToDevTools: true #end
		});
	}
}