improvement(chat): partialize chat store to only persist image URL instead of full image in floating chat

[waleedlatif1]

Summary

• partialize chat store to only persist image URL instead of full image in floating chat
• fixed stale closure

Type of Change

• Bug fix

Testing

Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Review	Updated (UTC)
docs	Skipped		Jan 16, 2026 0:46am

[greptile-apps]

Greptile Summary

This PR optimizes localStorage usage by preventing full base64-encoded images from being persisted in the chat store. The implementation adds a partialize function to the Zustand persist middleware that clears the dataUrl field from message attachments before storage, while keeping metadata like filename and type intact.

• Modified chat store to use partialize in persist config, clearing dataUrl from attachments before localStorage storage
• Replaced unsafe URL.createObjectURL pattern (creating URLs on every render with onLoad cleanup) with ref-based URL caching and proper lifecycle management
• Fixed stale closure bug in useChatFileUpload hook by using functional state updates instead of closure-dependent updates
• Added timeout protection to FileReader operations to prevent indefinite hangs on large files
• Updated attachment display logic to verify both image type AND valid dataUrl before rendering

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes are well-structured and address real performance and correctness issues. The partialize implementation correctly clears only the dataUrl while preserving necessary metadata. The URL management improvements prevent memory leaks. The stale closure fix uses proper React patterns with functional updates. All changes follow established patterns from the codebase's style guides.
• No files require special attention

Important Files Changed

Filename	Overview
apps/sim/stores/chat/store.ts	Added partialize to persist config to clear dataUrl from attachments, preventing large base64 images from being stored in localStorage
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/chat.tsx	Added proper URL.createObjectURL management with ref-based caching and cleanup, added timeout protection to FileReader operations
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/components/chat-message/chat-message.tsx	Fixed image display logic to check both type and dataUrl validity before rendering as image
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/hooks/use-chat-file-upload.ts	Fixed stale closure bug by using functional state updates in addFiles, preventing race conditions with rapid file additions

Sequence Diagram

sequenceDiagram
    participant User
    participant Chat
    participant FileUploadHook
    participant FileReader
    participant ChatStore
    participant LocalStorage
    
    User->>Chat: Drop/select image files
    Chat->>FileUploadHook: addFiles(files)
    FileUploadHook->>FileUploadHook: Validate files (size, duplicates)
    FileUploadHook->>FileUploadHook: setChatFiles (functional update)
    FileUploadHook-->>Chat: chatFiles updated
    
    Chat->>Chat: getFilePreviewUrl(file)
    Chat->>Chat: URL.createObjectURL(file.file)
    Chat->>Chat: Store URL in ref Map
    Chat-->>User: Display image preview
    
    User->>Chat: Send message
    Chat->>FileReader: readAsDataURL(file.file)
    Note over FileReader: 60s timeout protection
    FileReader-->>Chat: dataUrl (base64)
    Chat->>Chat: processFileAttachments()
    
    Chat->>ChatStore: addMessage(message with attachments)
    ChatStore->>ChatStore: Add message to state
    ChatStore->>LocalStorage: persist(state)
    Note over ChatStore,LocalStorage: partialize clears dataUrl
    ChatStore->>LocalStorage: Store message without base64
    
    User->>Chat: Reload page
    LocalStorage->>ChatStore: Rehydrate state
    Note over LocalStorage,ChatStore: dataUrl is empty string
    ChatStore-->>Chat: messages with empty dataUrl
    Chat->>Chat: canDisplayAsImage checks dataUrl
    Chat-->>User: Show attachment metadata only
    
    User->>Chat: Remove file from preview
    Chat->>FileUploadHook: removeFile(fileId)
    Chat->>Chat: Cleanup: URL.revokeObjectURL(url)
    Chat->>Chat: Remove from ref Map

Loading