diff --git a/src/App.js b/src/App.js index c32519e6..6f12e320 100644 --- a/src/App.js +++ b/src/App.js @@ -1,78 +1,44 @@ -import React, { useState } from "react"; -import { gql, useQuery, useMutation } from "@apollo/client"; +import React from "react"; +import { gql, useQuery } from "@apollo/client"; const ALL_PEOPLE = gql` query AllPeople { people { id name - } - } -`; - -const ADD_PERSON = gql` - mutation AddPerson($name: String) { - addPerson(name: $name) { - id - name + happinessLevel } } `; export default function App() { - const [name, setName] = useState(''); const { loading, data, - } = useQuery(ALL_PEOPLE); - - const [addPerson] = useMutation(ADD_PERSON, { - update: (cache, { data: { addPerson: addPersonData } }) => { - const peopleResult = cache.readQuery({ query: ALL_PEOPLE }); - - cache.writeQuery({ - query: ALL_PEOPLE, - data: { - ...peopleResult, - people: [ - ...peopleResult.people, - addPersonData, - ], - }, - }); - }, + } = useQuery(ALL_PEOPLE, { + pollInterval: 1000, + // when notifyOnNetworkStatusChange is false, onCompleted only gets called once. + // changing notifyOnNetworkStatusChange to true causes onCompleted to be called after each successful poll + notifyOnNetworkStatusChange: false, + onCompleted: data => { + console.log('onCompleted was called with this data:', data); + } }); + return (

Apollo Client Issue Reproduction

This application can be used to demonstrate an error in Apollo Client.

-
- - setName(evt.target.value)} - /> - -

Names

{loading ? (

Loading…

) : ( )} diff --git a/src/graphql/schema.js b/src/graphql/schema.js index c1b8adb5..70a3809c 100644 --- a/src/graphql/schema.js +++ b/src/graphql/schema.js @@ -4,6 +4,7 @@ import { GraphQLID, GraphQLString, GraphQLList, + GraphQLInt } from 'graphql'; const PersonType = new GraphQLObjectType({ @@ -11,6 +12,7 @@ const PersonType = new GraphQLObjectType({ fields: { id: { type: GraphQLID }, name: { type: GraphQLString }, + happinessLevel: { type: GraphQLInt }, }, }); @@ -25,7 +27,7 @@ const QueryType = new GraphQLObjectType({ fields: { people: { type: new GraphQLList(PersonType), - resolve: () => peopleData, + resolve: () => peopleData.map(person => ({ ...person, happinessLevel: Math.floor(Math.random() * 101) })), }, }, });