fix: Ensure that we properly format data outputs in the chat (#8132)

* fix: If a list is returned, make sure we convert to string

* Prettify the data output

* Updates based on feedback, safe encoding

* Fix chat output unit test

* Ensure all starter projects are updated

src/backend/base/langflow/components/outputs/chat.py

@@ -1,6 +1,9 @@
 from collections.abc import Generator
 from typing import Any
 
+import orjson
+from fastapi.encoders import jsonable_encoder
+
 from langflow.base.io.chat import ChatComponent
 from langflow.inputs import BoolInput
 from langflow.inputs.inputs import HandleInput
@@ -119,6 +122,7 @@ class ChatOutput(ChatComponent):
     async def message_response(self) -> Message:
         # First convert the input to string if needed
         text = self.convert_to_string()
+
         # Get source properties
         source, icon, display_name, source_id = self.get_properties_from_source_component()
         background_color = self.background_color
@@ -176,6 +180,15 @@ class ChatOutput(ChatComponent):
             msg = f"Expected Data or DataFrame or Message or str, Generator or None, got {type_name}"
             raise TypeError(msg)
 
+    def _serialize_data(self, data: Data) -> str:
+        """Serialize Data object to JSON string."""
+        # Convert data.data to JSON-serializable format
+        serializable_data = jsonable_encoder(data.data)
+        # Serialize with orjson, enabling pretty printing with indentation
+        json_bytes = orjson.dumps(serializable_data, option=orjson.OPT_INDENT_2)
+        # Convert bytes to string and wrap in Markdown code blocks
+        return "```json\n" + json_bytes.decode("utf-8") + "\n```"
+
     def _safe_convert(self, data: Any) -> str:
         """Safely convert input data to string."""
         try:
@@ -184,10 +197,7 @@ class ChatOutput(ChatComponent):
             if isinstance(data, Message):
                 return data.get_text()
             if isinstance(data, Data):
-                if data.get_text() is None:
-                    msg = "Empty Data object"
-                    raise ValueError(msg)
-                return data.get_text()
+                return self._serialize_data(data)
             if isinstance(data, DataFrame):
                 if self.clean_data:
                     # Remove empty rows

src/backend/tests/unit/components/outputs/test_chat_output_component.py

@@ -53,7 +53,7 @@ class TestChatOutput(ComponentTestBaseWithClient):
         data = Data(text="Test data message")
         component.input_value = data
         result = await component.message_response()
-        assert result.text == "Test data message"
+        assert result.text == '```json\n{\n  "text": "Test data message"\n}\n```'
         assert result.sender == MESSAGE_SENDER_AI
 
     async def test_process_dataframe_input(self, component_class, default_kwargs):