@lewebsimple/nuxt-graphql 0.7.11 → 0.7.12

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-graphql",
   "configKey": "graphql",
-  "version": "0.7.11",
+  "version": "0.7.12",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -16,7 +16,7 @@ import zodPreset from '@lewebsimple/graphql-codegen-zod';
 import { createRequire } from 'node:module';
 import { resolveCacheConfig } from '../dist/runtime/app/lib/cache-config.js';
 
-const version = "0.7.11";
+const version = "0.7.12";
 
 const buildCache = /* @__PURE__ */ new Map();
 function getCachedLoader(baseKey, loader) {

package/dist/runtime/app/composables/useGraphQLLoadMore.d.ts

@@ -16,11 +16,11 @@ type Connection<TItem> = {
  * @returns An object containing the items, loading state, error state, and pagination functions.
  */
 export declare function useGraphQLLoadMore<TName extends QueryName, TConnection extends Connection<unknown>>(operationName: TName, variables: MaybeRefOrGetter<Omit<VariablesOf<TName>, "after">>, getConnection: (data?: ResultOf<TName>) => TConnection | null | undefined): Promise<{
-    items: any;
-    pending: any;
-    error: any;
-    hasNextPage: any;
-    isLoadingMore: any;
+    items: import("vue").ShallowRef<TConnection["nodes"][number][], TConnection["nodes"][number][]>;
+    pending: import("vue").Ref<boolean, boolean>;
+    error: import("vue").Ref<import("../../shared/utils/error.js").NormalizedError | undefined, import("../../shared/utils/error.js").NormalizedError | undefined>;
+    hasNextPage: import("vue").ComputedRef<boolean>;
+    isLoadingMore: import("vue").Ref<boolean, boolean>;
     loadMore: () => void;
     reset: () => void;
 }>;

package/dist/runtime/app/composables/useGraphQLLoadMore.js

@@ -1,5 +1,5 @@
 import { hash } from "ohash";
-import { computed, ref, shallowRef, toValue, watchEffect } from "vue";
+import { computed, ref, shallowRef, toValue, watch } from "vue";
 import { useAsyncGraphQLQuery } from "./useAsyncGraphQLQuery.js";
 export async function useGraphQLLoadMore(operationName, variables, getConnection) {
   const after = ref(null);
@@ -16,20 +16,29 @@ export async function useGraphQLLoadMore(operationName, variables, getConnection
   const connection = computed(() => getConnection(query.data.value));
   const hasNextPage = computed(() => connection.value?.pageInfo?.hasNextPage ?? false);
   const endCursor = computed(() => connection.value?.pageInfo?.endCursor ?? null);
+  items.value = connection.value?.nodes ?? [];
   let lastInputHash = baseVariablesHash.value;
-  watchEffect(() => {
-    const newItems = connection.value?.nodes ?? [];
-    if (baseVariablesHash.value !== lastInputHash) {
-      lastInputHash = baseVariablesHash.value;
-      reset();
-    }
-    if (after.value === null) {
-      items.value = newItems;
-    } else if (isLoadingMore.value) {
-      items.value = [...items.value, ...newItems];
-    }
-    isLoadingMore.value = false;
+  watch(baseVariablesHash, (newHash) => {
+    if (newHash === lastInputHash) return;
+    lastInputHash = newHash;
+    after.value = null;
+    lastRequestedCursor.value = null;
+    items.value = [];
   });
+  watch(
+    () => query.pending.value,
+    (pending, wasPending) => {
+      if (pending || !wasPending) return;
+      const newItems = connection.value?.nodes ?? [];
+      if (after.value === null) {
+        items.value = newItems;
+      } else if (isLoadingMore.value) {
+        items.value = [...items.value, ...newItems];
+      }
+      isLoadingMore.value = false;
+    },
+    { flush: "post" }
+  );
   function loadMore() {
     const cursor = endCursor.value;
     if (isLoadingMore.value || !hasNextPage.value || !cursor || cursor === lastRequestedCursor.value) {

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

@@ -50,6 +50,6 @@ export type MutationHooks<TName extends MutationName, TContext = unknown> = {
  * @returns Mutation executor and pending state.
  */
 export declare function useGraphQLMutation<TName extends MutationName, TContext = unknown>(operationName: TName, hooks?: MutationHooks<TName, TContext>): {
-    pending: any;
-    mutate: (variables: VariablesInputOf<TName>) => Promise<any>;
+    pending: import("vue").ComputedRef<boolean>;
+    mutate: (variables: VariablesInputOf<TName>) => Promise<ExecuteGraphQLResult<TName>>;
 };

package/dist/runtime/app/plugins/graphql-sse.client.d.ts

@@ -4,7 +4,11 @@ import { type Client as SSEClient } from "graphql-sse";
  *
  * @returns Nuxt plugin with SSE client provider.
  */
-declare const _default: any;
+declare const _default: import("#app").Plugin<{
+    getGraphQLSSEClient: () => SSEClient;
+}> & import("#app").ObjectPlugin<{
+    getGraphQLSSEClient: () => SSEClient;
+}>;
 export default _default;
 declare module "#app/nuxt" {
     interface NuxtApp {

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

@@ -5,7 +5,11 @@ import type { OperationName } from "../../shared/utils/registry.js";
  *
  * @returns Nuxt plugin with GraphQL operation executor.
  */
-declare const _default: any;
+declare const _default: import("#app").Plugin<{
+    executeOperation: <TName extends OperationName>(input: ExecuteGraphQLInput<TName>) => Promise<ExecuteGraphQLResult<TName>>;
+}> & import("#app").ObjectPlugin<{
+    executeOperation: <TName extends OperationName>(input: ExecuteGraphQLInput<TName>) => Promise<ExecuteGraphQLResult<TName>>;
+}>;
 export default _default;
 type ExecuteGraphQL = <TName extends OperationName>(input: ExecuteGraphQLInput<TName>) => Promise<ExecuteGraphQLResult<TName>>;
 declare module "#app/nuxt" {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lewebsimple/nuxt-graphql",
-  "version": "0.7.11",
+  "version": "0.7.12",
   "description": "Opinionated Nuxt module for using GraphQL",
   "license": "AGPL-3.0-only",
   "repository": "lewebsimple/nuxt-graphql",