refactor(file-viewer): drop dead streamingMode/append path, align naming, cover autosave

The streaming engine only ever runs in 'replace' mode (the only runtime callers
pass it); the 'append' branch of resolveStreamingEditorContent was unreachable.
Remove streamingMode + the StreamingMode type and thread it out of the 6
components that forwarded it — nextContent is now simply the streamed snapshot,
behavior-identical on the live path. Rename for codebase semantics: the boolean
prop streaming -> isStreaming, EditorKeymap -> RichMarkdownKeymap, the highlight
PluginKey KEY -> HIGHLIGHT_PLUGIN_KEY. Add a defensive isEditable guard to the
markdown paste handler (parity with the image handler; read-only must never
mutate). Add a dependency-free useAutosave test suite (debounce, min-display
window, no-data-loss when an edit lands mid-save, error/no-retry, Cmd+S flush,
streaming-disabled lock, unmount flush).

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/file-viewer.tsx

@@ -6,14 +6,9 @@ import dynamic from 'next/dynamic'
 import type { WorkspaceFileRecord } from '@/lib/uploads/contexts/workspace'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
 import { useWorkspaceFileBinary, useWorkspaceFileContent } from '@/hooks/queries/workspace-files'
-import { resolveFileCategory } from './file-category'
-import type { StreamingMode } from './text-editor-state'
-import { useDocPreviewBinary } from './use-doc-preview-binary'
-
-export type { StreamingMode } from './text-editor-state'
-
 import { CsvTablePreview } from './csv-table-preview'
 import { DocxPreview } from './docx-preview'
+import { resolveFileCategory } from './file-category'
 import { ImagePreview } from './image-preview'
 import type { PdfDocumentSource } from './pdf-viewer'
 import { PptxPreview } from './pptx-preview'
@@ -26,6 +21,7 @@ import {
   resolvePreviewError,
 } from './preview-shared'
 import { TextEditor } from './text-editor'
+import { useDocPreviewBinary } from './use-doc-preview-binary'
 import { XlsxPreview } from './xlsx-preview'
 
 const PdfViewerCore = dynamic(() => import('./pdf-viewer').then((m) => m.PdfViewerCore), {
@@ -95,7 +91,6 @@ interface FileViewerProps {
   onSaveStatusChange?: (status: 'idle' | 'saving' | 'saved' | 'error') => void
   saveRef?: React.MutableRefObject<(() => Promise<void>) | null>
   streamingContent?: string
-  streamingMode?: StreamingMode
   disableStreamingAutoScroll?: boolean
   previewContextKey?: string
 }
@@ -111,7 +106,6 @@ export function FileViewer({
   onSaveStatusChange,
   saveRef,
   streamingContent,
-  streamingMode,
   disableStreamingAutoScroll = false,
   previewContextKey,
 }: FileViewerProps) {
@@ -153,7 +147,6 @@ export function FileViewer({
           onSaveStatusChange={onSaveStatusChange}
           saveRef={saveRef}
           streamingContent={streamingContent}
-          streamingMode={streamingMode}
           disableStreamingAutoScroll={disableStreamingAutoScroll}
           previewContextKey={previewContextKey}
         />
@@ -171,7 +164,6 @@ export function FileViewer({
         onSaveStatusChange={onSaveStatusChange}
         saveRef={saveRef}
         streamingContent={streamingContent}
-        streamingMode={streamingMode}
         disableStreamingAutoScroll={disableStreamingAutoScroll}
         previewContextKey={previewContextKey}
       />

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/code-highlight.ts

@@ -23,7 +23,7 @@ import 'prismjs/components/prism-ruby'
 import 'prismjs/components/prism-rust'
 import { detectLanguage } from './detect-language'
 
-const KEY = new PluginKey('codeBlockHighlight')
+const HIGHLIGHT_PLUGIN_KEY = new PluginKey('codeBlockHighlight')
 
 function tokenClasses(token: Token): string {
   const classes = ['token', token.type]
@@ -113,7 +113,7 @@ export const CodeBlockHighlight = Extension.create({
   addProseMirrorPlugins() {
     return [
       new Plugin({
-        key: KEY,
+        key: HIGHLIGHT_PLUGIN_KEY,
         state: {
           init: (_, { doc }) => buildDecorations(doc),
           apply: (tr, current) => {
@@ -124,7 +124,7 @@ export const CodeBlockHighlight = Extension.create({
         },
         props: {
           decorations(state) {
-            return KEY.getState(state)
+            return HIGHLIGHT_PLUGIN_KEY.getState(state)
           },
         },
       }),

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/extensions.ts

@@ -14,7 +14,7 @@ import StarterKit from '@tiptap/starter-kit'
 import { CodeBlockWithLanguage, MarkdownCodeBlock } from './code-block'
 import { CodeBlockHighlight } from './code-highlight'
 import { MarkdownImage, ResizableImage } from './image'
-import { EditorKeymap } from './keymap'
+import { RichMarkdownKeymap } from './keymap'
 import { MarkdownLinkInputRule } from './link-input-rule'
 import { MarkdownPaste } from './markdown-paste'
 import { SlashCommand } from './slash-command/slash-command'
@@ -106,7 +106,7 @@ export function createMarkdownEditorExtensions({
     ...createMarkdownContentExtensions({ nodeViews: true }),
     CodeBlockHighlight,
     SlashCommand,
-    EditorKeymap,
+    RichMarkdownKeymap,
     MarkdownPaste,
     Placeholder.configure({ placeholder }),
   ]

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/keymap.ts

@@ -33,7 +33,7 @@ function selectAdjacentLeaf(editor: Editor, direction: 'up' | 'down'): boolean {
  *   same scoped behavior as a code editor.
  * - **ArrowUp/ArrowDown** select an adjacent divider or image (see {@link selectAdjacentLeaf}).
  */
-export const EditorKeymap = Extension.create({
+export const RichMarkdownKeymap = Extension.create({
   name: 'richMarkdownKeymap',
   priority: 1000,
 

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/markdown-paste.ts

@@ -35,6 +35,7 @@ export const MarkdownPaste = Extension.create({
       new Plugin({
         props: {
           handlePaste: (_view, event) => {
+            if (!editor.isEditable) return false
             if (editor.isActive('codeBlock')) return false
             const html = event.clipboardData?.getData('text/html')
             if (html) return false

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx

@@ -8,7 +8,6 @@ import type { WorkspaceFileRecord } from '@/lib/uploads/contexts/workspace'
 import { useUploadWorkspaceFile } from '@/hooks/queries/workspace-files'
 import type { SaveStatus } from '@/hooks/use-autosave'
 import { PreviewLoadingFrame } from '../preview-shared'
-import type { StreamingMode } from '../text-editor-state'
 import { useEditableFileContent } from '../use-editable-file-content'
 import { createMarkdownEditorExtensions } from './extensions'
 import { extractImageFiles } from './image-paste'
@@ -36,7 +35,6 @@ interface RichMarkdownEditorProps {
   onSaveStatusChange?: (status: SaveStatus) => void
   saveRef?: React.MutableRefObject<(() => Promise<void>) | null>
   streamingContent?: string
-  streamingMode?: StreamingMode
   disableStreamingAutoScroll?: boolean
   previewContextKey?: string
 }
@@ -62,7 +60,6 @@ export const RichMarkdownEditor = memo(function RichMarkdownEditor({
   onSaveStatusChange,
   saveRef,
   streamingContent,
-  streamingMode,
   disableStreamingAutoScroll = false,
   previewContextKey,
 }: RichMarkdownEditorProps) {
@@ -78,7 +75,6 @@ export const RichMarkdownEditor = memo(function RichMarkdownEditor({
     workspaceId,
     canEdit,
     streamingContent,
-    streamingMode,
     onDirtyChange,
     onSaveStatusChange,
     saveRef,
@@ -101,7 +97,7 @@ export const RichMarkdownEditor = memo(function RichMarkdownEditor({
       file={file}
       workspaceId={workspaceId}
       content={content}
-      streaming={isStreamInteractionLocked}
+      isStreaming={isStreamInteractionLocked}
       canEdit={canEdit}
       autoFocus={autoFocus}
       disableStreamingAutoScroll={disableStreamingAutoScroll}
@@ -117,7 +113,7 @@ interface LoadedRichMarkdownEditorProps {
   /** The live content from the engine — grows as the agent streams, then settles to the saved doc. */
   content: string
   /** True while agent output is streaming in: the editor renders it read-only and syncs each chunk. */
-  streaming: boolean
+  isStreaming: boolean
   canEdit: boolean
   autoFocus?: boolean
   disableStreamingAutoScroll?: boolean
@@ -143,7 +139,7 @@ function lockSettled(content: string): SettledContent {
 
 /**
  * The single TipTap editor for a markdown file — the only surface the user ever sees. While agent
- * output streams in ({@link streaming}) it renders that content read-only and re-syncs each chunk;
+ * output streams in ({@link isStreaming}) it renders that content read-only and re-syncs each chunk;
  * when the stream settles it locks the round-trip verdict + frontmatter on the final content and
  * hands control to the user. A file opened outside a stream skips straight to that editable state via
  * the initial-content model (no imperative sync). Frontmatter is held aside and re-applied on every
@@ -153,7 +149,7 @@ export function LoadedRichMarkdownEditor({
   file,
   workspaceId,
   content,
-  streaming,
+  isStreaming,
   canEdit,
   autoFocus,
   disableStreamingAutoScroll,
@@ -162,15 +158,15 @@ export function LoadedRichMarkdownEditor({
 }: LoadedRichMarkdownEditorProps) {
   // Whether this editor mounted mid-stream. If so it starts empty + read-only and syncs the streamed
   // content until the stream settles; otherwise it uses the plain create-time initial-content model.
-  const streamingAtMountRef = useRef(streaming)
+  const streamingAtMountRef = useRef(isStreaming)
 
   // The verdict + frontmatter locked via {@link lockSettled} — at mount for a settled file, or at the
   // moment a stream settles (in the effect below). Null until then; reads default to read-only.
   const settledRef = useRef<SettledContent | null>(null)
   if (!streamingAtMountRef.current && settledRef.current === null) {
     settledRef.current = lockSettled(content)
   }
-  const isEditable = canEdit && !streaming && (settledRef.current?.verdict ?? false)
+  const isEditable = canEdit && !isStreaming && (settledRef.current?.verdict ?? false)
 
   // The body that seeds the editor at create time. Empty when streaming — the sync effect pushes the
   // streamed body in via setContent (this ref is never written again).
@@ -278,7 +274,7 @@ export function LoadedRichMarkdownEditor({
   const lastSyncedBodyRef = useRef<string | null>(null)
   useEffect(() => {
     if (!editor) return
-    if (streaming) {
+    if (isStreaming) {
       const body = splitFrontmatter(content).body
       if (body === lastSyncedBodyRef.current) return
       lastSyncedBodyRef.current = body
@@ -303,7 +299,7 @@ export function LoadedRichMarkdownEditor({
       return
     }
     editor.setEditable(canEdit && settledRef.current.verdict)
-  }, [editor, content, streaming, canEdit, autoFocus, disableStreamingAutoScroll])
+  }, [editor, content, isStreaming, canEdit, autoFocus, disableStreamingAutoScroll])
 
   return (
     <div