feat: add support for more ApolloClient configuration options

Author: guendev

packages/nuxt/src/runtime/plugin.ts

@@ -8,18 +8,18 @@ import { createApolloClient } from './utils/createApolloClient'
 
 export default defineNuxtPlugin(async (nuxtApp) => {
     const runTimeconfig = nuxtApp.$config
-    const apolloConfig = runTimeconfig.public.apollo
+    const globalConfig = runTimeconfig.public.apollo
 
-    if (!apolloConfig?.clients) {
+    if (!globalConfig?.clients) {
         throw new Error('[vue3-apollo] No Apollo clients configured')
     }
 
     const apolloClients: Record<string, ApolloClient> = {}
 
-    for (const [clientId, config] of Object.entries(apolloConfig.clients)) {
+    for (const [clientId, config] of Object.entries(globalConfig.clients)) {
         apolloClients[clientId] = await createApolloClient({
             clientId,
-            config: defu(config, omit(apolloConfig, ['clients'])),
+            config: defu(config, omit(globalConfig, ['clients', 'autoImports'])),
             nuxtApp
         })
     }

packages/nuxt/src/runtime/utils/createApolloClient.ts

@@ -14,6 +14,8 @@ import { useCookie } from 'nuxt/app'
 import type { ApolloClientConfig } from '../../type'
 import type { ApolloErrorHookPayload } from '../types'
 
+import { pick } from '../utils/pick'
+
 const APOLLO_STATE_KEY_PREFIX = 'apollo:'
 
 interface CreateApolloClientParams {
@@ -150,21 +152,28 @@ export async function createApolloClient({ clientId, config, nuxtApp }: CreateAp
 
     const retryLink = new RetryLink()
 
-    const defaultOptions: ApolloClient.DefaultOptions = defu({
-        query: {
-            fetchPolicy: import.meta.server ? 'network-only' : 'cache-first'
+    const mergedConfig: Omit<ApolloClient.Options, 'cache' | 'devtools' | 'link' | 'ssrForceFetchDelay' | 'ssrMode'> = defu(
+        {
+            defaultOptions: import.meta.server
+                ? {
+                    query: {
+                        fetchPolicy: 'network-only'
+                    },
+                    watchQuery: {
+                        fetchPolicy: 'network-only'
+                    }
+                }
+                : {}
         },
-        watchQuery: {
-            fetchPolicy: import.meta.server ? 'network-only' : 'cache-first'
-        }
-    }, config.defaultOptions)
+        pick(config, ['assumeImmutableResults', 'dataMasking', 'defaultOptions', 'localState', 'queryDeduplication'])
+    )
 
     // Create an Apollo Client instance
     const client = new ApolloClient({
+        ...mergedConfig,
         cache,
-        defaultOptions,
         devtools: {
-            enabled: config.devtools ?? config.devtools,
+            enabled: config.devtools ?? import.meta.dev,
             name: clientId
         },
         // Combine the auth combinedLink, error combinedLink, and main combinedLink chain

packages/nuxt/src/runtime/utils/pick.ts

@@ -0,0 +1,40 @@
+/**
+ * Creates a new object by picking specified keys from the source object.
+ * Returns a type-safe object with only the picked keys.
+ *
+ * @template T - The type of the source object
+ * @template K - The keys to pick from the object
+ *
+ * @param obj - The source object
+ * @param keys - Array of keys to pick from the object
+ *
+ * @returns A new object with only the specified keys
+ *
+ * @example
+ * ```ts
+ * const user = { id: 1, name: 'John', email: 'john@example.com', password: 'secret' }
+ * const publicUser = pick(user, ['id', 'name'])
+ * // { id: 1, name: 'John' }
+ * ```
+ *
+ * @example
+ * ```ts
+ * const options = { debounce: 300, throttle: 500, prefetch: true, cache: false }
+ * const selected = pick(options, ['prefetch', 'cache'])
+ * // { prefetch: true, cache: false }
+ * ```
+ */
+export function pick<T extends Record<string, any>, K extends keyof T>(
+    obj: T,
+    keys: K[]
+): Pick<T, K> {
+    const result = {} as Pick<T, K>
+
+    for (const key of keys) {
+        if (key in obj) {
+            result[key] = obj[key]
+        }
+    }
+
+    return result
+}

packages/nuxt/src/type.ts

@@ -55,12 +55,6 @@ export interface ApolloModuleOptions extends ApolloSharedConfig {
      * @default true
      */
     autoImports?: boolean
-
-    /**
-     * Enable devtools integration
-     * @default true
-     */
-    devtools?: boolean
 }
 
 /**
@@ -103,7 +97,7 @@ export interface ApolloSharedAuthConfig {
 /**
  * Shared configuration options for Apollo Client and Module
  */
-export interface ApolloSharedConfig {
+export interface ApolloSharedConfig extends Pick<ApolloClient.Options, 'assumeImmutableResults' | 'dataMasking' | 'defaultOptions' | 'localState' | 'queryDeduplication'> {
     /**
      * Tùy chọn bổ sung cho HTTP link.
      * Cho phép tùy chỉnh headers, credentials, fetch options, v.v.
@@ -118,9 +112,9 @@ export interface ApolloSharedConfig {
     httpLinkOptions?: Omit<HttpLink.Options, 'uri'>
 
     /**
-     * Tùy chọn bổ sung cho WebSocket link.
-     * Cho phép tùy chỉnh connection params, retry logic, keepAlive, v.v.
-     * Chỉ có hiệu lực khi `wsEndpoint` được cấu hình.
+     * Additional options for WebSocket link.
+     * Allows customizing connection params, retry logic, keepAlive, etc.
+     * Only effective when `wsEndpoint` is configured.
      *
      * @example
      * ```ts
@@ -138,28 +132,6 @@ export interface ApolloSharedConfig {
      */
     devtools?: boolean
 
-    /**
-     * Default options for Apollo Client operations.
-     * Allows configuration of fetch policies, error handling, polling intervals, etc.
-     *
-     * @example
-     * ```ts
-     * {
-     *   watchQuery: {
-     *     fetchPolicy: 'cache-and-network'
-     *   },
-     *   query: {
-     *     fetchPolicy: 'network-only',
-     *     errorPolicy: 'all'
-     *   },
-     *   mutate: {
-     *     errorPolicy: 'all'
-     *   }
-     * }
-     * ```
-     */
-    defaultOptions?: ApolloClient.DefaultOptions
-
     /**
      * Configuration options for Apollo Client's InMemoryCache.
      * Allows customization of type policies, cache normalization, pagination, etc.