@tanstack/ai-react 0.19.3 → 0.21.1

package/src/types.ts

@@ -1,5 +1,6 @@
 import type {
   AnyClientTool,
+  InterruptDefinition,
   InferSchemaType,
   ModelMessage,
   RunAgentResumeItem,
@@ -10,7 +11,7 @@ import type {
   BoundInterrupts,
   ChatClientOptions,
   ChatClientState,
-  ChatInterrupt,
+  ResolvableChatInterrupt,
   ChatInterruptState,
   ChatRequestBody,
   ChatResumeState,
@@ -83,8 +84,10 @@ export type UseChatOptions<
   TTools extends ReadonlyArray<AnyClientTool> = any,
   TSchema extends SchemaInput | undefined = undefined,
   TContext = InferredClientContext<TTools>,
+  TInterrupts extends ReadonlyArray<InterruptDefinition<any, any, any, any>> =
+    readonly [],
 > = DistributedOmit<
-  ChatClientOptions<TTools, TContext>,
+  ChatClientOptions<TTools, TContext, TInterrupts>,
   | 'onMessagesChange'
   | 'onLoadingChange'
   | 'onErrorChange'
@@ -97,10 +100,6 @@ export type UseChatOptions<
   | 'onRunIdChange'
   | 'context'
   | 'devtools'
-  // `id` is not a hook option: the hook's identity is its `threadId`, which is
-  // also the persistence key. Persist across reloads by passing a stable
-  // `threadId`; there is no separate id to set.
-  | 'id'
 > & {
   /** Display options for TanStack AI Devtools. */
   devtools?: AIDevtoolsDisplayOptions
@@ -126,9 +125,12 @@ export type UseChatOptions<
 export type UseChatReturn<
   TTools extends ReadonlyArray<AnyClientTool> = any,
   TSchema extends SchemaInput | undefined = undefined,
+  TInterrupts extends ReadonlyArray<InterruptDefinition<any, any, any, any>> =
+    readonly [],
 > = BaseUseChatReturn<
   TTools,
-  TSchema extends SchemaInput ? InferSchemaType<TSchema> : unknown
+  TSchema extends SchemaInput ? InferSchemaType<TSchema> : unknown,
+  TInterrupts
 > &
   (TSchema extends SchemaInput
     ? {
@@ -151,6 +153,8 @@ export type UseChatReturn<
 interface BaseUseChatReturn<
   TTools extends ReadonlyArray<AnyClientTool> = any,
   TData = unknown,
+  TInterrupts extends ReadonlyArray<InterruptDefinition<any, any, any, any>> =
+    readonly [],
 > {
   /**
    * Current messages in the conversation. When `outputSchema` is supplied,
@@ -218,14 +222,18 @@ interface BaseUseChatReturn<
    * it, correlate a log line).
    */
   runId: string | null
-  interrupts: BoundInterrupts<TTools>
+  interrupts: BoundInterrupts<TTools, TInterrupts>
   /** @deprecated Use `interrupts`. */
-  pendingInterrupts: BoundInterrupts<TTools>
-  interruptErrors: ChatInterruptState<TTools>['interruptErrors']
+  pendingInterrupts: BoundInterrupts<TTools, TInterrupts>
+  interruptErrors: ChatInterruptState<TTools, TInterrupts>['interruptErrors']
   resuming: boolean
   resolveInterrupts: {
     (approved: boolean): void
-    (resolver: (interrupt: ChatInterrupt<TTools>) => undefined): void
+    (
+      resolver: (
+        interrupt: ResolvableChatInterrupt<TTools, TInterrupts>,
+      ) => undefined,
+    ): void
   }
   cancelInterrupts: () => void
   retryInterrupts: () => void

package/src/use-chat.ts

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'
 import type {
   AnyClientTool,
   InferSchemaType,
+  InterruptDefinition,
   ModelMessage,
   RunAgentResumeItem,
   SchemaInput,
@@ -11,7 +12,7 @@ import type {
 } from '@tanstack/ai/client'
 import type {
   ChatClientState,
-  ChatInterrupt,
+  ResolvableChatInterrupt,
   ChatInterruptState,
   ChatResumeState,
   ConnectionStatus,
@@ -36,13 +37,15 @@ export function useChat<
   const TTools extends ReadonlyArray<AnyClientTool> = any,
   TSchema extends SchemaInput | undefined = undefined,
   TContext = InferredClientContext<TTools>,
+  const TInterrupts extends ReadonlyArray<
+    InterruptDefinition<any, any, any, any>
+  > = readonly [],
 >(
-  options: UseChatOptions<TTools, TSchema, TContext>,
-): UseChatReturn<TTools, TSchema> {
-  // The hook's identity is its `threadId` — also the persistence key, so a
-  // reload with the same `threadId` restores the same conversation. `hookId` is
-  // only a stable fallback for React's client-recreation keying when no
-  // `threadId` is given (an ephemeral chat), never a persistence key.
+  options: UseChatOptions<TTools, TSchema, TContext, TInterrupts>,
+): UseChatReturn<TTools, TSchema, TInterrupts> {
+  // The hook's identity is its `threadId`. Reload with the same `threadId`
+  // restores the same conversation. `hookId` is only a React recreation key
+  // when no `threadId` is given. It is never sent on the wire.
   const hookId = useId()
   const clientId = options.threadId ?? hookId
 
@@ -59,7 +62,7 @@ export function useChat<
   const [queue, setQueue] = useState<Array<QueuedMessage>>([])
   const [runId, setRunId] = useState<string | null>(null)
   const [interruptState, setInterruptState] = useState<
-    ChatInterruptState<TTools>
+    ChatInterruptState<TTools, TInterrupts>
   >(() => ({
     interrupts: EMPTY_INTERRUPTS,
     pendingInterrupts: EMPTY_INTERRUPTS,
@@ -89,7 +92,8 @@ export function useChat<
   messagesRef.current = messages
 
   // Track current options in a ref to avoid recreating client when options change
-  const optionsRef = useRef<UseChatOptions<TTools, TSchema, TContext>>(options)
+  const optionsRef =
+    useRef<UseChatOptions<TTools, TSchema, TContext, TInterrupts>>(options)
   optionsRef.current = options
 
   const syncResumeState = useCallback((target: ChatClient | null) => {
@@ -99,7 +103,7 @@ export function useChat<
   }, [])
 
   // Create ChatClient instance with callbacks to sync state
-  const client = useMemo(() => {
+  const { client, initialization } = useMemo(() => {
     const messagesToUse = options.initialMessages || []
     isFirstMountRef.current = false
 
@@ -113,7 +117,7 @@ export function useChat<
       : { fetcher: initialOptions.fetcher }
 
     const instanceHolder: {
-      current: ChatClient<TTools, TContext> | undefined
+      current: ChatClient<TTools, TContext, TInterrupts> | undefined
     } = { current: undefined }
     const getActiveInstance = () => {
       const currentInstance = instanceHolder.current
@@ -122,21 +126,43 @@ export function useChat<
       }
       return currentInstance
     }
-    const pendingInitializationErrors: Array<Error> = []
-    const instance = new ChatClient<TTools, TContext>({
+    // ChatClient may publish while its constructor is running or while async
+    // persistence resolves before commit. Preserve those exact notifications
+    // until this render commits; invoking them here would run state setters and
+    // user callbacks for a client React may abandon.
+    const initializationState = {
+      ready: false,
+      callbacks: [] as Array<() => void>,
+    }
+    const runOrQueueForActiveInstance = (callback: () => void) => {
+      if (!initializationState.ready) {
+        initializationState.callbacks.push(callback)
+        return
+      }
+      const currentInstance = instanceHolder.current
+      if (!currentInstance || activeClientRef.current !== currentInstance)
+        return
+      callback()
+    }
+    const instance = new ChatClient<TTools, TContext, TInterrupts>({
       devtoolsBridgeFactory: createChatDevtoolsBridge,
       ...transport,
       initialMessages: messagesToUse,
+      ...(typeof initialOptions.threadId === 'string' &&
+      initialOptions.persistence
+        ? {
+            persistence: initialOptions.persistence,
+            threadId: initialOptions.threadId,
+          }
+        : {
+            ...(initialOptions.threadId !== undefined && {
+              threadId: initialOptions.threadId,
+            }),
+          }),
       ...(initialOptions.body !== undefined && { body: initialOptions.body }),
-      ...(initialOptions.threadId !== undefined && {
-        threadId: initialOptions.threadId,
-      }),
       ...(initialOptions.forwardedProps !== undefined && {
         forwardedProps: initialOptions.forwardedProps,
       }),
-      ...(initialOptions.persistence !== undefined && {
-        persistence: initialOptions.persistence,
-      }),
       ...(initialOptions.initialResumeSnapshot !== undefined && {
         initialResumeSnapshot: initialOptions.initialResumeSnapshot,
       }),
@@ -150,100 +176,131 @@ export function useChat<
         outputKind: initialOptions.outputSchema ? 'structured' : 'chat',
       },
       onResponse: (response) => {
+        // ChatClient awaits this return value. Queuing would drop the promise.
         if (!getActiveInstance()) return
-        void optionsRef.current.onResponse?.(response)
+        return optionsRef.current.onResponse?.(response)
       },
       onChunk: (chunk: StreamChunk) => {
-        if (!getActiveInstance()) return
-        optionsRef.current.onChunk?.(chunk)
+        runOrQueueForActiveInstance(() => {
+          optionsRef.current.onChunk?.(chunk)
+        })
       },
       onFinish: (message: UIMessage<TTools>) => {
-        if (!getActiveInstance()) return
-        optionsRef.current.onFinish?.(message)
+        runOrQueueForActiveInstance(() => {
+          optionsRef.current.onFinish?.(message)
+        })
       },
       onError: (error: Error) => {
-        const currentInstance = instanceHolder.current
-        if (!currentInstance) {
-          pendingInitializationErrors.push(error)
-          return
-        }
-        if (activeClientRef.current !== currentInstance) return
-        optionsRef.current.onError?.(error)
+        runOrQueueForActiveInstance(() => {
+          optionsRef.current.onError?.(error)
+        })
       },
       ...(initialOptions.tools !== undefined && {
         tools: initialOptions.tools,
       }),
+      ...(initialOptions.interrupts !== undefined && {
+        interrupts: initialOptions.interrupts,
+      }),
       onCustomEvent: (eventType, data, context) => {
-        if (!getActiveInstance()) return
-        optionsRef.current.onCustomEvent?.(eventType, data, context)
+        runOrQueueForActiveInstance(() => {
+          optionsRef.current.onCustomEvent?.(eventType, data, context)
+        })
       },
       ...(options.streamProcessor !== undefined && {
         streamProcessor: options.streamProcessor,
       }),
       onMessagesChange: (newMessages: Array<UIMessage<TTools>>) => {
-        if (!getActiveInstance()) return
-        setMessages(newMessages)
+        runOrQueueForActiveInstance(() => {
+          setMessages(newMessages)
+        })
       },
       onLoadingChange: (newIsLoading: boolean) => {
-        const currentInstance = getActiveInstance()
-        if (!currentInstance) return
-        setIsLoading(newIsLoading)
-        syncResumeState(currentInstance)
+        runOrQueueForActiveInstance(() => {
+          const currentInstance = getActiveInstance()
+          if (!currentInstance) return
+          setIsLoading(newIsLoading)
+          syncResumeState(currentInstance)
+        })
       },
       onErrorChange: (newError: Error | undefined) => {
-        if (!getActiveInstance()) return
-        setError(newError)
+        runOrQueueForActiveInstance(() => {
+          setError(newError)
+        })
       },
       onStatusChange: (status: ChatClientState) => {
-        if (!getActiveInstance()) return
-        setStatus(status)
+        runOrQueueForActiveInstance(() => {
+          setStatus(status)
+        })
       },
       onSubscriptionChange: (nextIsSubscribed: boolean) => {
-        if (!getActiveInstance()) return
-        setIsSubscribed(nextIsSubscribed)
+        runOrQueueForActiveInstance(() => {
+          setIsSubscribed(nextIsSubscribed)
+        })
       },
       onConnectionStatusChange: (nextStatus: ConnectionStatus) => {
-        if (!getActiveInstance()) return
-        setConnectionStatus(nextStatus)
+        runOrQueueForActiveInstance(() => {
+          setConnectionStatus(nextStatus)
+        })
       },
       onSessionGeneratingChange: (isGenerating: boolean) => {
-        if (!getActiveInstance()) return
-        setSessionGenerating(isGenerating)
+        runOrQueueForActiveInstance(() => {
+          setSessionGenerating(isGenerating)
+        })
       },
       ...(optionsRef.current.queue !== undefined && {
         queue: optionsRef.current.queue,
       }),
       onQueueChange: (nextQueue: Array<QueuedMessage>) => {
-        if (activeClientRef.current !== instance) return
-        setQueue(nextQueue)
+        runOrQueueForActiveInstance(() => {
+          setQueue(nextQueue)
+        })
       },
       onRunIdChange: (nextRunId) => {
-        if (!getActiveInstance()) return
-        setRunId(nextRunId)
+        runOrQueueForActiveInstance(() => {
+          setRunId(nextRunId)
+        })
       },
       onResumeStateChange: (_nextResumeState, nextPendingInterrupts) => {
-        if (!getActiveInstance()) return
-        setInterruptState((current) => ({
-          ...current,
-          interrupts: nextPendingInterrupts,
-          pendingInterrupts: nextPendingInterrupts,
-        }))
+        runOrQueueForActiveInstance(() => {
+          setInterruptState((current) => ({
+            ...current,
+            interrupts: nextPendingInterrupts,
+            pendingInterrupts: nextPendingInterrupts,
+          }))
+        })
       },
-      onInterruptStateChange: (nextInterruptState) => {
-        if (!getActiveInstance()) return
-        setInterruptState(nextInterruptState)
-        optionsRef.current.onInterruptStateChange?.(nextInterruptState)
+      onInterruptStateChange: (nextInterruptState, context) => {
+        runOrQueueForActiveInstance(() => {
+          setInterruptState(nextInterruptState)
+          optionsRef.current.onInterruptStateChange?.(
+            nextInterruptState,
+            context,
+          )
+        })
       },
     })
     instanceHolder.current = instance
-    activeClientRef.current = instance
-    for (const error of pendingInitializationErrors) {
-      if (activeClientRef.current !== instance) break
-      optionsRef.current.onError?.(error)
-    }
-    return instance
+    return { client: instance, initialization: initializationState }
   }, [clientId, syncResumeState])
 
+  useEffect(() => {
+    activeClientRef.current = client
+    try {
+      // Keep initialization closed while draining so callbacks published by a
+      // queued callback are appended and delivered in the same commit.
+      while (initialization.callbacks.length > 0) {
+        if (activeClientRef.current !== client) {
+          initialization.callbacks.length = 0
+          break
+        }
+        initialization.callbacks.shift()?.()
+      }
+    } finally {
+      // A throw from a queued user callback must not leave the queue closed.
+      initialization.ready = true
+    }
+  }, [client, initialization])
+
   useEffect(() => {
     const clientMessages = client.getMessages()
     if (clientMessages !== messagesRef.current) {
@@ -327,7 +384,6 @@ export function useChat<
       clearTimeout(cleanupInvalidationRef.current)
       cleanupInvalidationRef.current = null
     }
-    activeClientRef.current = client
     client.mountDevtools()
     // Delivery-durability resume is transparent: the resumable SSE connection
     // adapter re-attaches via the browser's native Last-Event-ID on reconnect.
@@ -458,7 +514,11 @@ export function useChat<
 
   const resolveInterrupts = useCallback(
     (
-      resolution: boolean | ((interrupt: ChatInterrupt<TTools>) => undefined),
+      resolution:
+        | boolean
+        | ((
+            interrupt: ResolvableChatInterrupt<TTools, TInterrupts>,
+          ) => undefined),
     ) => {
       if (typeof resolution === 'boolean') {
         client.resolveInterrupts(resolution)
@@ -562,5 +622,5 @@ export function useChat<
     resumeInterrupts,
     partial,
     final,
-  } as unknown as UseChatReturn<TTools, TSchema>
+  } as unknown as UseChatReturn<TTools, TSchema, TInterrupts>
 }

package/src/use-generate-audio.ts

@@ -21,10 +21,6 @@ export interface UseGenerateAudioOptions<TOutput = AudioGenerationResult> {
   connection?: ConnectConnectionAdapter
   /** Direct async function for audio generation */
   fetcher?: GenerationFetcher<AudioGenerateInput, AudioGenerationResult>
-  /**
-   * @deprecated Prefer `threadId`. Only allowed when `threadId` is omitted (see `GenerationPersistenceOptions`).
-   */
-  id?: string
   /** Additional body parameters to send with connect-based adapter requests */
   body?: Record<string, any>
   /** Display options for TanStack AI Devtools. */
@@ -48,8 +44,8 @@ export interface UseGenerateAudioOptions<TOutput = AudioGenerationResult> {
    * id on the wire, which the protocol requires.
    *
    * **Required whenever `persistence` is set** — an app that cannot name the
-   * scope has nothing to restore to. Optional for ephemeral generations, where
-   * it falls back to `id` purely to satisfy the wire.
+   * scope has nothing to restore to. Optional for ephemeral generations. If
+   * omitted, the client mints a wire id after mount.
    */
   threadId?: string
   /**
@@ -144,7 +140,7 @@ export interface UseGenerateAudioReturn<TOutput = AudioGenerationResult> {
 export function useGenerateAudio<TTransformed = void>(
   options: Omit<
     UseGenerateAudioOptions,
-    'onResult' | 'persistence' | 'threadId' | 'id'
+    'onResult' | 'persistence' | 'threadId'
   > & {
     onResult?: (result: AudioGenerationResult) => TTransformed
   } & GenerationPersistenceOptions,

package/src/use-generate-image.ts

@@ -21,10 +21,6 @@ export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
   connection?: ConnectConnectionAdapter
   /** Direct async function for image generation */
   fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>
-  /**
-   * @deprecated Prefer `threadId`. Only allowed when `threadId` is omitted (see `GenerationPersistenceOptions`).
-   */
-  id?: string
   /** Additional body parameters to send with connect-based adapter requests */
   body?: Record<string, any>
   /** Display options for TanStack AI Devtools. */
@@ -48,8 +44,8 @@ export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
    * id on the wire, which the protocol requires.
    *
    * **Required whenever `persistence` is set** — an app that cannot name the
-   * scope has nothing to restore to. Optional for ephemeral generations, where
-   * it falls back to `id` purely to satisfy the wire.
+   * scope has nothing to restore to. Optional for ephemeral generations. If
+   * omitted, the client mints a wire id after mount.
    */
   threadId?: string
   /**
@@ -146,7 +142,7 @@ export interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {
 export function useGenerateImage<TTransformed = void>(
   options: Omit<
     UseGenerateImageOptions,
-    'onResult' | 'persistence' | 'threadId' | 'id'
+    'onResult' | 'persistence' | 'threadId'
   > & {
     onResult?: (result: ImageGenerationResult) => TTransformed
   } & GenerationPersistenceOptions,

package/src/use-generate-speech.ts

@@ -21,10 +21,6 @@ export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
   connection?: ConnectConnectionAdapter
   /** Direct async function for speech generation */
   fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>
-  /**
-   * @deprecated Prefer `threadId`. Only allowed when `threadId` is omitted (see `GenerationPersistenceOptions`).
-   */
-  id?: string
   /** Additional body parameters to send with connect-based adapter requests */
   body?: Record<string, any>
   /** Display options for TanStack AI Devtools. */
@@ -48,8 +44,8 @@ export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
    * id on the wire, which the protocol requires.
    *
    * **Required whenever `persistence` is set** — an app that cannot name the
-   * scope has nothing to restore to. Optional for ephemeral generations, where
-   * it falls back to `id` purely to satisfy the wire.
+   * scope has nothing to restore to. Optional for ephemeral generations. If
+   * omitted, the client mints a wire id after mount.
    */
   threadId?: string
   /**
@@ -140,7 +136,7 @@ export interface UseGenerateSpeechReturn<TOutput = TTSResult> {
 export function useGenerateSpeech<TTransformed = void>(
   options: Omit<
     UseGenerateSpeechOptions,
-    'onResult' | 'persistence' | 'threadId' | 'id'
+    'onResult' | 'persistence' | 'threadId'
   > & {
     onResult?: (result: TTSResult) => TTransformed
   } & GenerationPersistenceOptions,

package/src/use-generate-video.ts

@@ -11,6 +11,7 @@ import type {
   InferGenerationOutputFromReturn,
   VideoGenerateInput,
   VideoGenerateResult,
+  VideoGenerationClientOptions,
   VideoStatusInfo,
 } from '@tanstack/ai-client'
 
@@ -22,10 +23,6 @@ export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
   connection?: ConnectConnectionAdapter
   /** Direct async function that returns a completed video result */
   fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>
-  /**
-   * @deprecated Prefer `threadId`. Only allowed when `threadId` is omitted (see `GenerationPersistenceOptions`).
-   */
-  id?: string
   /** Additional body parameters to send with connect-based adapter requests */
   body?: Record<string, any>
   /** Display options for TanStack AI Devtools. */
@@ -49,8 +46,8 @@ export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
    * id on the wire, which the protocol requires.
    *
    * **Required whenever `persistence` is set** — an app that cannot name the
-   * scope has nothing to restore to. Optional for ephemeral generations, where
-   * it falls back to `id` purely to satisfy the wire.
+   * scope has nothing to restore to. Optional for ephemeral generations. If
+   * omitted, the client mints a wire id after mount.
    */
   threadId?: string
   /**
@@ -157,7 +154,7 @@ export interface UseGenerateVideoReturn<TOutput = VideoGenerateResult> {
 export function useGenerateVideo<TTransformed = void>(
   options: Omit<
     UseGenerateVideoOptions,
-    'onResult' | 'persistence' | 'threadId' | 'id'
+    'onResult' | 'persistence' | 'threadId'
   > & {
     onResult?: (result: VideoGenerateResult) => TTransformed
   } & GenerationPersistenceOptions,
@@ -169,8 +166,8 @@ export function useGenerateVideo<TTransformed = void>(
     TTransformed
   >
   const hookId = useId()
-  // Single identity: prefer `threadId`; deprecated `id` only when no threadId.
-  const clientIdentity = options.threadId ?? options.id ?? hookId
+  // The hook identity is `threadId`. `hookId` is only a React recreation key.
+  const clientIdentity = options.threadId ?? hookId
 
   const [result, setResult] = useState<TOutput | null>(null)
   const [jobId, setJobId] = useState<string | null>(null)
@@ -192,13 +189,11 @@ export function useGenerateVideo<TTransformed = void>(
     // `?.()`'s implicit `undefined` doesn't widen the function
     // return type (which `exactOptionalPropertyTypes` rejects
     // against the strict-optional target).
-    // Identity: pass `threadId` alone when set (never also pass deprecated `id`).
-    const baseOptions = {
+    const baseOptions: Omit<
+      VideoGenerationClientOptions<TOutput>,
+      'persistence' | 'threadId'
+    > = {
       body: opts.body,
-      ...(opts.threadId !== undefined
-        ? { threadId: opts.threadId }
-        : { id: opts.id ?? hookId }),
-      ...(opts.persistence !== undefined && { persistence: opts.persistence }),
       ...(opts.hydrateGeneration !== undefined && {
         hydrateGeneration: opts.hydrateGeneration,
       }),
@@ -255,9 +250,20 @@ export function useGenerateVideo<TTransformed = void>(
       },
     }
 
+    const persistenceProps =
+      typeof opts.threadId === 'string' && opts.persistence
+        ? {
+            persistence: opts.persistence,
+            threadId: opts.threadId,
+          }
+        : {
+            ...(opts.threadId !== undefined && { threadId: opts.threadId }),
+          }
+
     if (opts.connection) {
       return new VideoGenerationClient<TOutput>({
         ...baseOptions,
+        ...persistenceProps,
         connection: opts.connection,
       })
     }
@@ -265,6 +271,7 @@ export function useGenerateVideo<TTransformed = void>(
     if (opts.fetcher) {
       return new VideoGenerationClient<TOutput>({
         ...baseOptions,
+        ...persistenceProps,
         fetcher: opts.fetcher,
       })
     }