const { loading, error, data } = 

  useQuery(GraphQL, { variables: QUERY_VARIABLES, pollInterval: 500 })

const { loading, error, data, refetch, networkStatus } = 

  useQuery(GraphQL, { variables: QUERY_VARIABLES, notifyOnNetworkStatusChange: true })


if (networkStatus === 4) return 'Refetching!'

if (loading) return null

if (error) return `Error! ${error}`


<button onClick={() => refetch()}>Refetch!</button>

const [dog, setDog] = useState(null)
const [getDog, { loading, data }] = useLazyQuery(GET_DOG_PHOTO)


if (data && data.dog) setDog(data.dog);


{dog && <img src={dog.displayImage} />}
<button onClick={() => getDog({ variables: { breed: 'bulldog' } })}>

let input
const [addTodo, { data }] = useMutation(ADD_TODO);


<form
  onSubmit={event => {
    event.preventDefault()
    addTodo({ variables: { type: input.value } })
    input.value = ''
  }}
>
  <input ref={ node => input = node } />
  <button type="submit">Add Todo</button>

const { loading, error, data } = useQuery(GET_TODOS)
const [updateTodo] = useMutation(UPDATE_TODO)


updateTodo({ variables: { id, type: input.value } })

const [addTodo] = useMutation(
    ADD_TODO,
    {
      update(cache, { data: { addTodo } }) {
        const { todos } = cache.readQuery({ query: GET_TODOS })
        cache.writeQuery({ query: GET_TODOS, data: { todos: todos.concat([addTodo]) } })
      }
    }

const [updateTodo, { loading: mutationLoading, error: mutationError }] = useMutation(UPDATE_TODO)

{ mutationLoading && <p>Loading...</p> }
{ mutationError && <p>Error :( Please try again</p> }

// variables

{ [key: string]: any }

// update

(cache: DataProxy, mutationResult: FetchResult)

// refetchQueries

(mutationResult: FetchResult) => Array<{ query: DocumentNode, variables?: TVariables}>

const client = new ApolloClient({
  ...,
  cache: new InMemoryCache({
    ...,
    dataIdFromObject: object => object.id,
  }),
})

const todo = client.readFragment({
  id: '5',
  fragment: gql`
    fragment myTodo on Todo {
      id
      text
      completed
    }
  `,
})

client.writeFragment({
  id: '5',
  fragment: gql`
    fragment myTodo on Todo {
      completed
    }
  `,
  data: { 
    completed: true
  }
})

const query = gql`
  query MyTodoAppQuery {
    todos {
      id
      text
      completed
    }
  }
`

// Get the current to-do list
const data = client.readQuery({ query })

const myNewTodo = {
  id: '6',
  text: 'Start using Apollo Client.',
  completed: false,
  __typename: 'Todo'
}

// Write back to the to-do list and include the new item
client.writeQuery({
  query,
  data: {
    todos: [...data.todos, myNewTodo],
  }
})

const FEED_QUERY = gql`
  query Feed($type: FeedType!, $offset: Int, $limit: Int) {
    currentUser {
      login
    }
    feed(type: $type, offset: $offset, limit: $limit) {
      id
      # ...
    }
  }
`;

const FeedWithData = ({ match }) => (
  <Query
    query={FEED_QUERY}
    variables={{
      type: match.params.type.toUpperCase() || "TOP",
      offset: 0,
      limit: 10
    }}
    fetchPolicy="cache-and-network"
  >
    {({ data, fetchMore }) => (
      <Feed
        entries={data.feed || []}
        onLoadMore={() =>
          fetchMore({
            variables: {
              offset: data.feed.length
            },
            updateQuery: (prev, { fetchMoreResult }) => {
              if (!fetchMoreResult) return prev
              return Object.assign({}, prev, {
                feed: [...prev.feed, ...fetchMoreResult.feed]
              });
            }
          })
        }
      />
    )}
  </Query>
)

const query = gql`
  query Feed($type: FeedType!, $offset: Int, $limit: Int) {
    feed(type: $type, offset: $offset, limit: $limit) @connection(key: "feed", filter: ["type"]) {
      ...FeedEntry
    }
  }
`


client.writeQuery({
  query: gql`
    query Feed($type: FeedType!) {
      feed(type: $type) @connection(key: "feed", filter: ["type"]) {
        id
      }
    }
  `,
  variables: {
    type: "top",
  },
  data: {
    feed: [],
  },
})

query ListView {
  books {
    __typename
    id
    title
    abstract
  }
}


query DetailView {
  book(id: $id) {
    __typename
    id
    title
    abstract
  }
}


const cache = new InMemoryCache({
  cacheRedirects: {
    Query: {
      book: (_, args, { getCacheKey }) =>
        getCacheKey({ __typename: 'Book', id: args.id })
    }
  }
})


cacheRedirects: {
  Query: {
    books: (_, args, { getCacheKey }) =>
      args.ids.map(id =>
        getCacheKey({ __typename: 'Book', id: id }))
  }
}