@lewebsimple/nuxt-graphql 0.1.8 → 0.1.10

package/dist/module.d.mts

@@ -3,7 +3,6 @@ import * as _nuxt_schema from '@nuxt/schema';
 interface ModuleOptions {
     endpoint?: string;
     codegen?: {
-        enabled?: boolean;
         pattern?: string;
         schemaOutput?: string;
     };

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@lewebsimple/nuxt-graphql",
   "configKey": "graphql",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,4 +1,4 @@
-import { useLogger, defineNuxtModule, createResolver, getLayerDirectories, addServerTemplate, addServerHandler, addImportsDir, addPlugin, addTypeTemplate } from '@nuxt/kit';
+import { useLogger, defineNuxtModule, createResolver, getLayerDirectories, addServerTemplate, addServerHandler, addImportsDir, addServerImportsDir, addPlugin, addTypeTemplate } from '@nuxt/kit';
 import { existsSync, readFileSync, mkdirSync, writeFileSync } from 'node:fs';
 import { join, dirname, relative } from 'node:path';
 import { glob } from 'tinyglobby';
@@ -44,6 +44,16 @@ function writeFileIfChanged(path, content) {
   return true;
 }
 
+async function loadGraphQLSchema(schemaPath) {
+  const { createJiti } = await import('jiti');
+  const jiti = createJiti(import.meta.url, { interopDefault: true });
+  const module = await jiti.import(schemaPath);
+  if (!module.schema) {
+    throw new Error(`${schemaPath} must export a 'schema' variable`);
+  }
+  const { printSchema, lexicographicSortSchema } = await import('graphql');
+  return printSchema(lexicographicSortSchema(module.schema));
+}
 function analyzeGraphQLDocuments(docs) {
   const byFile = /* @__PURE__ */ new Map();
   const operationsByType = {
@@ -92,9 +102,9 @@ function analyzeGraphQLDocuments(docs) {
   return { byFile, operationsByType };
 }
 function generateRegistryByTypeSource(analysis) {
-  const q = analysis.query.map((o) => o.name);
-  const m = analysis.mutation.map((o) => o.name);
-  const s = analysis.subscription.map((o) => o.name);
+  const queries = analysis.query.map((o) => o.name);
+  const mutations = analysis.mutation.map((o) => o.name);
+  const subscriptions = analysis.subscription.map((o) => o.name);
   const lines = [
     `import type { TypedDocumentNode } from "@graphql-typed-document-node/core";`,
     `import * as ops from "#graphql/operations";`,
@@ -102,11 +112,11 @@ function generateRegistryByTypeSource(analysis) {
     `type ResultOf<T> = T extends { __apiType?: (variables: infer _) => infer R } ? R : never;`,
     `type VariablesOf<T> = T extends { __apiType?: (variables: infer V) => infer _ } ? V : never;`
   ];
-  if (q.length > 0) {
+  if (queries.length > 0) {
     lines.push(
       ``,
       `export const queries = {`,
-      ...q.map((name) => `  ${name}: ops.${name}Document,`),
+      ...queries.map((name) => `  ${name}: ops.${name}Document,`),
       `} as const;`
     );
   } else {
@@ -117,11 +127,11 @@ function generateRegistryByTypeSource(analysis) {
     `export type QueryResult<N extends QueryName> = ResultOf<(typeof queries)[N]>;`,
     `export type QueryVariables<N extends QueryName> = VariablesOf<(typeof queries)[N]>;`
   );
-  if (m.length > 0) {
+  if (mutations.length > 0) {
     lines.push(
       ``,
       `export const mutations = {`,
-      ...m.map((name) => `  ${name}: ops.${name}Document,`),
+      ...mutations.map((name) => `  ${name}: ops.${name}Document,`),
       `} as const;`
     );
   } else {
@@ -132,11 +142,11 @@ function generateRegistryByTypeSource(analysis) {
     `export type MutationResult<N extends MutationName> = ResultOf<(typeof mutations)[N]>;`,
     `export type MutationVariables<N extends MutationName> = VariablesOf<(typeof mutations)[N]>;`
   );
-  if (s.length > 0) {
+  if (subscriptions.length > 0) {
     lines.push(
       ``,
       `export const subscriptions = {`,
-      ...s.map((name) => `  ${name}: ops.${name}Document,`),
+      ...subscriptions.map((name) => `  ${name}: ops.${name}Document,`),
       `} as const;`
     );
   } else {
@@ -164,16 +174,6 @@ function formatDefinitions(defs) {
   };
   return defs.map((def) => `${colorOf(def)}${def.name}${reset}`).join(`${dim} / ${reset}`);
 }
-async function loadGraphQLSchema(schemaPath) {
-  const { createJiti } = await import('jiti');
-  const jiti = createJiti(import.meta.url, { interopDefault: true });
-  const module = await jiti.import(schemaPath);
-  if (!module.schema) {
-    throw new Error(`${schemaPath} must export a 'schema' variable`);
-  }
-  const { printSchema, lexicographicSortSchema } = await import('graphql');
-  return printSchema(lexicographicSortSchema(module.schema));
-}
 async function runCodegen(options) {
   const { sdl, documents, operationsFile } = options;
   if (documents.length === 0) {
@@ -219,13 +219,17 @@ const module$1 = defineNuxtModule({
   defaults: {
     endpoint: "/api/graphql",
     codegen: {
-      enabled: true,
       pattern: "**/*.gql",
       schemaOutput: "server/graphql/schema.graphql"
     }
   },
   async setup(options, nuxt) {
     const { resolve } = createResolver(import.meta.url);
+    if (options.endpoint) {
+      if (!options.endpoint.startsWith("/")) {
+        logger.warn("GraphQL endpoint should start with '/' (e.g., '/api/graphql')");
+      }
+    }
     const { rootDir, serverDir } = nuxt.options;
     const layerDirs = [
       ...getLayerDirectories(nuxt),
@@ -234,7 +238,7 @@ const module$1 = defineNuxtModule({
     const layerServerDirs = layerDirs.map(({ server }) => server);
     const layerRootDirs = layerDirs.map(({ root }) => root);
     const schemaPath = await findSingleFile(layerServerDirs, "graphql/schema.{ts,mjs}", true);
-    const contextPath = await findSingleFile(layerServerDirs, "graphql/context.{ts,mjs}") || resolve("./runtime/server/default-context.ts");
+    const contextPath = await findSingleFile(layerServerDirs, "graphql/context.{ts,mjs}") || resolve("./runtime/server/graphql/default-context.ts");
     nuxt.hook("nitro:config", (config) => {
       config.alias ||= {};
       config.alias["#graphql/schema"] = schemaPath;
@@ -250,53 +254,57 @@ const module$1 = defineNuxtModule({
       logger.success(`GraphQL Yoga ready at ${cyan}${url.replace(/\/$/, "")}${endpoint}${reset}`);
     });
     nuxt.options.runtimeConfig.public.graphql = { endpoint };
-    if (options.codegen?.enabled !== false) {
-      const codegenPattern = options.codegen?.pattern ?? "**/*.gql";
-      const graphqlrcFile = join(rootDir, ".graphqlrc");
-      const operationsFile = join(nuxt.options.buildDir, "graphql/operations.ts");
-      const registryFile = join(nuxt.options.buildDir, "graphql/registry.ts");
-      const schemaOutput = options.codegen?.schemaOutput ?? "server/graphql/schema.graphql";
-      const schemaFile = join(rootDir, schemaOutput);
-      const generate = async () => {
-        const [sdl, documents] = await Promise.all([
-          loadGraphQLSchema(schemaPath),
-          findMultipleFiles(layerRootDirs, codegenPattern)
-        ]);
-        const docs = documents.map((document) => ({ path: document, content: readFileSync(document, "utf-8") }));
-        const analysis = analyzeGraphQLDocuments(docs);
-        for (const doc of docs) {
-          const relativePath = doc.path.startsWith(rootDir) ? doc.path.slice(rootDir.length + 1) : doc.path;
-          const defs = analysis.byFile.get(doc.path) ?? [];
-          logger.info(`${cyan}${relativePath}${reset} [${formatDefinitions(defs)}]`);
-        }
-        await runCodegen({ sdl, documents, operationsFile });
-        if (writeFileIfChanged(schemaFile, sdl)) {
-          logger.info(`GraphQL schema saved to ${cyan}${schemaOutput}${reset}`);
-        }
-        const config = JSON.stringify({ schema: relative(rootDir, schemaFile), documents: codegenPattern }, null, 2);
-        if (writeFileIfChanged(graphqlrcFile, config)) {
-          logger.info(`GraphQL config saved to ${cyan}.graphqlrc${reset}`);
-        }
-        if (writeFileIfChanged(registryFile, generateRegistryByTypeSource(analysis.operationsByType))) {
-          logger.info(`GraphQL registry saved to ${cyan}${relative(rootDir, registryFile)}${reset}`);
+    const codegenPattern = options.codegen?.pattern ?? "**/*.gql";
+    const graphqlrcFile = join(rootDir, ".graphqlrc");
+    const operationsFile = join(nuxt.options.buildDir, "graphql/operations.ts");
+    const registryFile = join(nuxt.options.buildDir, "graphql/registry.ts");
+    nuxt.options.alias["#graphql/operations"] = operationsFile;
+    nuxt.options.alias["#graphql/registry"] = registryFile;
+    const schemaOutput = options.codegen?.schemaOutput ?? "server/graphql/schema.graphql";
+    if (schemaOutput) {
+      if (!schemaOutput.endsWith(".graphql")) {
+        logger.warn(`Schema output '${schemaOutput}' should have .graphql extension.`);
+      }
+    }
+    const schemaFile = join(rootDir, schemaOutput);
+    const generate = async () => {
+      const [sdl, documents] = await Promise.all([
+        loadGraphQLSchema(schemaPath),
+        findMultipleFiles(layerRootDirs, codegenPattern)
+      ]);
+      const docs = documents.map((document) => ({ path: document, content: readFileSync(document, "utf-8") }));
+      const analysis = analyzeGraphQLDocuments(docs);
+      for (const doc of docs) {
+        const relativePath = doc.path.startsWith(rootDir) ? doc.path.slice(rootDir.length + 1) : doc.path;
+        const defs = analysis.byFile.get(doc.path) ?? [];
+        logger.info(`${cyan}${relativePath}${reset} [${formatDefinitions(defs)}]`);
+      }
+      await runCodegen({ sdl, documents, operationsFile });
+      if (writeFileIfChanged(schemaFile, sdl)) {
+        logger.info(`GraphQL schema saved to ${cyan}${schemaOutput}${reset}`);
+      }
+      const config = JSON.stringify({ schema: relative(rootDir, schemaFile), documents: codegenPattern }, null, 2);
+      if (writeFileIfChanged(graphqlrcFile, config)) {
+        logger.info(`GraphQL config saved to ${cyan}.graphqlrc${reset}`);
+      }
+      if (writeFileIfChanged(registryFile, generateRegistryByTypeSource(analysis.operationsByType))) {
+        logger.info(`GraphQL registry saved to ${cyan}${relative(rootDir, registryFile)}${reset}`);
+      }
+    };
+    nuxt.hook("prepare:types", async ({ references }) => {
+      await generate();
+      if (existsSync(operationsFile)) references.push({ path: operationsFile });
+      if (existsSync(registryFile)) references.push({ path: registryFile });
+    });
+    if (nuxt.options.dev) {
+      nuxt.hook("builder:watch", async (event, path) => {
+        if (path.endsWith(".gql")) {
+          await generate();
         }
-      };
-      nuxt.hook("prepare:types", async ({ references }) => {
-        await generate();
-        if (existsSync(operationsFile)) references.push({ path: operationsFile });
-        if (existsSync(registryFile)) references.push({ path: registryFile });
       });
-      if (nuxt.options.dev) {
-        nuxt.hook("builder:watch", async (event, path) => {
-          if (path.endsWith(".gql")) {
-            await generate();
-          }
-        });
-      }
-      nuxt.options.alias["#graphql/operations"] = operationsFile;
-      nuxt.options.alias["#graphql/registry"] = registryFile;
     }
     addImportsDir(resolve("./runtime/composables"));
+    addServerImportsDir(resolve("./runtime/server/utils"));
     addPlugin(resolve("./runtime/plugins/graphql"));
     addTypeTemplate({
       filename: "types/graphql-client.d.ts",

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

@@ -1,10 +1,9 @@
-import { type Ref } from "vue";
 import { type MutationName, type MutationResult, type MutationVariables } from "#graphql/registry";
-type IsEmptyObject<T> = T extends Record<string, never> ? true : keyof T extends never ? true : false;
+import type { IsEmptyObject } from "../utils/helpers.js";
 export declare function useGraphQLMutation<N extends MutationName>(operationName: N): {
-    mutate: (...args: IsEmptyObject<MutationVariables<N>> extends true ? [variables?: MutationVariables<N>] : [variables: MutationVariables<N>]) => Promise<MutationResult<N>>;
-    data: Ref<MutationResult<N> | null, MutationResult<N> | null>;
-    error: Ref<Error | null, Error | null>;
-    pending: Ref<boolean, boolean>;
+    mutate: (...args: IsEmptyObject<MutationVariables<N>> extends true ? [variables?: MutationVariables<N>, headers?: HeadersInit] : [variables: MutationVariables<N>, headers?: HeadersInit]) => Promise<{
+        data: MutationResult<N> | null;
+        error: Error | null;
+    }>;
+    pending: import("vue").Ref<boolean, boolean>;
 };
-export {};

package/dist/runtime/composables/useGraphQLMutation.js

@@ -1,25 +1,22 @@
 import { ref } from "vue";
-import { useGraphQL } from "./useGraphQL.js";
+import { useNuxtApp } from "#imports";
 import { mutations } from "#graphql/registry";
 export function useGraphQLMutation(operationName) {
   const document = mutations[operationName];
-  const { request } = useGraphQL();
-  const data = ref(null);
-  const error = ref(null);
+  const { $graphql } = useNuxtApp();
   const pending = ref(false);
   async function mutate(...args) {
     pending.value = true;
-    error.value = null;
     try {
-      const result = await request(document, args[0]);
-      data.value = result;
-      return result;
+      const [variables, headers] = args;
+      const result = await $graphql().request(document, variables, headers);
+      return { data: result, error: null };
     } catch (e) {
-      error.value = e instanceof Error ? e : new Error(String(e));
-      throw e;
+      const error = e instanceof Error ? e : new Error(String(e));
+      return { data: null, error };
     } finally {
       pending.value = false;
     }
   }
-  return { mutate, data, error, pending };
+  return { mutate, pending };
 }

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

@@ -1,5 +1,4 @@
 import type { AsyncData, AsyncDataOptions } from "#app";
 import { type QueryName, type QueryResult, type QueryVariables } from "#graphql/registry";
-type IsEmptyObject<T> = T extends Record<string, never> ? true : keyof T extends never ? true : false;
-export declare function useGraphQLQuery<N extends QueryName>(operationName: N, ...args: IsEmptyObject<QueryVariables<N>> extends true ? [variables?: QueryVariables<N>, opts?: AsyncDataOptions<QueryResult<N>>] : [variables: QueryVariables<N>, opts?: AsyncDataOptions<QueryResult<N>>]): AsyncData<QueryResult<N>, Error | null>;
-export {};
+import type { IsEmptyObject } from "../utils/helpers.js";
+export declare function useGraphQLQuery<N extends QueryName>(operationName: N, ...args: IsEmptyObject<QueryVariables<N>> extends true ? [variables?: QueryVariables<N>, options?: AsyncDataOptions<QueryResult<N>>, headers?: HeadersInit] : [variables: QueryVariables<N>, options?: AsyncDataOptions<QueryResult<N>>, headers?: HeadersInit]): AsyncData<QueryResult<N>, Error | null>;

package/dist/runtime/composables/useGraphQLQuery.js

@@ -1,11 +1,10 @@
-import { useAsyncData } from "#imports";
+import { useAsyncData, useNuxtApp } from "#imports";
 import { hash } from "ohash";
-import { useGraphQL } from "./useGraphQL.js";
 import { queries } from "#graphql/registry";
 export function useGraphQLQuery(operationName, ...args) {
+  const { $graphql } = useNuxtApp();
   const document = queries[operationName];
-  const [variables, opts] = args;
-  const { request } = useGraphQL();
-  const key = `gql:q:${operationName}:${hash(variables ?? {})}`;
-  return useAsyncData(key, () => request(document, variables), opts);
+  const [variables, options, headers] = args;
+  const key = `graphql:query:${operationName}:${hash(variables ?? {})}`;
+  return useAsyncData(key, () => $graphql().request(document, variables, headers), options);
 }

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

@@ -0,0 +1,10 @@
+import { type MaybeRefOrGetter, type Ref } from "vue";
+import { type SubscriptionName, type SubscriptionResult, type SubscriptionVariables } from "#graphql/registry";
+import type { IsEmptyObject } from "../utils/helpers.js";
+export type UseGraphQLSubscriptionReturn<N extends SubscriptionName> = {
+    data: Ref<SubscriptionResult<N> | null>;
+    error: Ref<Error | null>;
+    start: () => void;
+    stop: () => void;
+};
+export declare function useGraphQLSubscription<N extends SubscriptionName>(operationName: N, ...args: IsEmptyObject<SubscriptionVariables<N>> extends true ? [variables?: MaybeRefOrGetter<SubscriptionVariables<N>>] : [variables: MaybeRefOrGetter<SubscriptionVariables<N>>]): UseGraphQLSubscriptionReturn<N>;

package/dist/runtime/composables/useGraphQLSubscription.js

@@ -0,0 +1,45 @@
+import { ref, onScopeDispose, toValue } from "vue";
+import { print } from "graphql";
+import { useNuxtApp } from "#imports";
+import { subscriptions } from "#graphql/registry";
+export function useGraphQLSubscription(operationName, ...args) {
+  const { $graphqlSSE } = useNuxtApp();
+  const [variables] = args;
+  const data = ref(null);
+  const error = ref(null);
+  let unsubscribe = null;
+  function start() {
+    stop();
+    error.value = null;
+    unsubscribe = $graphqlSSE().subscribe(
+      {
+        query: print(subscriptions[operationName]),
+        variables: toValue(variables)
+      },
+      {
+        next: (result) => {
+          if (result.errors?.length) {
+            error.value = new Error(result.errors.map((e) => e.message).join(", "));
+          } else if (result.data) {
+            data.value = result.data;
+          }
+        },
+        error: (e) => {
+          error.value = e instanceof Error ? e : new Error(String(e));
+        },
+        complete: () => {
+          unsubscribe = null;
+        }
+      }
+    );
+  }
+  function stop() {
+    unsubscribe?.();
+    unsubscribe = null;
+  }
+  if (import.meta.client) {
+    start();
+  }
+  onScopeDispose(stop);
+  return { data, error, start, stop };
+}

package/dist/runtime/plugins/graphql.d.ts

@@ -1,7 +1,10 @@
 import { GraphQLClient } from "graphql-request";
+import { type Client as SSEClient } from "graphql-sse";
 declare const _default: import("nuxt/app").Plugin<{
-    graphql: GraphQLClient;
+    graphql: () => GraphQLClient;
+    graphqlSSE: () => SSEClient;
 }> & import("nuxt/app").ObjectPlugin<{
-    graphql: GraphQLClient;
+    graphql: () => GraphQLClient;
+    graphqlSSE: () => SSEClient;
 }>;
 export default _default;

package/dist/runtime/plugins/graphql.js

@@ -1,12 +1,35 @@
 import { GraphQLClient } from "graphql-request";
-import { defineNuxtPlugin, useRequestURL, useRuntimeConfig } from "#imports";
+import { createClient } from "graphql-sse";
+import { defineNuxtPlugin, useRequestHeaders, useRequestURL, useRuntimeConfig } from "#imports";
 export default defineNuxtPlugin(() => {
-  const config = useRuntimeConfig();
+  const { public: { graphql: { endpoint } } } = useRuntimeConfig();
   const { origin } = useRequestURL();
-  const client = new GraphQLClient(`${origin}${config.public.graphql.endpoint}`);
+  const url = `${origin}${endpoint}`;
+  let client = null;
+  const getClient = () => {
+    if (!client) {
+      client = new GraphQLClient(url);
+    }
+    if (import.meta.server) {
+      const headers = useRequestHeaders(["cookie", "authorization"]);
+      client.setHeaders(headers);
+    }
+    return client;
+  };
+  let sseClient = null;
+  const getSSEClient = () => {
+    if (import.meta.server) {
+      throw new Error("SSE subscriptions are not available on the server");
+    }
+    if (!sseClient) {
+      sseClient = createClient({ url });
+    }
+    return sseClient;
+  };
   return {
     provide: {
-      graphql: client
+      graphql: getClient,
+      graphqlSSE: getSSEClient
     }
   };
 });

package/dist/runtime/server/utils/graphql-client.d.ts

@@ -0,0 +1,15 @@
+import type { H3Event } from "h3";
+import { GraphQLClient } from "graphql-request";
+/**
+ * Create server-side GraphQL client instance for the given H3 event.
+ *
+ * @param event H3 event
+ *
+ * @returns GraphQL client instance
+ */
+export declare function getGraphQLClient(event: H3Event): GraphQLClient;
+declare module "h3" {
+    interface H3EventContext {
+        __nuxtGraphQLClient?: GraphQLClient;
+    }
+}

package/dist/runtime/server/utils/graphql-client.js

@@ -0,0 +1,14 @@
+import { getRequestHeaders, getRequestURL } from "h3";
+import { GraphQLClient } from "graphql-request";
+import { useRuntimeConfig } from "#imports";
+export function getGraphQLClient(event) {
+  if (event.context.__nuxtGraphQLClient) {
+    return event.context.__nuxtGraphQLClient;
+  }
+  const { public: { graphql: { endpoint } } } = useRuntimeConfig();
+  const { origin } = getRequestURL(event);
+  const url = `${origin}${endpoint}`;
+  const headers = getRequestHeaders(event);
+  event.context.__nuxtGraphQLClient = new GraphQLClient(url, { headers });
+  return event.context.__nuxtGraphQLClient;
+}

package/dist/runtime/server/utils/useGraphQLMutation.d.ts

@@ -0,0 +1,9 @@
+import type { H3Event } from "h3";
+import { type MutationName, type MutationResult, type MutationVariables } from "#graphql/registry";
+import type { IsEmptyObject } from "../../utils/helpers.js";
+export declare function useGraphQLMutation<N extends MutationName>(event: H3Event, operationName: N): Promise<{
+    mutate: (...args: IsEmptyObject<MutationVariables<N>> extends true ? [variables?: MutationVariables<N>, headers?: HeadersInit] : [variables: MutationVariables<N>, headers?: HeadersInit]) => Promise<{
+        data: MutationResult<N> | null;
+        error: Error | null;
+    }>;
+}>;

package/dist/runtime/server/utils/useGraphQLMutation.js

@@ -0,0 +1,16 @@
+import { getGraphQLClient } from "./graphql-client.js";
+import { mutations } from "#graphql/registry";
+export async function useGraphQLMutation(event, operationName) {
+  const client = getGraphQLClient(event);
+  async function mutate(...args) {
+    try {
+      const [variables, headers] = args;
+      const result = await client.request(mutations[operationName], variables, headers);
+      return { data: result, error: null };
+    } catch (e) {
+      const error = e instanceof Error ? e : new Error(String(e));
+      return { data: null, error };
+    }
+  }
+  return { mutate };
+}

package/dist/runtime/server/utils/useGraphQLQuery.d.ts

@@ -0,0 +1,4 @@
+import type { H3Event } from "h3";
+import { type QueryName, type QueryResult, type QueryVariables } from "#graphql/registry";
+import type { IsEmptyObject } from "../../utils/helpers.js";
+export declare function useGraphQLQuery<N extends QueryName>(event: H3Event, operationName: N, ...args: IsEmptyObject<QueryVariables<N>> extends true ? [variables?: QueryVariables<N>, headers?: HeadersInit] : [variables: QueryVariables<N>, headers?: HeadersInit]): Promise<QueryResult<N>>;

package/dist/runtime/server/utils/useGraphQLQuery.js

@@ -0,0 +1,7 @@
+import { getGraphQLClient } from "./graphql-client.js";
+import { queries } from "#graphql/registry";
+export async function useGraphQLQuery(event, operationName, ...args) {
+  const client = getGraphQLClient(event);
+  const [variables, headers] = args;
+  return client.request(queries[operationName], variables, headers);
+}

package/dist/runtime/types/graphql-client.d.ts

@@ -1,8 +1,10 @@
 import type { GraphQLClient } from "graphql-request";
+import type { Client as SSEClient } from "graphql-sse";
 
 declare module "#app" {
   interface NuxtApp {
-    $graphql: GraphQLClient;
+    $graphql: () => GraphQLClient;
+    $graphqlSSE: () => SSEClient;
   }
 }
 

package/dist/runtime/utils/helpers.d.ts

@@ -0,0 +1 @@
+export type IsEmptyObject<T> = T extends Record<string, never> ? true : keyof T extends never ? true : false;

package/dist/templates/yoga-handler.mjs

@@ -1,7 +1,8 @@
 import { createYoga } from "graphql-yoga";
-import { defineEventHandler, toWebRequest, sendWebResponse } from "h3";
+import { defineEventHandler, toWebRequest, sendWebResponse, createError } from "h3";
 import { schema } from "#graphql/schema";
 import { createContext } from "#graphql/context";
+import { useLogger } from "@nuxt/kit";
 
 let yoga = null;
 
@@ -11,14 +12,24 @@ function getYoga() {
       schema,
       graphqlEndpoint: "{{endpoint}}",
       fetchAPI: globalThis,
+      graphiql: process.env.NODE_ENV !== "production",
+      subscriptions: { protocol: "SSE" },
     });
   }
   return yoga;
 }
 
 export default defineEventHandler(async (event) => {
-  const request = toWebRequest(event);
-  const context = await createContext(event);
-  const response = await getYoga().handleRequest(request, context);
-  return sendWebResponse(event, response);
+  const logger = useLogger();
+  try {
+    const request = toWebRequest(event);
+    const context = await createContext(event);
+    const response = await getYoga().handleRequest(request, context);
+    return sendWebResponse(event, response);
+  }
+  catch (error) {
+    const message = error instanceof Error ? error.message : String(error);
+    logger.error("GraphQL Server Error:", message);
+    throw createError({ statusCode: 500, message: "GraphQL server error" });
+  }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lewebsimple/nuxt-graphql",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "Opinionated Nuxt module for using GraphQL",
   "repository": "lewebsimple/nuxt-graphql",
   "license": "MIT",
@@ -42,7 +42,8 @@
     "@nuxt/kit": "^4.2.2",
     "graphql": "^16.12.0",
     "graphql-request": "^7.4.0",
-    "graphql-yoga": "^5.17.1",
+    "graphql-sse": "^2.6.0",
+    "graphql-yoga": "^5.18.0",
     "jiti": "^2.6.1",
     "ohash": "^2.0.11",
     "tinyglobby": "^0.2.15"
@@ -59,8 +60,8 @@
     "eslint": "^9.39.2",
     "nuxt": "^4.2.2",
     "typescript": "~5.9.3",
-    "vitest": "^4.0.15",
-    "vue-tsc": "^3.1.8"
+    "vitest": "^4.0.16",
+    "vue-tsc": "^3.2.1"
   },
   "publishConfig": {
     "access": "public"

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

@@ -1,4 +0,0 @@
-import type { TypedDocumentNode } from "@graphql-typed-document-node/core";
-export declare function useGraphQL(): {
-    request: <TResult, TVariables extends Record<string, unknown> | undefined>(document: TypedDocumentNode<TResult, TVariables>, variables?: TVariables) => Promise<TResult>;
-};

package/dist/runtime/composables/useGraphQL.js

@@ -1,8 +0,0 @@
-import { useNuxtApp } from "#imports";
-export function useGraphQL() {
-  const { $graphql } = useNuxtApp();
-  async function request(document, variables) {
-    return $graphql.request({ document, variables });
-  }
-  return { request };
-}