unicodeveloper

<User id={id}>
  {({ user }) => (
    <UserStartup user={user}>
      {
        ({ data: { startup, startup: { correspondingRepo: repo }}}) => 
          <UI repo={repo} email={user.email} startup={startup}/>
      }
    </UserStartup>
  )}
</User>

unicodeveloper

export const GetAndShowData = ({ userId }) => (
  <Query query={GET_USER} variables={{ userId }}>
    {({ loading, data: { email } }) => (
      <Query query={GET_HACKERNEWS_STARTUP} variables={{ email }}>
        {({ loading, data: { startup } }) => (
          <Query query={GET_REPO} variables = {{ startup }}>
            {({loading, error, data: { correspondingRepo } }) => {
              if (loading) return <p>Loading...</p>;
              if (error) return <p>Error...</p>;
              return (

unicodeveloper

const GetPosts = () => (
  <Query query={GET_POSTS}>
    {({ loading, error, data }) => {
        if (loading) return "Loading...";
        if (error) return "Error";
        return (
          <div>
            {data.posts.map(post => (
              <p key={post.id}> { post.title } </p>
            ))}

unicodeveloper

const FeedData = ({ match }) => (
  <Query
    query={FEED_QUERY}
    variables={{
      type: match.params.type.toUpperCase() || "TOP",
      offset: 0,
      limit: 10
    }}
    fetchPolicy="cache-and-network"
  >

unicodeveloper

const DogPhoto = ({ breed }) => (
  <Query
    query={GET_DOG_PHOTO}
    variables={{ breed }}
    skip={!breed}
    pollInterval={500}
    notifyOnNetworkStatusChange
  >
    {({ loading, error, data, networkStatus }) => {
      if (networkStatus == 6) return "Polling for data..Stay tuned!";

unicodeveloper

export const GetACar = () => (
  <Query query={GET_A_CAR} notifyOnNetworkStatusChange>
    {({ loading, error, data, refetch, networkStatus }) => {
      if (networkStatus === 4) return "Refetching...";
      if (loading) return <p>Loading...</p>;
      if (error) return <p>Error...</p>;

      return (
        <div>
          <p> Color: {data.car.color} </p>

unicodeveloper

import React from 'react';
import { Mutation } from 'react-apollo';
import { adopt } from 'react-adopt';
import { gql } from 'apollo-boost';

const INCREASE_COUNT = gql`
  mutation increaseCount {
    increaseCount {
      id
      currentCount

unicodeveloper

import React from 'react'
import { render } from 'react-dom'
import { adopt } from 'react-adopt'
import { Value } from 'react-powerplug'

const Composed = adopt({
  greet: ({ initialGreet, render }) => (
    <Value initial={initialGreet}>{render}</Value>
  ),
  name: <Value initial="John" />,

unicodeveloper

const App = () => (
  <TodoContainer>
    {({ todos, createTodo, deleteTodo }) => /* ... */ }
  </TodoContainer>
)

unicodeveloper

import { gql } from 'apollo-boost'
import { Query, Mutation } from 'react-apollo'
import { adopt } from 'react-adopt'

const ALL_TODOS = gql`
  {
    todos: allTodoes {
      id
      title
      completed