GraphQL Error: Parse error on "operationName"

Help
,
1

Hi,
I am using @apollo/client on version ^3.7.0 .
Trying to fetch Shopify Admin API on NextJs verson v12.3.1 .

/pages/_app.tsx

import {
  ApolloClient,
  InMemoryCache,
  ApolloProvider,
  createHttpLink,
  from,
} from "@apollo/client";
import { onError } from "@apollo/client/link/error";

const errorLink = onError(({ graphQLErrors, networkError }) => {
  if (graphQLErrors)
    graphQLErrors.forEach(({ message, locations, path, nodes }) =>
      console.log(
        `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
      )
    );
  if (networkError) console.log(`[Network error]: ${networkError}`);
});

const httpLink = createHttpLink({
  uri: `https://${process.env.SHOP}/admin/api/2022-10/graphql.json`,
  headers: {
    "X-Shopify-Access-Token": process.env.ACCESS_TOKEN || "",
    "Content-Type": "application/graphql",
  },
});

const options = {};

export const client = new ApolloClient({
  link: from([errorLink, httpLink]),
  cache: new InMemoryCache(options),
});

/pages/api/collections.js

import Shopify, { ApiVersion } from "@shopify/shopify-api";
require("dotenv").config();

import { GetCollectionsDocument } from "../../graphql/generated";
import { client } from "../../pages/_app";

const { API_KEY, API_SECRET_KEY, SCOPES, HOST, HOST_SCHEME } = process.env;

Shopify.Context.initialize({
  API_KEY: `${API_KEY}`,
  API_SECRET_KEY: `${API_SECRET_KEY}`,
  SCOPES: [`${SCOPES}`],
  HOST_NAME: `${HOST}`.replace(/https?:\/\//, ""),
  HOST_SCHEME,
  IS_EMBEDDED_APP: true,
  API_VERSION: ApiVersion.July22,
});

------------------------ THIS QUERY FAILS

export default async function handler(req, res) {
  const { data } = await client.query({
    query: GetCollectionsDocument,
  });

  res.status(200).json({ response: "cool" });
}

There is the stack trace error

error - ApolloError: Parse error on "operationName" (STRING) at [1, 2]
[0]     at new ApolloError (/Users/jmyproject/node_modules/@apollo/client/errors/errors.cjs:34:28)
[0]     at /Users/myproject/node_modules/@apollo/client/core/core.cjs:1676:47
[0]     at both (/Users/myproject/node_modules/@apollo/client/utilities/utilities.cjs:997:53)
[0]     at /Users/myproject/node_modules/@apollo/client/utilities/utilities.cjs:990:72
[0]     at new Promise (<anonymous>)
[0]     at Object.then (/Users/myproject/node_modules/@apollo/client/utilities/utilities.cjs:990:24)
[0]     at Object.next (/Users/myproject/node_modules/@apollo/client/utilities/utilities.cjs:998:49)
[0]     at notifySubscription (/Users/myproject/node_modules/zen-observable/lib/Observable.js:135:18)
[0]     at onNotify (/Users/myproject/node_modules/zen-observable/lib/Observable.js:179:3)
[0]     at SubscriptionObserver.next (/Users/myproject/node_modules/zen-observable/lib/Observable.js:235:7)

Thanks for helping

2

Check if your query is defined or is correctly parsed using gql