Stack Overflow
Stack Overflow

Questions tagged [react-apollo]

React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to do server-side rendering.

react-apollo tag should be used for questions that are about the usage of the react-apollo ApolloClient container.

It should be included with the apollostack (and related) tags to clarify that this is the client wrapper being used.

It alleviates the need to use the , which should not be used, unless a person who knows nothing about react-apollo is likely to be able to answer the question.

Related tags

2335 questions
21
votes
4 answers

Apollo duplicates first result to every node in array of edges

I am working on a react app with react-apollo calling data through graphql when I check in browser network tab response it shows all elements of the array different but what I get or console.log() in my app then all elements of array same as the…
Bhaumik Gandhi
  • 223
  • 2
  • 6
21
votes
1 answer

How to set fetchPolicy globally on apollo-client queries?

I have a few mutations that should trigger some refetchQueries, but I need those queries to have a fetchPolicy other than the default. Is there a way to set fetchPolicy globally instead of per query? So to avoid setting fetchPolicy on each query.
Eduardo Polmann
  • 357
  • 3
  • 8
20
votes
1 answer

"this.getClient(...).watchQuery is not a function" - remote schema stitching with Apollo 2 / Next.js

So I'm attempting to stitch multiple remote GraphCMS endpoints together on the clientside of a Next.js app, and after trying/combining about every example on the face of the internet, I've gotten it to a place that's worth asking about. My…
Will Meier
  • 461
  • 5
  • 12
19
votes
1 answer

Apollo Optimistic UI does not work in Mutation Component?

I am using component which has Render Prop API & trying to do Optimistic Response in the UI. So far I have this chunk in an _onSubmit function - createApp({ variables: { id: uuid(), name, link }, optimisticResponse: { …
deadcoder0904
  • 7,232
  • 12
  • 66
  • 163
19
votes
4 answers

Reset store after logout with Apollo client

I'm trying to reset the store after logout in my react-apollo application. So I've created a method called "logout" which is called when I click on a button (and passed by the 'onDisconnect' props). To do that I've tried to follow this example…
Putxe
  • 1,054
  • 1
  • 16
  • 23
18
votes
3 answers

How to logout user when token expires in react app

I am working on a app where I am using React as my front-end and React-apollo-graphql for my API calling. I am using react-hooks i.e in React 16.8 +. What I am doing I have crated a auth.js file where I am storing my values when user is loging in…
manish thakur
  • 760
  • 9
  • 35
  • 76
18
votes
3 answers

Apollo mutation debounce and race conditions

(this is a follow up to https://github.com/apollographql/apollo-client/issues/1886) I'm trying to build a text input that will update the value as the user types. First attempt I first tried to use the optimisticResponse to update the local cache as…
Mike Lambert
  • 181
  • 1
  • 4
17
votes
4 answers

Property 'setLink' is missing in type 'ApolloClient' but required in type 'ApolloClient

I am setting up a new typescript project with react and apollo client. I am attempting to wire in the client like so: const client = new ApolloClient({ cache: new InMemoryCache(), link: new HttpLink({ uri: 'http://localhost:3000/graphql', …
Eric H
  • 1,323
  • 3
  • 14
  • 29
17
votes
6 answers

useQuery returns undefined, But returns data on gql playground

"@apollo/react-hooks": "^3.1.3", "apollo-client": "^2.6.8", Apollo client return undefined on react app but return the data on gql playground, I don't understand why don't it works on client-side but works on graphql playground. Schema I have…
U.A
  • 2,991
  • 3
  • 24
  • 36
17
votes
5 answers

Store data from useQuery with useState

I'm using React hooks both to fetch GraphQL data with react-apollo and to store local state: const [userData, setUserData] = useState({}) const { loading, error, data } = useQuery(USER_QUERY) However, I'm wondering how to store data to userData. Is…
Fellow Stranger
  • 32,129
  • 35
  • 168
  • 232
17
votes
2 answers

How to run a mutation on mount with React Apollo 2.1's Mutation component?

We are currently moving from Relay to React Apollo 2.1 and something I'm doing seems fishy. Context: Some components must only be rendered if the user is authenticated (via an API key), so there is an Authenticator component guarding the rest of the…
astorije
  • 2,666
  • 2
  • 27
  • 39
17
votes
2 answers

Apollo writeFragment not updating data

In react-apollo 2.0.1 I have a graphql type that looks like this: type PagedThing { data: [Thing] total: Int } When doing the following writeFragment client.writeFragment({ id, fragment: gql` fragment my_thing on Thing { …
FabioCosta
  • 3,069
  • 6
  • 28
  • 50
17
votes
1 answer

Apollo-client (react) - Update on create mutation - "Can't find field Fund({}) on object (ROOT_QUERY)"

Using: "react-apollo": "^1.4.3" In the parent component I query using GraphQL a parent node 'Fund' with children 'fundQuarterlyMetric'. This returns data in the following format: { id name ... fundQuarterlyMetrics (orderBy:…
Blackstone4
  • 681
  • 1
  • 9
  • 21
17
votes
2 answers

Apollo Client (React): Handling unexpected errors

I have been reviewing the Apollo documentation but I do not see information of how to go about handling server errors in the Apollo client. For example, suppose that the server either: Times out Becomes unreachable Unexpectedly fails How…
dipole_moment
  • 5,266
  • 4
  • 39
  • 55
17
votes
2 answers

How do you dynamically control react apollo-client query initiation?

A react component wrapped with an apollo-client query will automatically initiate a call to the server for data. I would like to fire off a request for data only on a specific user input. You can pass the skip option in the query options - but this…
Nick McIntosh
  • 191
  • 1
  • 5
1 2
3
…
99 100