Using Apollo with Typescript, modified from -- https://www.apollographql.com/docs/react/recipes/static-typing.html

Users.tsx

import React, { Component } from "react";
import gql from "graphql-tag";
import { graphql, ChildDataProps } from "react-apollo";

type Response = {
  users: [User];
};

type Variables = {
  q: string;
};

type InputProps = {
  q: string;
};

type UserChildProps = ChildDataProps<InputProps, Response, Variables>;


class UsersResult extends Component<UserChildProps, { }> {
  render() {
    const { loading, error, users } = this.props.data;
    if (loading) {
      return <h4>Loading...</h4>;
    }
    if (error) {
      return <h4>{error.message}</h4>;
    }
    return <div />;
  }
}
const UserSearch = gql`
  query UserSearch {
    user($q: String!) @rest(type: "User", path: "/users?{args.q}&{context.apiKey}") {
      id,
      city,
      company,
      country,
      created_on,
      display_name,
      fields,
      first_name,
      images,
      last_name,
      occupation,
      state,
      url,
      username
    }
  }
`;
type User = {
  id: string;
  city: string;
  company: string;
  country: string;
  created_on: Date;
  display_name: string;
  fields: string[];
  first_name: string;
  images: {
    [key: string]: string;
  };
  last_name: string;
  occupation: string;
  state: string;
  url: string;
  username: string;
};

const UsersResultQuery = graphql<InputProps, Response, Variables, UserChildProps>(UserSearch, {
  options: ({ q }) => {
    return { variables: { q } };
  }
})(UsersResult);