Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Fix: Handle object rendering in UI #2726

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Patel230 wants to merge 7 commits into simstudioai:staging
base: staging
Choose a base branch
Loading
from Patel230:fix/issue-2725-object-rendering

Conversation

@Patel230
Copy link
Contributor

@Patel230 Patel230 commented Jan 8, 2026

Summary

Changes

  • Created format-output.ts utility with deep object traversal
  • Updated chat components to use the new formatting utility
  • Added comprehensive unit tests
  • Handles edge cases: circular refs, nested objects, arrays, XSS protection

Test Plan

  • Tested with LLM outputs returning {text: "content", type: "response"}
  • Tested with nested objects and arrays
  • Verified no React rendering errors
  • Unit tests cover all scenarios

greptile-apps[bot] reacted with thumbs up emoji
Copy link

vercel bot commented Jan 8, 2026

@Patel230 is attempting to deploy a commit to the Sim Team on Vercel.

A member of the Team first needs to authorize it.

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Greptile Overview

Greptile Summary

Fixes React crashes when workflow outputs return structured objects by introducing a robust formatting utility that safely converts various output types to displayable strings. Replaces inline JSON.stringify calls in chat components with deep object traversal that intelligently extracts text content from nested structures. Includes comprehensive unit tests covering edge cases like circular references, binary data, and common LLM response formats.

Confidence Score: 3/5

  • Generally safe with minor implementation issues that should be addressed
  • The PR successfully solves the object rendering crash issue with comprehensive error handling and extensive test coverage. However, several implementation concerns warrant attention: (1) unused seenObjects variable indicates incomplete cleanup, (2) array joining with newlines may cause unexpected vertical layout in chat UI, (3) aggressive whitespace normalization could break formatted content like code snippets, and (4) for...in usage is less efficient than modern alternatives. These are style and UX concerns rather than critical bugs, but they could impact display quality and code maintainability.
  • apps/sim/lib/core/utils/format-output.ts needs attention for unused variables, whitespace handling, and array formatting behavior

Important Files Changed

File Analysis

Filename Score Overview
apps/sim/lib/core/utils/format-output.ts 2/5 Adds comprehensive output formatting utility; seenObjects variable declared but never used, array joining uses newline which may cause layout issues in chat
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/chat.tsx 4/5 Replaces inline formatting logic with shared utility formatOutputForWorkflow; removes duplicate code
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/components/chat-message/chat-message.tsx 4/5 Replaces manual JSON.stringify with formatOutputForChat utility for consistent object handling

Sequence Diagram

sequenceDiagram
 participant User
 participant ChatMessage
 participant FormatUtil as format-output.ts
 participant DeepExtract as deepExtractText()
 participant SafeStringify as safeStringify()
 User->>ChatMessage: Render message with object content
 ChatMessage->>FormatUtil: formatOutputForChat(content)
 FormatUtil->>FormatUtil: extractContent(item)
 
 alt Object with text field
 FormatUtil->>DeepExtract: deepExtractText(obj)
 DeepExtract->>DeepExtract: Search TEXT_FIELD_NAMES
 DeepExtract->>DeepExtract: Recursive traversal (max depth 10)
 DeepExtract-->>FormatUtil: Return extracted text
 FormatUtil->>FormatUtil: Clean whitespace & truncate
 FormatUtil-->>ChatMessage: Formatted string
 else Array
 FormatUtil->>FormatUtil: Map extractContent over items
 FormatUtil->>FormatUtil: Join with newline
 FormatUtil-->>ChatMessage: Joined string
 else Fallback to JSON
 FormatUtil->>SafeStringify: safeStringify(obj)
 SafeStringify->>SafeStringify: Handle circular refs
 SafeStringify-->>FormatUtil: JSON string
 FormatUtil->>FormatUtil: Wrap in code block (workflow mode)
 FormatUtil-->>ChatMessage: Formatted JSON
 end
 
 ChatMessage->>User: Display formatted text
Loading

@Patel230 Patel230 changed the title (削除) Fix: Handle object rendering in chat UI (削除ここまで) (追記) Fix: Handle object rendering in UI (追記ここまで) Jan 8, 2026
- Remove unused seenObjects variable
- Use Object.entries instead of for...in for better performance
- Join arrays with spaces instead of newlines for better chat UI layout
- Improve whitespace normalization to preserve code formatting
@Patel230 Patel230 marked this pull request as draft January 8, 2026 11:35
@Patel230 Patel230 marked this pull request as ready for review January 8, 2026 11:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

1 more reviewer

@greptile-apps greptile-apps[bot] greptile-apps[bot] left review comments

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

AltStyle によって変換されたページ (->オリジナル) /