nuxt-graphql-middleware 4.0.0 → 4.1.0

package/dist/module.mjs

@@ -1,18 +1,20 @@
 import { fileURLToPath } from 'url';
-import { resolve } from 'pathe';
+import { dirname, resolve, relative } from 'pathe';
 import { defu } from 'defu';
 import { useLogger, resolveAlias, resolveFiles, defineNuxtModule, createResolver, addImports, addTemplate, addServerHandler, addPlugin, updateTemplates } from '@nuxt/kit';
 import inquirer from 'inquirer';
 import { onDevToolsInitialized, extendServerRpc } from '@nuxt/devtools-kit';
 import { existsSync } from 'fs';
+import { GraphqlMiddlewareTemplate } from '../dist/runtime/settings/index.js';
+import * as fs from 'node:fs';
 import { promises, existsSync as existsSync$1 } from 'node:fs';
 import { oldVisit } from '@graphql-codegen/plugin-helpers';
-import fragmentImport from '@graphql-fragment-import/lib/inline-imports.js';
 import { validateGraphQlDocuments } from '@graphql-tools/utils';
 import { loadSchema } from '@graphql-tools/load';
 import Table from 'cli-table';
 import chalk from 'chalk';
 import { concatAST, parse, print, visit, Kind, Source } from 'graphql';
+import { falsy } from '../dist/runtime/helpers/index.js';
 import { generate as generate$1, executeCodegen } from '@graphql-codegen/cli';
 import * as PluginTypescript from '@graphql-codegen/typescript';
 import * as PluginTypescriptOperations from '@graphql-codegen/typescript-operations';
@@ -20,7 +22,7 @@ import * as PluginSchemaAst from '@graphql-codegen/schema-ast';
 import { pascalCase } from 'change-case-all';
 
 const name = "nuxt-graphql-middleware";
-const version = "4.0.0";
+const version = "4.1.0";
 
 const DEVTOOLS_UI_ROUTE = "/__nuxt-graphql-middleware";
 const DEVTOOLS_UI_LOCAL_PORT = 3300;
@@ -63,19 +65,102 @@ function setupDevToolsUI(nuxt, clientPath) {
   });
 }
 
-var GraphqlMiddlewareTemplate = /* @__PURE__ */ ((GraphqlMiddlewareTemplate2) => {
-  GraphqlMiddlewareTemplate2["OperationTypes"] = "graphql-operations.d.ts";
-  GraphqlMiddlewareTemplate2["ComposableContext"] = "nuxt-graphql-middleware.d.ts";
-  GraphqlMiddlewareTemplate2["Documents"] = "graphql-documents.mjs";
-  return GraphqlMiddlewareTemplate2;
-})(GraphqlMiddlewareTemplate || {});
+const importSyntaxRE = /^#import (?:'([^']*)'|"([^"]*)")/;
+const matchImport = (value = "") => {
+  if (!value) {
+    return void 0;
+  }
+  if (value.indexOf("#import") !== 0) {
+    return void 0;
+  }
+  const matched = value.match(importSyntaxRE);
+  if (matched === null) {
+    return void 0;
+  }
+  const importIdentifierMatch = value.match(importSyntaxRE) || [];
+  const importIdentifier = importIdentifierMatch[1] ?? importIdentifierMatch[2];
+  if (importIdentifier === void 0) {
+    return void 0;
+  }
+  return { importIdentifier };
+};
 
-function falsy(value) {
-  return value !== null && value !== void 0;
+const lineEndingRE = /\r\n|\n/;
+function* linesWithInlinedImportsOf(fileContents, inlineImportsOptions, visited) {
+  const {
+    resolveOptions = {},
+    resolveImport,
+    fs: nodeFs = fs,
+    throwIfImportNotFound
+  } = inlineImportsOptions;
+  const { basedir } = resolveOptions;
+  if (typeof basedir !== "string") {
+    throw new TypeError(
+      "inlineImports requires options.resolverOptions.basedir be set"
+    );
+  }
+  if (!resolveImport) {
+    throw new TypeError("inlineImports requires options.resolveImport be set");
+  }
+  let lineNumber = 0;
+  for (const line of fileContents.split(lineEndingRE)) {
+    ++lineNumber;
+    const matched = matchImport(line);
+    if (matched) {
+      const importIdentifier = matched.importIdentifier;
+      let filename;
+      try {
+        filename = resolveImport(importIdentifier, resolveOptions);
+      } catch (err) {
+        if (throwIfImportNotFound === false) {
+          continue;
+        }
+        throw err;
+      }
+      if (visited.has(filename)) {
+        continue;
+      } else {
+        visited.add(filename);
+      }
+      const fragmentSource = nodeFs.readFileSync(filename, "utf8");
+      const line2 = inlineImportsWithLineToImports(
+        fragmentSource,
+        {
+          resolveImport,
+          resolveOptions: {
+            basedir: dirname(filename)
+          }
+        },
+        visited
+      );
+      yield { line: line2.inlineImports, match: true, lineNumber, filename };
+    } else {
+      yield { line, match: false, lineNumber };
+    }
+  }
+}
+function inlineImportsWithLineToImports(fileContents, options, visited = /* @__PURE__ */ new Set()) {
+  const inlineImportsResult = [];
+  const lineToImports = /* @__PURE__ */ new Map();
+  for (const { line, match, lineNumber, filename } of linesWithInlinedImportsOf(
+    fileContents,
+    options,
+    visited
+  )) {
+    inlineImportsResult.push(line);
+    if (match) {
+      lineToImports.set(lineNumber, { filename, line });
+    }
+  }
+  return {
+    inlineImports: inlineImportsResult.join("\n"),
+    lineToImports
+  };
 }
 
 function getCodeResult(operations, typeName, serverApiPrefix) {
   const imports = [];
+  const resultTypes = [];
   let code = "";
   let nitroCode = "";
   const names = Object.keys(operations);
@@ -84,6 +169,7 @@ function getCodeResult(operations, typeName, serverApiPrefix) {
     const nitroLines = [];
     names.forEach((name) => {
       const nameResult = pascalCase(name + typeName);
+      resultTypes.push(nameResult);
       imports.push(nameResult);
       const nameVariables = pascalCase(name + typeName + "Variables");
       const { hasVariables, variablesOptional } = operations[name];
@@ -95,7 +181,9 @@ function getCodeResult(operations, typeName, serverApiPrefix) {
         `    ${name}: [${variablesType}, ${variablesOptional ? "true" : "false"}, ${nameResult}]`
       );
       nitroLines.push(
-        `    '${serverApiPrefix}/${typeName.toLowerCase()}/${name}': GraphqlMiddlewareResponse<Awaited<${nameResult}>>`
+        `    '${serverApiPrefix}/${typeName.toLowerCase()}/${name}': {
+      'default': GraphqlResponse<${nameResult}>
+    }`
       );
     });
     code += `  export type GraphqlMiddleware${typeName} = {
@@ -104,7 +192,7 @@ ${lines.join(",\n")}
 `;
     nitroCode += `${nitroLines.join("\n")}`;
   }
-  return { code, imports, nitroCode };
+  return { code, imports, nitroCode, resultTypes };
 }
 const plugin$1 = (_schema, documents, config) => {
   const allAst = concatAST(documents.map((v) => v.document).filter(falsy));
@@ -129,6 +217,7 @@ const plugin$1 = (_schema, documents, config) => {
   let code = "";
   let nitroCode = "";
   const imports = [];
+  const resultTypes = [];
   const resultQuery = getCodeResult(
     operations.query,
     "Query",
@@ -137,6 +226,7 @@ const plugin$1 = (_schema, documents, config) => {
   code += resultQuery.code;
   nitroCode += resultQuery.nitroCode;
   imports.push(...resultQuery.imports);
+  resultTypes.push(...resultQuery.resultTypes);
   const resultMutation = getCodeResult(
     operations.mutation,
     "Mutation",
@@ -145,21 +235,20 @@ const plugin$1 = (_schema, documents, config) => {
   code += "\n" + resultMutation.code;
   nitroCode += "\n" + resultMutation.nitroCode;
   imports.push(...resultMutation.imports);
-  return `import {
+  resultTypes.push(...resultMutation.resultTypes);
+  return `
+import type { GraphqlResponse } from '#graphql-middleware-server-options-build'
+import type {
   ${imports.join(",\n  ")}
 } from './graphql-operations'
 
 
-type GraphqlMiddlewareResponse<T> = {
-  data: T
-}
-
 declare module '#build/nuxt-graphql-middleware' {
+  export type GraphqlMiddlewareResponseUnion = ${resultTypes.join(" | ")}
 ${code}
 }
 
 declare module 'nitropack' {
-  type Awaited<T> = T extends PromiseLike<infer U> ? Awaited<U> : T
   interface InternalApi {
 ${nitroCode}
   }
@@ -280,111 +369,19 @@ const defaultOptions = {
   devtools: true
 };
 function inlineFragments(source, resolver) {
-  return fragmentImport(source, {
+  return inlineImportsWithLineToImports(source, {
     resolveImport(identifier) {
       return resolver(identifier);
     },
     resolveOptions: {
       basedir: "./"
     }
-  });
-}
-function validateDeprecated(options) {
-  const deprecatedKeys = [
-    "graphqlEndpoint",
-    "serverFetchOptions",
-    "onServerResponse",
-    "onServerError"
-  ];
-  deprecatedKeys.forEach((key) => {
-    if (typeof options[key] === "function") {
-      logger.error(
-        `Providing a function for "${key}" via nuxt.config.ts has been removed. Please move the configuration to ~/app/graphqlMiddleware.serverOptions.ts.`
-      );
-      if (key === "graphqlEndpoint") {
-        logger.info(`
-import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'
-import { getHeader } from 'h3'
-import acceptLanguageParser from 'accept-language-parser';
-
-export default defineGraphqlServerOptions({
-  graphqlEndpoint(event, operation, operationName) {
-    // Get accepted languages.
-    const acceptLanguage = getHeader('accept-language')
-    const languages = acceptLanguageParser.parse(acceptLanguage);
-
-    // Use first match or fallback to English.
-    const language = languages[0]?.code || 'en'
-    return \`https://api.example.com/\${language}/graphql\`
-  }
-})`);
-      }
-      if (key === "serverFetchOptions") {
-        logger.info(`
-import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'
-import { getHeader } from 'h3'
-
-// Pass the cookie from the client request to the GraphQL request.
-export default defineGraphqlServerOptions({
-  serverFetchOptions(event, operation, operationName) {
-    return {
-      headers: {
-        Cookie: getHeader(event, 'cookie')
-      }
-    }
-  }
-})`);
-      }
-      if (key === "onServerResponse") {
-        logger.info(`
-import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'
-import type { H3Event } from 'h3'
-import type { FetchResponse } from 'ofetch'
-
-export default defineGraphqlServerOptions({
-  onServerResponse(event, graphqlResponse) {
-    // Set a static header.
-    event.node.res.setHeader('x-nuxt-custom-header', 'A custom header value')
-
-    // Pass the set-cookie header from the GraphQL response to the client.
-    const setCookie = graphqlResponse.headers.get('set-cookie')
-    if (setCookie) {
-      event.node.res.setHeader('set-cookie', setCookie)
-    }
-
-    // Add additional properties to the response.
-    graphqlResponse._data.__customProperty = ['My', 'values']
-
-    // Return the GraphQL response.
-    return graphqlResponse._data
-  }
-})`);
-      }
-      if (key === "onServerError") {
-        logger.info(`
-import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'
-import type { H3Event } from 'h3'
-import type { FetchError } from 'ofetch'
-
-export default defineGraphqlServerOptions({
-  onServerError( event, error, operation, operationName) {
-    event.setHeader('cache-control', 'no-cache')
-    return {
-      data: {},
-      errors: [error.message]
-    }
-  }
-})`);
-      }
-      throw new TypeError("Invalid configuration for graphqlMiddleware." + key);
-    }
-  });
+  }).inlineImports;
 }
 function validateOptions(options) {
   if (!options.graphqlEndpoint) {
     throw new Error("Missing graphqlEndpoint.");
   }
-  validateDeprecated(options);
 }
 async function getSchemaPath(options, resolver, writeToDisk = false) {
   const dest = resolver(options.schemaPath);
@@ -425,19 +422,49 @@ async function autoImportDocuments(patterns = [], srcResolver) {
     })
   );
 }
-function buildDocuments(providedDocuments = [], autoImportPatterns, resolver) {
-  return autoImportDocuments(autoImportPatterns, resolver).then((importedDocuments) => {
-    return [
-      ...importedDocuments,
-      ...providedDocuments.map((content) => {
-        return {
-          content,
-          filename: "nuxt.config.ts"
-        };
-      })
-    ].filter((v) => v.content);
-  }).then((documents) => {
-    return documents.map((v) => {
+function inlineNestedFragments(document, fragmentMap) {
+  const parsed = parse(document);
+  const fragmentsToInline = /* @__PURE__ */ new Set();
+  visit(parsed, {
+    FragmentSpread(node) {
+      fragmentsToInline.add(node.name.value);
+    }
+  });
+  fragmentsToInline.forEach((fragmentName) => {
+    const fragment = fragmentMap[fragmentName];
+    if (fragment) {
+      document += "\n" + fragment;
+      const nestedFragmentNames = /* @__PURE__ */ new Set();
+      visit(parse(fragment), {
+        FragmentSpread(node) {
+          nestedFragmentNames.add(node.name.value);
+        }
+      });
+      nestedFragmentNames.forEach((nestedFragmentName) => {
+        if (!fragmentsToInline.has(nestedFragmentName)) {
+          fragmentsToInline.add(nestedFragmentName);
+          const nestedFragment = fragmentMap[nestedFragmentName];
+          if (nestedFragment) {
+            document += "\n" + nestedFragment;
+          }
+        }
+      });
+    }
+  });
+  return document;
+}
+async function buildDocuments(providedDocuments = [], autoImportPatterns, resolver, autoInlineFragments) {
+  const documents = await autoImportDocuments(autoImportPatterns, resolver).then((importedDocuments) => [
+    ...importedDocuments,
+    ...providedDocuments.map((content) => ({
+      content,
+      filename: "nuxt.config.ts"
+    }))
+  ]).then((documents2) => {
+    if (autoInlineFragments) {
+      return documents2;
+    }
+    return documents2.map((v) => {
       try {
         return {
           content: inlineFragments(v.content, resolveAlias),
@@ -452,6 +479,22 @@ function buildDocuments(providedDocuments = [], autoImportPatterns, resolver) {
       return null;
     }).filter(falsy);
   });
+  if (!autoInlineFragments) {
+    return documents;
+  }
+  const fragmentMap = {};
+  documents.forEach((doc) => {
+    const parsed = parse(doc.content);
+    visit(parsed, {
+      FragmentDefinition(node) {
+        fragmentMap[node.name.value] = print(node);
+      }
+    });
+  });
+  documents.forEach((doc) => {
+    doc.content = inlineNestedFragments(doc.content, fragmentMap);
+  });
+  return documents;
 }
 function parseDocument(document, srcDir) {
   let name = document.filename ? document.filename.replace(srcDir, "") : "";
@@ -481,9 +524,6 @@ function validateDocuments(schema, documents, srcDir) {
         document.name = operation.name?.value;
         document.operation = operation.operation;
       } else {
-        const fragment = node.definitions.find(
-          (v) => v.kind === "FragmentDefinition"
-        );
         document.name = document.relativePath;
       }
       document.isValid = document.errors.length === 0;
@@ -552,7 +592,8 @@ async function generate(options, schemaPath, resolver, srcDir, logEverything = f
   const documents = await buildDocuments(
     options.documents,
     options.autoImportPatterns,
-    resolver
+    resolver,
+    !!options.autoInlineFragments
   );
   const validated = validateDocuments(schema, documents, srcDir);
   const extracted = validated.filter(
@@ -672,7 +713,7 @@ const module = defineNuxtModule({
     configKey: "graphqlMiddleware",
     version,
     compatibility: {
-      nuxt: "^3.1.0"
+      nuxt: ">=3.1.0"
     }
   },
   defaults: defaultOptions,
@@ -682,7 +723,7 @@ const module = defineNuxtModule({
       options.autoImportPatterns = ["**/*.{gql,graphql}", "!node_modules"];
     }
     validateOptions(options);
-    const moduleResolver = createResolver(import.meta.url).resolve;
+    const moduleResolver = createResolver(import.meta.url);
     const srcDir = nuxt.options.srcDir;
     const srcResolver = createResolver(srcDir).resolve;
     const schemaPath = await getSchemaPath(
@@ -698,7 +739,7 @@ const module = defineNuxtModule({
     };
     let rpc = null;
     if (options.devtools) {
-      const clientPath = moduleResolver("./client");
+      const clientPath = moduleResolver.resolve("./client");
       setupDevToolsUI(nuxt, clientPath);
       const setupRpc = () => {
         rpc = extendServerRpc(RPC_NAMESPACE, {
@@ -780,25 +821,45 @@ const module = defineNuxtModule({
     nuxt.options.runtimeConfig.public["nuxt-graphql-middleware"] = {
       serverApiPrefix: options.serverApiPrefix
     };
+    nuxt.options.appConfig.graphqlMiddleware = {
+      clientCacheEnabled: !!options.clientCache?.enabled,
+      clientCacheMaxSize: options.clientCache?.maxSize || 100
+    };
     nuxt.options.runtimeConfig.graphqlMiddleware = {
       graphqlEndpoint: options.graphqlEndpoint || ""
     };
     if (options.includeComposables) {
       addImports({
-        from: moduleResolver("./runtime/composables/useGraphqlQuery"),
+        from: moduleResolver.resolve("./runtime/composables/useGraphqlQuery"),
         name: "useGraphqlQuery"
       });
       addImports({
-        from: moduleResolver("./runtime/composables/useGraphqlMutation"),
+        from: moduleResolver.resolve(
+          "./runtime/composables/useGraphqlMutation"
+        ),
         name: "useGraphqlMutation"
       });
       addImports({
-        from: moduleResolver("./runtime/composables/useGraphqlState"),
+        from: moduleResolver.resolve("./runtime/composables/useGraphqlState"),
         name: "useGraphqlState"
       });
-      nuxt.options.alias["#graphql-composable"] = moduleResolver(
+      addImports({
+        from: moduleResolver.resolve(
+          "./runtime/composables/useAsyncGraphqlQuery"
+        ),
+        name: "useAsyncGraphqlQuery"
+      });
+      nuxt.options.alias["#graphql-composable"] = moduleResolver.resolve(
         "runtime/composables/server"
       );
+      if (options.enableFileUploads) {
+        addImports({
+          from: moduleResolver.resolve(
+            "./runtime/composables/useGraphqlUploadMutation"
+          ),
+          name: "useGraphqlUploadMutation"
+        });
+      }
     }
     Object.values(GraphqlMiddlewareTemplate).forEach((filename) => {
       const result = addTemplate({
@@ -822,18 +883,18 @@ const module = defineNuxtModule({
       filename: "graphql-documents.d.ts",
       getContents: () => {
         return `
-import {
-  GraphqlMiddlerwareQuery,
+import type {
+  GraphqlMiddlewareQuery,
   GraphqlMiddlewareMutation,
 } from '#build/nuxt-graphql-middleware'
 
 declare module '#graphql-documents' {
   type Documents = {
-    query: GraphqlMiddlerwareQuery
-    mutation: GraphqlMiddlerwareMutation
+    query: GraphqlMiddlewareQuery
+    mutation: GraphqlMiddlewareMutation
   }
   const documents: Documents
-  export { documents }
+  export { documents, Documents }
 }
 `;
       }
@@ -843,45 +904,68 @@ declare module '#graphql-documents' {
     const template = (() => {
       const resolvedFilename = `graphqlMiddleware.serverOptions.ts`;
       const maybeUserFile = fileExists(resolvedPath, extensions);
-      if (maybeUserFile) {
-        return addTemplate({
-          filename: resolvedFilename,
-          write: true,
-          getContents: () => `export { default } from '${resolvedPath}'`
-        });
-      }
+      const moduleTypesPath = relative(
+        nuxt.options.buildDir,
+        moduleResolver.resolve("./types")
+      );
+      const serverOptionsLine = maybeUserFile ? `import serverOptions from './../app/graphqlMiddleware.serverOptions'` : `const serverOptions: GraphqlMiddlewareServerOptions = {}`;
       return addTemplate({
         filename: resolvedFilename,
         write: true,
-        getContents: () => "export default {}"
+        getContents: () => `
+import type { GraphqlMiddlewareServerOptions } from '${moduleTypesPath}'
+${serverOptionsLine}
+import type { GraphqlServerResponse } from '#graphql-middleware/types'
+import type { GraphqlMiddlewareResponseUnion } from '#build/nuxt-graphql-middleware'
+
+type GraphqlResponseAdditions =
+  typeof serverOptions extends GraphqlMiddlewareServerOptions<infer R> ? R : {}
+
+export type GraphqlResponse<T> = GraphqlServerResponse<T> & GraphqlResponseAdditions
+
+export type GraphqlResponseTyped = GraphqlResponse<GraphqlMiddlewareResponseUnion>
+
+export { serverOptions }
+`
       });
     })();
     nuxt.options.nitro.externals = nuxt.options.nitro.externals || {};
     nuxt.options.nitro.externals.inline = nuxt.options.nitro.externals.inline || [];
     nuxt.options.nitro.externals.inline.push(template.dst);
     nuxt.options.alias["#graphql-middleware-server-options-build"] = template.dst;
+    nuxt.options.alias["#graphql-middleware/types"] = moduleResolver.resolve("./runtime/types");
     addServerHandler({
-      handler: moduleResolver("./runtime/serverHandler/index"),
+      handler: moduleResolver.resolve("./runtime/serverHandler/index"),
       route: options.serverApiPrefix + "/:operation/:name"
     });
-    addPlugin(moduleResolver("./runtime/plugins/provideState"), {
+    if (options.enableFileUploads) {
+      addServerHandler({
+        handler: moduleResolver.resolve("./runtime/serverHandler/upload"),
+        route: options.serverApiPrefix + "/upload/:name"
+      });
+    }
+    addPlugin(moduleResolver.resolve("./runtime/plugins/provideState"), {
       append: false
     });
     nuxt.hook("nitro:config", (nitroConfig) => {
       nitroConfig.externals = defu(
         typeof nitroConfig.externals === "object" ? nitroConfig.externals : {},
         {
-          inline: [moduleResolver("./runtime")]
+          inline: [moduleResolver.resolve("./runtime")]
         }
       );
     });
-    if (nuxt.options.dev) {
+    if (nuxt.options.dev || nuxt.options._prepare) {
       addServerHandler({
-        handler: moduleResolver("./runtime/serverHandler/debug"),
+        handler: moduleResolver.resolve("./runtime/serverHandler/debug"),
         route: options.serverApiPrefix + "/debug"
       });
       nuxt.hook("nitro:build:before", (nitro) => {
         nuxt.hook("builder:watch", async (_event, path) => {
+          path = relative(
+            nuxt.options.srcDir,
+            resolve(nuxt.options.srcDir, path)
+          );
           if (!path.match(/\.(gql|graphql)$/)) {
             return;
           }

package/dist/runtime/composables/nuxtApp.d.ts

@@ -1,5 +1,10 @@
 import type { FetchOptions } from 'ofetch';
-export declare function performRequest(operation: string, operationName: string, method: 'get' | 'post', options: FetchOptions): Promise<{
-    data: any;
-    errors: any[];
-}>;
+import { GraphqlMiddlewareCache } from '../helpers/ClientCache.js';
+import type { GraphqlResponse } from '#graphql-middleware-server-options-build';
+import type { RequestCacheOptions } from '#graphql-middleware/types';
+export declare function performRequest<T>(operation: string, operationName: string, method: 'get' | 'post', options: FetchOptions, cacheOptions?: RequestCacheOptions): Promise<GraphqlResponse<T>>;
+declare module '#app' {
+    interface NuxtApp {
+        $graphqlCache?: GraphqlMiddlewareCache;
+    }
+}

package/dist/runtime/composables/nuxtApp.js

@@ -0,0 +1,47 @@
+import { useGraphqlState } from "./useGraphqlState.js";
+import { getEndpoint } from "./shared.js";
+import { hash } from "ohash";
+import { GraphqlMiddlewareCache } from "../helpers/ClientCache.js";
+import { useNuxtApp, useAppConfig } from "#imports";
+export function performRequest(operation, operationName, method, options, cacheOptions) {
+  const state = useGraphqlState();
+  const app = useNuxtApp();
+  if (!state) {
+    console.error(
+      `A GraphQL composable for ${operation} "${operationName}" was called before the "nuxt-graphql-middleware-provide-state" plugin could provide the state, which might lead to unexpected behaviour. Make sure that custom plugins that perform GraphQL requests are executed after "nuxt-graphql-middleware-provide-state" by setting it as a dependency via "dependsOn".`
+    );
+  }
+  const key = `${operation}:${operationName}:${hash(options.params)}`;
+  if (cacheOptions) {
+    const config = useAppConfig();
+    if (import.meta.client && cacheOptions.client && config.graphqlMiddleware.clientCacheEnabled) {
+      if (!app.$graphqlCache) {
+        app.$graphqlCache = new GraphqlMiddlewareCache(
+          config.graphqlMiddleware.clientCacheMaxSize
+        );
+      }
+      const cached = app.$graphqlCache.get(key);
+      if (cached) {
+        return cached;
+      }
+    }
+  }
+  const promise = $fetch(
+    getEndpoint(operation, operationName),
+    {
+      ...state && state.fetchOptions ? state.fetchOptions : {},
+      ...options,
+      method
+    }
+  ).then((v) => {
+    return {
+      ...v,
+      data: v.data,
+      errors: v.errors || []
+    };
+  });
+  if (import.meta.client && cacheOptions?.client && app.$graphqlCache) {
+    app.$graphqlCache.set(key, promise);
+  }
+  return promise;
+}