refactor(files): four stellar-quality improvements to file-viewer split

- Extract useBlobUrl hook shared by AudioPreview and VideoPreview,
  eliminating ~30 lines of duplicated state/effect logic
- Stabilize markSavedContent with useCallback (matches setDraftContent)
- Stabilize handleEditorChange with useCallback([setDraftContent])
- Fix pptx static render effect deps: drop redundant dataUpdatedAt
  (already encoded in cacheKey) and unused workspaceId

Author: waleedlatif1

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

@@ -351,28 +351,16 @@ const IframePreview = memo(function IframePreview({
   return <PdfViewerCore source={staticSource} filename={file.name} />
 })
 
-const AudioPreview = memo(function AudioPreview({
-  file,
-  workspaceId,
-}: {
-  file: WorkspaceFileRecord
-  workspaceId: string
-}) {
-  const {
-    data: fileData,
-    isLoading,
-    error: fetchError,
-  } = useWorkspaceFileBinary(workspaceId, file.id, file.key)
+function useBlobUrl(workspaceId: string, fileId: string, fileKey: string) {
+  const { data: fileData, isLoading, error } = useWorkspaceFileBinary(workspaceId, fileId, fileKey)
   const [blobUrl, setBlobUrl] = useState<string | null>(null)
   const blobUrlRef = useRef<string | null>(null)
 
   const replaceBlobUrl = useCallback((nextUrl: string | null) => {
     const previousUrl = blobUrlRef.current
     blobUrlRef.current = nextUrl
     setBlobUrl(nextUrl)
-    if (previousUrl && previousUrl !== nextUrl) {
-      URL.revokeObjectURL(previousUrl)
-    }
+    if (previousUrl && previousUrl !== nextUrl) URL.revokeObjectURL(previousUrl)
   }, [])
 
   useEffect(() => {
@@ -384,6 +372,24 @@ const AudioPreview = memo(function AudioPreview({
     }
   }, [])
 
+  return { fileData, isLoading, error, blobUrl, replaceBlobUrl }
+}
+
+const AudioPreview = memo(function AudioPreview({
+  file,
+  workspaceId,
+}: {
+  file: WorkspaceFileRecord
+  workspaceId: string
+}) {
+  const {
+    fileData,
+    isLoading,
+    error: fetchError,
+    blobUrl,
+    replaceBlobUrl,
+  } = useBlobUrl(workspaceId, file.id, file.key)
+
   useEffect(() => {
     if (!fileData) return
     replaceBlobUrl(URL.createObjectURL(new Blob([fileData], { type: file.type || 'audio/mpeg' })))
@@ -424,30 +430,12 @@ const VideoPreview = memo(function VideoPreview({
   workspaceId: string
 }) {
   const {
-    data: fileData,
+    fileData,
     isLoading,
     error: fetchError,
-  } = useWorkspaceFileBinary(workspaceId, file.id, file.key)
-  const [blobUrl, setBlobUrl] = useState<string | null>(null)
-  const blobUrlRef = useRef<string | null>(null)
-
-  const replaceBlobUrl = useCallback((nextUrl: string | null) => {
-    const previousUrl = blobUrlRef.current
-    blobUrlRef.current = nextUrl
-    setBlobUrl(nextUrl)
-    if (previousUrl && previousUrl !== nextUrl) {
-      URL.revokeObjectURL(previousUrl)
-    }
-  }, [])
-
-  useEffect(() => {
-    return () => {
-      if (blobUrlRef.current) {
-        URL.revokeObjectURL(blobUrlRef.current)
-        blobUrlRef.current = null
-      }
-    }
-  }, [])
+    blobUrl,
+    replaceBlobUrl,
+  } = useBlobUrl(workspaceId, file.id, file.key)
 
   useEffect(() => {
     if (!fileData) return

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

@@ -262,7 +262,7 @@ export function PptxPreview({
     return () => {
       cancelled = true
     }
-  }, [fileData, dataUpdatedAt, streamingContent, cacheKey, workspaceId])
+  }, [fileData, streamingContent, cacheKey])
 
   const error = resolvePreviewError(fetchError, renderError)
   const loading = isFetching || rendering

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

@@ -498,9 +498,9 @@ function useTextEditorContentState(options: SyncTextEditorContentStateOptions) {
     dispatch({ type: 'edit', content })
   }, [])
 
-  const markSavedContent = (content: string) => {
+  const markSavedContent = useCallback((content: string) => {
     dispatch({ type: 'save-success', content })
-  }
+  }, [])
 
   return {
     content: state.content,
@@ -786,9 +786,12 @@ export const TextEditor = memo(function TextEditor({
     }
   }
 
-  const handleEditorChange = (value: string | undefined) => {
-    setDraftContent(value ?? '')
-  }
+  const handleEditorChange = useCallback(
+    (value: string | undefined) => {
+      setDraftContent(value ?? '')
+    },
+    [setDraftContent]
+  )
 
   const isStreaming = isStreamInteractionLocked
   const isEditorReadOnly = isStreamInteractionLocked || !canEdit