rricard

// ...
import {graphql} from 'react-apollo';
const graphqlDocuments = require('./documents.json');

// ...

const FeedWithData = graphql(graphqlDocuments['Feed.graphql'])(Feed);

// ...

rricard

fragment DescribeHero on Character {
  name
  appearsIn
}

rricard

enum Episode {
  NEWHOPE
  EMPIRE
  JEDI
}

type Character {
  id: ID!
  name: String!
  friends: [Character]

rricard

//  This file was automatically generated and should not be edited.

// The episodes in the Star Wars trilogy
export type Episode =
  "NEWHOPE" | // Star Wars Episode IV: A New Hope, released in 1977.
  "EMPIRE" | // Star Wars Episode V: The Empire Strikes Back, released in 1980.
  "JEDI"; // Star Wars Episode VI: Return of the Jedi, released in 1983.


export interface HeroNameQueryVariables {

rricard

apollo-codegen download http://localhost:8080/graphql --output schema.json

rricard

apollo-codegen generate **/*.graphql --schema schema.json --target ts --output schema.ts

rricard

import {
  HeroNameQueryVariables,
  HeroNameQuery,
} from './schema';

// ...

const variables: HeroNameQueryVariables = {
  episode: 'JARJAR',
};

rricard

fragment DescribeHero on Character {
  name
  appearsIn
  isJarJar
  # [eslint] Cannot query field "isJarJar" on type "Character". (graphql/template-strings)
}

rricard

function Todo({todo, key, onToggle}) {
  const onToggleEvent = `__Todo_${key}_onCheckEvent`;
  window[onToggleEvent] = onToggle;
  return `
    <li>
      <input
        type="checkbox"
        onclick="${onToggleEvent}()"
        ${todo.done ? 'checked' : ''}
      />

rricard

function Todo({todo, onToggle}) {
  return (
    <li>
      <input
        type="checkbox"
        onClick={onToggle}
        checked={todo.done}
      />
      {todo.done ?
        <span style={{textDecoration: 'line-through'}}>{todo.title}</span> :