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
9
votes
2 answers

Correct way to remove item from client side cache in apollo-client

I am using GraphQL with Apollo-Client in my React(Typescript) application with an in memory cache. The cache is updated on new items being added which works fine with no errors. When items are removed a string is returned from GraphQL Apollo-Server…
Croc
  • 789
  • 7
  • 13
9
votes
1 answer

Apollo Client v3 Delete cache entries after given time period

I am wondering if there is a way to expire cached items after a certain time period, e.g., 24 hours. I know that Apollo Client v3 provides methods such as cache.evict and cache.gc which are a good start and I am already using; however, I want a way…
Henry Hargreaves
  • 285
  • 4
  • 18
9
votes
2 answers

Recommended way to use GraphQL in Next.js app

In my apps, I am using following NPM modules to play with Strapi, GraphQL and Next.js: react-apollo next-apollo graphql gql recompose In the next step, I am creating Apollo config file, example below: import { HttpLink } from…
Mario Boss
  • 1,784
  • 3
  • 20
  • 43
9
votes
1 answer

Preventing: Store reset while query was in flight (not completed in link chain)

I get this randomly in my Apollo Client code. I'm using the anti-pattern of surrounding all setState with an isMounted flag to prevent attempts to set the state when a component is unmounted or a user is leaving a page. But I still get this Store…
notElonMusk
  • 314
  • 1
  • 4
  • 21
9
votes
1 answer

How to pass cookie from apollo-server to apollo-clenet

Mutation Mutation: { signUp: (_, { res }) => { try { res.cookie("jwt", "token", { httpOnly: true }); return "Amasia"; } catch (error) { return "error"; } }; } Apollo-clenet-react const [addTodo, {…
Edgar
  • 6,022
  • 8
  • 33
  • 66
9
votes
2 answers

How to fetch multiple conditional queries in Apollo Client React?

I'm using Apollo Client, and for fetching queries I'm using useQuery from the package @apollo/react-hooks. I would like to accomplish the following: List of Steps: Step 1: Fetch a query stage const GetStage = useQuery(confirmStageQuery, { …
Dhaval Jardosh
  • 7,151
  • 5
  • 27
  • 69
9
votes
2 answers

How to switch polling on and off in Apollo?

I use the useQuery Hook like this: function Foo() { const { data, error, loading } = useQuery(MY_QUERY, { pollInterval: 1000 }); return ( <> {data} ); } Now, both Bar and Baz use the same query.…
Paul Razvan Berg
  • 16,949
  • 9
  • 76
  • 114
9
votes
1 answer

Example of how to test a component that uses useQuery?

I have a React component that uses the Apollo hooks lib's useQuery hook. I'm having trouble testing this component. Here is my current setup. import React from 'react'; import { BrowserRouter as Router } from 'react-router-dom'; import DashboardBar…
maxwellgover
  • 6,661
  • 9
  • 37
  • 63
9
votes
1 answer

Polling and pagination at the same time with GraphQL Apollo?

To implement pagination with Apollo, you're typically going to use the fetchMore function, given to you when you send a query, in combination with updateQuery to tell Apollo how to update its cache with the result (appending it onto what you…
ostrebler
  • 940
  • 9
  • 32
9
votes
3 answers

Update ApolloClient headers after it was initialised

My app is wrapped with component that essentially initialises the client. const client = new ApolloClient({ link: new HttpLink({ // ... }), cache: new InMemoryCache({ // .. }), }); Further down the road users can make…
Ilja
  • 44,142
  • 92
  • 275
  • 498
9
votes
2 answers

React-Apollo Mutation returns empty response

I am using AWS Appsync where I want to get a response from a successfully executed mutation. When I try my setup in the Appsync Graphql console I get a filled "data": { "mutateMeeting" } response: When I try the same in my react application I can…
DrDirk
  • 1,937
  • 3
  • 25
  • 36
9
votes
2 answers

How to chain together Mutations in apollo client

I have a bunch of information stored in my state that I need to pass to my graphQL server using mutations, but I need to use the results of each mutation before I call the next one since I need to: Create a new object in my database Use the id…
Caleb Nelson
  • 103
  • 1
  • 5
9
votes
1 answer

read data from cache graphql apollo 2.0

I am using apollo 2.0. I first make authUser graphql call to server for given username and password, which generate jwt token and return back token in response. I do see that on successful login, User is stored in cache as id key value. I do have…
joy
  • 3,669
  • 7
  • 38
  • 73
9
votes
1 answer

How to import GraphQL query?

I have my project setup to import .graphql files. That works fine. But my problem is I don't know how to define a query in a .graphql file and import that into a component to use with react-apollo's component. In this example the author…
BugHunterUK
  • 8,346
  • 16
  • 65
  • 121
9
votes
1 answer

Pass variable from input to GraphQL search call

I am in the process of learning graphql and react-apollo. I have set up a search query in my code. I am unsure how to pass a variable from my code (i.e. this.state.search) to my grapnql call. I have looked at many answers including this one, but it…
peter flanagan
  • 9,195
  • 26
  • 73
  • 127
1 2 3
…
99 100