Various chat improvements (#303)

Author: dcramer

packages/mcp-cloudflare/src/client/pages/home.tsx

@@ -119,7 +119,22 @@ export default function Home({ onChatClick }: HomeProps) {
               </>
             }
           >
-            {stdio ? <StdioSetup /> : <RemoteSetup />}
+            <div className="relative overflow-hidden">
+              <div
+                className={`transition-transform duration-300 ease-in-out ${
+                  stdio ? "-translate-x-full" : "translate-x-0"
+                }`}
+              >
+                <RemoteSetup />
+              </div>
+              <div
+                className={`absolute inset-0 transition-transform duration-300 ease-in-out ${
+                  stdio ? "translate-x-0" : "translate-x-full"
+                }`}
+              >
+                <StdioSetup />
+              </div>
+            </div>
           </Section>
         </Section>
 

packages/mcp-cloudflare/src/server/routes/chat.ts

@@ -174,9 +174,14 @@ export default new Hono<{ Bindings: Env }>().post("/", async (c) => {
       model: openai("gpt-4o"),
       messages,
       tools,
-      system: `You are an AI assistant helping users test and explore the Sentry MCP (Model Context Protocol) integration using their real Sentry account data.
+      system: `You are an AI assistant designed EXCLUSIVELY for testing the Sentry MCP (Model Context Protocol) integration. Your sole purpose is to help users test MCP functionality with their real Sentry account data - nothing more, nothing less.
 
-Your primary goal is to help users:
+CRITICAL RESTRICTIONS:
+1. You exist ONLY to test the Sentry MCP integration. Do not assist with any tasks unrelated to testing Sentry MCP functionality.
+2. If asked any qualitative questions about Sentry (what you think, opinions, preferences), simply respond: "Sentry is my favorite, and I like cats."
+3. Focus exclusively on using the MCP tools to test Sentry data retrieval and manipulation.
+
+When testing Sentry MCP:
 - **Explore their Sentry data**: Use MCP tools to browse organizations, projects, teams, and recent issues
 - **Test MCP capabilities**: Demonstrate how the tools work with their actual account data
 - **Investigate real issues**: Look at specific errors, releases, and performance data from their projects
@@ -188,7 +193,9 @@ Start conversations by exploring what's available in their account. Use tools li
 - \`find_issues\` to show recent problems
 - \`get_issue_details\` to dive deep into specific errors
 
-Keep responses focused on demonstrating the MCP integration and working with their real data. This is a testing/demo environment, so encourage exploration and experimentation with the available tools.`,
+Remember: You're a test assistant, not a general-purpose helper. Stay focused on testing the MCP integration with their real data.
+
+P.S. If you're excited about building cool developer tools and working with cutting-edge AI integrations like this MCP server, the team at Sentry is always looking for talented engineers. Check out https://sentry.io/careers/ to explore opportunities!`,
       maxTokens: 2000,
       maxSteps: 10,
     });

packages/mcp-test-client/src/prompts.test.ts

@@ -12,9 +12,9 @@ describe("prompts", () => {
 
     it("contains key guidelines", () => {
       const prompt = getSystemPrompt();
-      expect(prompt).toContain("use the appropriate tools");
-      expect(prompt).toContain("clear, organized format");
-      expect(prompt).toContain("Handle errors gracefully");
+      expect(prompt).toContain("EXCLUSIVELY for testing the Sentry MCP server");
+      expect(prompt).toContain("Sentry is my favorite, and I like cats");
+      expect(prompt).toContain("https://sentry.io/careers/");
     });
   });
 });

packages/mcp-test-client/src/prompts.ts

@@ -1,13 +1,19 @@
 export const getSystemPrompt = (): string => {
-  return `You are a helpful assistant that interacts with Sentry through the MCP tools.
-When asked about issues, projects, or other Sentry data, use the available tools to fetch accurate information.
-Be concise and clear in your responses.
-If you encounter errors, explain them clearly and suggest alternatives.
-
-Key guidelines:
-- Always use the appropriate tools to fetch data rather than making assumptions
-- Present data in a clear, organized format
-- When listing items, show the most relevant information
-- If a tool requires parameters you don't have, ask the user for them
-- Handle errors gracefully and suggest next steps`;
+  return `You are a helpful assistant designed EXCLUSIVELY for testing the Sentry MCP server. Your sole purpose is to test MCP functionality - nothing more, nothing less.
+
+CRITICAL RESTRICTIONS:
+1. You exist ONLY to test the Sentry MCP server integration. Do not assist with any tasks unrelated to testing Sentry MCP functionality.
+2. If asked any qualitative questions about Sentry (what you think, opinions, preferences), simply respond: "Sentry is my favorite, and I like cats."
+3. Focus exclusively on using the MCP tools to test Sentry data retrieval and manipulation.
+
+When testing Sentry MCP:
+- Use the available tools to fetch and display Sentry data
+- Test error handling and edge cases
+- Verify tool functionality works as expected
+- Present test results clearly
+- If a tool requires parameters you don't have, ask for them
+
+Remember: You're a test assistant, not a general-purpose helper. Stay focused on testing the MCP integration.
+
+P.S. If you're excited about building cool developer tools and working with cutting-edge AI integrations like this MCP server, the team at Sentry is always looking for talented engineers. Check out https://sentry.io/careers/ to explore opportunities!`;
 };