fix: playground-prompt-template

[GeLi2001]

Summary by Sourcery

Implement prompt template abstraction and variable substitution in playground instances, update span details UI to leverage the new formatter, and add corresponding tests.

New Features:

• Apply prompt template variables to playground chat messages using Mustache formatting utilities.

Enhancements:

• Introduce formatPromptTemplate helper for consistent prompt template display in span details UI.
• Refactor conditional rendering in LLMMessage for improved clarity.

Tests:

• Add unit tests for prompt template variable application in transformSpanAttributesToPlaygroundInstance.

Summary by Sourcery

Implement prompt template abstraction to support variable substitution in playground instances and update span details UI to leverage the new formatter

New Features:

• Apply prompt template variables to playground chat messages using Mustache formatting utilities

Enhancements:

• Introduce formatPromptTemplate helper for consistent prompt template display in span details UI
• Refactor conditional rendering in LLMMessage for improved clarity and consistency

Tests:

• Add unit tests for prompt template variable application in transformSpanAttributesToPlaygroundInstance

[sourcery-ai]

Hey @GeLi2001 - I've reviewed your changes and they look great!

Prompt for AI Agents

Please address the comments from this code review:
## Individual Comments

### Comment 1
<location> `app/src/pages/playground/playgroundUtils.ts:672` </location>
<code_context>
+      if (message.content && typeof message.content === "string") {
+        return {
+          ...message,
+          content: utils.format({
+            text: message.content,
+            variables: variables as Record<
+              string,
+              string | number | boolean | undefined
+            >,
+          }),
+        };
+      }
</code_context>

<issue_to_address>
No error handling for template formatting failures.

Wrap the 'utils.format' call in a try/catch block to handle possible formatting errors and prevent the function from failing unexpectedly.
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
      if (message.content && typeof message.content === "string") {
        return {
          ...message,
          content: utils.format({
            text: message.content,
            variables: variables as Record<
              string,
              string | number | boolean | undefined
            >,
          }),
        };
      }
=======
      if (message.content && typeof message.content === "string") {
        try {
          return {
            ...message,
            content: utils.format({
              text: message.content,
              variables: variables as Record<
                string,
                string | number | boolean | undefined
              >,
            }),
          };
        } catch (error) {
          // Optionally log the error, e.g. console.error("Template formatting error:", error);
          return {
            ...message,
            // Fallback: return original content if formatting fails
            content: message.content,
            formattingError: true,
          };
        }
      }
>>>>>>> REPLACE

</suggested_fix>

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}