Empty agent response
C1 renders an empty agent response as shown above when the component is unable to correctly parse the response content sent by the backend. Here’s a checklist to make sure you’re not missing anything:
1

Check the streamed response format

Check your network tab to ensure that the response streamed by your API follows the expected format. The C1 component expects an XML-formatted response with the primary content wrapped in a <content> tag. Here’s an example of the expected format:
<content>
  <!-- Some JSON -->
</content>

The transformStream function call

Make sure that the transformStream function call on your backend (if you’re streaming the response) returns the correct part of the chunk:
transformStream(llmStream, (chunk) => {
  return chunk.choices[0]?.delta?.content;
});

The processMessage function

If you’re using a custom threadManager created using a useThreadManager hook, make sure that the processMessage function is returning the correct object. The processMessage function should directly return the response from your backend, which has already transformed the stream into the correct format:
processMessage: async ({ messages }) => {
  const latestMessage = messages[messages.length - 1];
  const response = await fetch("/api/chat", {
    method: "POST",
    body: JSON.stringify({
      prompt: latestMessage,
      threadId: threadListManager.selectedThreadId,
      responseId: crypto.randomUUID(),
    }),
  });
  return response;
};
2

Check model and dependency compatibility

Ensure that the LLM model you’re using on the backend, the GenUI SDK version, and the Crayon packages are compatible with each other. Refer to the Compatibility Matrix for more information.
3

Still having issues?

Shoot us a message on Discord

Feel free to send a message in the #help channel on Discord and someone from our team will get back to you.