graphql-proxy-client

Send proxied actions to arbitrary GraphQL endpoints.

Install

$ yarn add @pi-cubed/graphql-proxy-client

Usage

import React, { Component } from 'react';
import { render } from 'react-dom';
import { Put } from 'typed-ui';
import { Action, ProxyProvider } from '@pi-cubed/graphql-proxy-client';

const Demo = () => (
  <div>
    <h1>graphql-proxy-client Demo</h1>
    <ProxyProvider>
      <Action
        url="http://proxy-graphql.herokuapp.com"
        action="query Q { test }"
      >
        <Put />
      </Action>
    </ProxyProvider>
  </div>
);

render(<Demo />, document.querySelector('#demo'));

API

Members

withAction

TODO docs

Kind: global variable

Action ⇒ Component

Return component outputting the response of the GraphQL action.

Kind: global variable
Returns: Component - A component that displays the response from the action.

| Param | Type | Description | | ---------------- | ------------------------------------------ | ------------------------------- | | props | Object | The component props. | | props.url | string | The GraphQL api endpoint. | | props.action | string | The GraphQL action. | | [props.schema] | GraphQLSchema | The schema for the GraphQL api. | | [props.onChange] | onChange | The data change handler. | | props.client | ApolloClient | The Apollo client. |

Example (Display users' names from GraphQL API)

<ProxyProvider>
  <Action url="http://proxy-graphql.herokuapp.com" action="query Q { test }">
    <Put />
  </Action>
</ProxyProvider>

Action~onChange : function

This callback handles Action change events.

Kind: inner typedef of Action

| Param | Type | | ----- | --------------- | | value | * |

ProxyProvider ⇒ Component

Return the children with an ApolloClient which defaults to point at http://proxy-graphql.herokuapp.com.

Kind: global variable
Returns: Component - An ApolloProvider with a custom client.

| Param | Type | Description | | -------------- | ------------------------- | --------------------- | | props | Object | The component props. | | [props.uri] | ApolloClient | The GraphQL endpoint. | | [props.client] | ApolloClient | The Apollo client. |

Example (Display users' names from GraphQL API)

<ProxyProvider>
  <Action url="https://proxy-graphql.herokuapp.com" action="query Q { test }">
    <Put />
  </Action>
</ProxyProvider>

Maintainers

• Dylan Richardson

License

MIT © Pi Cubed