Questions tagged [apollo]
Apollo stands as a robust GraphQL client and cache that is available for use with JavaScript, iOS (Swift), and Android platforms.
I am currently using the Snack bar feature from the Materia-UI page, specifically the Customized SnackBars example. const variantIcon = { success: CheckCircleIcon, warning: WarningIcon, error: ErrorIcon, info: InfoIcon, }; const styles1 = theme = ...
Currently, I am incorporating TypeScript into my project and have a GraphQL query definition that utilizes Apollo's useQuery. According to the documentation, the call should be typed, however, I am encountering an ESLint error regarding data being ass ...
In my project using Apollo GraphQL with Next JS, I have explored three different approaches to querying and rendering data. The first method involves Static Rendering by utilizing getStaticProps(), which looks like the following: export async function getS ...
For the past few months, I've been immersed in working with ApolloJS within React (using react-apollo) and have encountered various tricks and challenges when it comes to unit testing components wrapped with Apollo. When testing a component directly wrapp ...
I've been facing a challenge for quite some time now trying to make my Angular component communicate with an Apollo GraphQL server using a simple Query (PingGQLService). I'm currently utilizing apollo-angular 4.1.0 and @apollo/client 3.0.0, and have even e ...
Imagine having a collection of condensed items associated with user IDs. When clicked, I aim to asynchronously fetch and display additional data using an Apollo query - like username, address, etc. How can I effectively "cache" or store this information lo ...
When sharing a link on platforms like Discord and Slack, an issue arises where a URL preview is generated by sending a request to the link. The link structure in question is as follows: www.domain.com/ctg/[...ids]. https://i.stack.imgur.com/Nl8MR.png Wit ...
I've been struggling to understand why my data isn't mapping correctly on these two components. I have attempted two debugging methods to analyze my code and have observed the data object for both the navigation and footer. Unable to comprehend ...
I decided to replicate reddit using Next.js and incorporating stepzen for graphql integration. I have successfully directed it to a specific page based on the slug, but unfortunately, I am facing an issue with retrieving the post information. import { use ...
We currently have a docker image that sets up both the backend server and frontend NextJS application utilizing ApolloClient. However, during the build process of the NextJS application, the Apollo client attempts to query the backend server's graphql ...
Below is the code I use to remove a user: const [selected, setSelected] = useState<string | null>(null); const DELETE_USER = gql` mutation RemoveUser($_id: String!) { removeUser(_id: $_id) } `; const [removeUser, { loading, error }] = useMut ...
When managing access to an API call server-side, I am throwing a 403 Forbidden error. While trying to catch the GraphQL error for a mutation, I experimented with various methods. (Method #1 successfully catches errors for useQuery()) const [m, { error }] ...
In my current project, I am working on integrating multiple remote schemas within a gateway service and expanding types from these schemas. To accomplish this, I am utilizing the `mergeSchemas` function from `graphql-tools`. This allows me to specify neces ...
I am encountering difficulty retrieving values from methods and parsing them to provide. How can I address this issue? methods: { onClickCategory: (value) => { return (this.catId = value); }, }, provide() { return { categor ...
Encountering issues setting up refetchQueries with reason-apollo. Following a setup similar to the swapi example here, I have a listing and a form for adding new items via a mutation. Upon successful mutation, the goal is to refetch the items in the listin ...
Currently, I am in the process of integrating graphql into my Vue project by following the guidance provided at https://github.com/Akryum/vue-apollo Although I have successfully installed 'apollo-client' via npm as per the requirements, I am encountering ...
I am facing an issue with integrating my jwt token into the context of my Apollo server using NextJs. In my previous experience with React and Express, I was able to pass the token in the headers as shown below: const client = new ApolloClient({ reque ...
In my Vue application, I am working on toggling the width of a sidebar menu. To keep track of different UI states such as whether the sidebar is open or closed, I plan to use a UI object stored in a local Apollo cache. I have a query that checks the state ...
My current setup involves using react along with Apollo. I have implemented refetch in the ProgressBar component, which updates every 3 seconds. Interestingly, another component named MemoBox also utilizes refetch to update the screen at the same int ...
Recently, I came across a GraphQL tutorial on YouTube (you can check it out here at around 3 hours and 16 minutes). As I was following along with the tutorial, I encountered an issue related to the use of compose from "react-apollo". It seems that the newe ...
Currently, I am in the process of developing a Next.js application that utilizes GraphQL with ApolloClient to manage API requests. Initially, I had success in setting up a page that functioned correctly and retrieved the appropriate data by passing an ID t ...
I'm trying to create an order when a MUI dialogue is opened. I attempted to use useEffect with an empty dependency, but for some reason the mutation doesn't resolve before the setState action. The activeOrder always returns a Promise that is fulf ...
I am currently working on an ecommerce website for a personal project and I am struggling with setting up the place order functionality. After inputting the data, I want to retrieve the Id and redirect it to orders/[id]. Check out my code below: import Re ...
I currently have a functioning query available const getUniqueCicadaByUserIdQuery = gql` query($id:String){ user(id:$id){ id userName password cicadas { name id image long lat userid ...
In my node.js server, I have implemented CORS as middleware in the following manner: app.use(cors({ origin: 'http://<CORRECT_ORIGIN_URL>:3030', credentials: true })) Within my app, I am utilizing Apollo Client to send requests. During th ...
Having a peculiar issue that is puzzling me. I designed a home page showcasing data fetched using the Apollo module. Everything works smoothly on this page, but when I attempt to navigate to the next page, I encounter an error stating 'Cannot read propert ...
Unique Context This inquiry pertains to a previous question of mine, which can be found at this link: How to handle apollo client errors crashing page render in Nuxt?. However, I'm isolating the focus of this question solely on Nuxt (excluding apollo) and ...
I am currently working on a Progressive Web App built with Next.js that needs to retrieve data from a Wordpress website, and I am still quite new to these technologies. These are the Wordpress plugins that I have installed: WPGraphQL WPGraphQL CORS WPGra ...
When utilizing GraphQL to facilitate communication between a client and server across different domains, I took the necessary steps to enable CORS on my API website by referring to the documentation provided by Vercel. However, it appears that I am encount ...
Within my organization, we utilize an application that utilizes React, express, Apollo Server, and Apollo Client to showcase data from various sources. This app regularly updates the displayed data using a polling method. However, whenever I make code upda ...
Ever since I updated to NextJS 13.5, I've been encountering these errors specifically when deploying on Vercel (although everything works fine locally): Error: Schema must contain uniquely named types but contains multiple types named "h". at new GraphQL ...
After successfully adding a user to my database, I am encountering an issue where the query returns null in my client app even though it shows data in the GraphQL playground. To troubleshoot this problem, I have implemented a useEffect hook that triggers t ...
Currently, I am working with React Typescript and incorporating an Autocomplete Material UI component into my project. The main goal is to populate query suggestions within the Autocomplete component. The graphql queries are structured like this: Query D ...
Everything functions perfectly when backend mode is set to NODE_ENV: development, but in production mode I encounter an error with graphql-codegen: Error on local web server: Apollo Server does not allow GraphQL introspection, but the query contains _sc ...
Question: I am facing an issue with querying user information when entering a specific user page like website/user/1. However, I keep encountering errors and suspect it might be related to Apollo. Is there a way to resolve this problem? What could I have d ...
After reading through this blog post on integrating query components with Apollo (), I learned how to pass a function from a child component to its parent so that it can be called with the correct parameters. Despite following the instructions, I keep enc ...
Currently, I am in the process of configuring Apollo Server on my Node application and contemplating transferring the functionality over to Apollo. The current business logic I have looks like this: router.post( '/login', (req, res, next) => { ...
element, I have incorporated two distinct mutations in a single react component: const [get_items, { error, loading, data }] = useMutation(GET_ITEMS); const [add_to_cart] = useMutation(ADD_TO_CART); To streamline and access both components' error, load ...
I am encountering an issue with @apollo while working on my react project, and I keep receiving the following error: npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @apollo/<a href="/cdn-cgi/l/email-protect ...
"react": "^16.12.0", "typescript": "^4.0.3", "next": "^9.4.4" The error being raised by typescript is related to the <Item item={item} key={item.id} urlReferer={urlReferer} /> prop used ...
I'm struggling to connect my Apollo server with my mongoDB. Despite searching for examples, I can't seem to find a solution that addresses the async part of the process. It's surprising that there aren't more resources available. Am I missing something? I ...
As a newcomer to Apollo, I am facing some challenges while trying to send a basic GraphQL query to the Yelp server. import React from 'react'; import { render } from 'react-dom'; import ApolloClient from 'apollo-boost'; import { setContext } from 'apollo- ...
After successfully testing a mutation in the playground, I attempted to implement it in my Apollo client on React. However, I encountered an error message stating: Unhandled Rejection (Error): Network error: Response not successful: Received status code 40 ...
I am encountering an issue with my react project that involves apollo-graphql. The error message states: Invalid hook call. Hooks can only be called inside of the body of a function component Below is the snippet of code triggering this error: import Re ...
I'm currently working on establishing a connection to my database using mongoose within Apollo-Server-Express. Following the creation of a db in the terminal, I understood that 'mongodb://localhost:27017/*db-name*' serves as the default uri-string for mong ...
As a newcomer to NextJS, I am facing the challenge of displaying real-time data fetched from a Hasura GraphQL backend on a page. In previous non-NextJS applications, I successfully utilized GraphQL subscriptions with the Apollo client library which levera ...
On my vue screen, I am trying to utilize a single apollo graphql query that I have defined for two different properties. From what I understand, the property name must correspond with an attribute name in the returned json structure. I attempted to use the ...
How can I effectively call an Apollo query in my App component, where the component's behavior depends on the result? My goal is to redirect users to different pages based on their privileges. I'm struggling with figuring out the right way an ...
Currently, I am utilizing nuxt in conjunction with apollo-module. My main objective is to be able to intercept any potential network errors, specifically 401/403 errors, in order to display an error modal and log out the user. As per the documentation, it ...
I am facing an issue with my code where the cookieData is rendered as undefined on the initial render and query, causing the query to fail authentication. Is there a way to ensure that the query waits for the response from the cookie API before running? co ...
In my Next.js project, I have implemented next-auth for handling authorization. The issue I encountered involves sending user tokens with requests using setContext when clicking on a user card. However, this resulted in an error message: ApolloError: Invar ...
I am currently working with React Apollo. I have a progress bar component and I need to update the user's percent value every 3 seconds without relying on Apollo's refetch method. import {useInterval} from 'beautiful-react-hooks'; cons ...
Issue :app:installApolloCodegen FAILED Warning from npm [email protected]: The 'apollo-codegen' command has been replaced with the more powerful 'apollo' CLI. Switch to 'apollo' for future updates and visit eration for ...
I seem to be facing some challenges while trying to integrate auth0 into my project. Every time I fix one issue, another one pops up and it's always the same trio of errors: -require is not a function -window is not defined -missing class properties I'v ...
Recently, I set up an ExpressJS server for Server-Side Rendering (SSR) with Apollo GraphQL. However, I encountered a problem: Although the initial page source is as expected once the server starts running, the data fetched by GraphQL remains static and nev ...
When using ApolloProvider, an app is wrapped with the following code: <ApolloProvider client={client}> <App /> </ApolloProvider> An issue arises in Nextjs where route components can be declared in the pages folder without adding them ...
After upgrading NestJs to the latest version (8.3.1) from 7.5, I managed to resolve most of the issues that came up. However, there is one stubborn issue that I just can't seem to get rid of. The complete error message reads as follows: node_modu ...
I'm encountering an error message while using nexus to define a graphql schema with apollo-server. Error: NEXUS__UNKNOWN__TYPE was already defined and imported as a type The stack trace doesn't provide much insight into where the problem is occ ...
I have integrated Apollo GraphQL into my Next.js project to fetch posts and populate the content. Although the current code is functional, I am looking to enhance it by implementing the loading state of useQuery instead of the existing setup. This serves ...
Utilizing Apollo, I aim to fetch multiple items upon a user clicking a button. The backend data may not be immediately available, so I opt for polling to eventually retrieve the results. To achieve this, I iterate through the items in a loop and make quer ...
I am currently working on configuring a graphql frontend application with nextjs13. However, I have encountered an issue with the new folder structure as there is no longer an _app.tsx file. I am now unsure of how to proceed with setting it up. Previously ...
Once a user logs in, the system returns a jwt token and a user object containing the id and firstName, which are then stored in cache (refer to the image link provided below). https://i.stack.imgur.com/oSXZ5.png I aim to retrieve the user information fro ...