fix: debounced snapshot save to prevent file loss on refresh

The snapshot was taken 50ms after the last message change, but file
actions were still processing in the async execution queue and
100ms watcher buffer. This caused incomplete file sets in the
snapshot, leading to missing files after page refresh.

Added a debounced file-change subscriber (500ms) that re-saves the
snapshot after all file writes settle. This ensures the snapshot
always contains the complete set of files.

Root cause: snapshot timing race between the 50ms message sampler
and the async file write pipeline (queue  editor  WebContainer
 100ms watcher  files store).

All 452 tests passing.

Author: zebbern

app/lib/persistence/useChatHistory.ts

@@ -1,5 +1,5 @@
 import { useLoaderData, useNavigate, useSearchParams } from '@remix-run/react';
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback, useRef } from 'react';
 import { atom } from 'nanostores';
 import { type JSONValue, type Message } from 'ai';
 import { toast } from 'react-toastify';
@@ -51,6 +51,9 @@ export function useChatHistory() {
   const [ready, setReady] = useState<boolean>(false);
   const [urlId, setUrlId] = useState<string | undefined>();
 
+  // Track last snapshot parameters so debounced file-change saves use the same message ID
+  const lastSnapshotParamsRef = useRef<{ chatIdx: string; chatSummary?: string } | null>(null);
+
   useEffect(() => {
     if (!db) {
       setReady(true);
@@ -159,6 +162,50 @@ export function useChatHistory() {
     [db],
   );
 
+  /*
+   * Debounced file-change subscriber: re-saves the snapshot after file writes settle.
+   * The normal snapshot fires 50ms after the last message change, but file actions
+   * may still be in the async execution queue or watcher buffer at that point.
+   * This subscriber ensures a final snapshot is taken once all files are written.
+   */
+  useEffect(() => {
+    if (!db) {
+      return undefined;
+    }
+
+    let debounceTimer: ReturnType<typeof setTimeout> | null = null;
+
+    const unsubscribe = workbenchStore.files.subscribe(() => {
+      const id = chatId.get();
+      const params = lastSnapshotParamsRef.current;
+
+      if (!id || !params) {
+        return;
+      }
+
+      if (debounceTimer) {
+        clearTimeout(debounceTimer);
+      }
+
+      debounceTimer = setTimeout(() => {
+        const files = workbenchStore.files.get();
+
+        if (Object.keys(files).length > 0) {
+          logger.debug('Debounced file-change snapshot save');
+          takeSnapshot(params.chatIdx, files, undefined, params.chatSummary);
+        }
+      }, 500);
+    });
+
+    return () => {
+      unsubscribe();
+
+      if (debounceTimer) {
+        clearTimeout(debounceTimer);
+      }
+    };
+  }, [db, takeSnapshot]);
+
   const restoreSnapshot = useCallback(async (id: string, snapshot?: Snapshot) => {
     const container = await webcontainer;
 
@@ -254,6 +301,9 @@ export function useChatHistory() {
         }
       }
 
+      // Save params so debounced file-change subscriber can re-save with updated files
+      lastSnapshotParamsRef.current = { chatIdx: messages[messages.length - 1].id, chatSummary };
+
       takeSnapshot(messages[messages.length - 1].id, workbenchStore.files.get(), _urlId, chatSummary);
 
       if (!description.get() && firstArtifact?.title) {