fix(wand): add shimmer to long-input while isStreaming, better prompt for system prompt generation

[waleedlatif1]

Summary

add shimmer to long-input while isStreaming, better prompt for system prompt generation

Type of Change

• New feature

Testing

Tested manually.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

Screenshots/Videos

Screen.Recording.2025-08-02.at.3.37.17.PM.mov

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
sim	🔄 Building (Inspect)	Visit Preview	💬 Add feedback	Aug 2, 2025 10:38pm

1 Skipped Deployment

Name	Status	Preview	Comments	Updated (UTC)
docs	⬜️ Skipped (Inspect)			Aug 2, 2025 10:38pm

[greptile-apps]

Greptile Summary

This PR enhances the user experience during AI content generation by adding streaming state handling to the LongInput component and improving system prompt generation quality. The changes address two key areas:

Streaming UI Improvements: The LongInput component now properly handles streaming states when AI content is being generated through the "wand" feature. During streaming, the component prevents user keyboard input, applies visual effects with the 'streaming-effect' CSS class, reduces opacity and disables pointer events on the textarea, and conditionally hides interactive elements like the wand button, resize handle, and dropdown menus. This ensures users cannot accidentally interrupt or modify content while it's being generated character by character.

System Prompt Enhancement: The AgentBlock system prompt generation has been significantly upgraded from a basic template to a comprehensive, structured template following professional prompt engineering best practices. The new template includes detailed sections for context, instructions, core principles, structure guidelines, tool integration examples, and concrete examples for both simple and detailed requests.

These changes integrate well with the existing workflow builder architecture, leveraging the established wandHook state management system and maintaining the component's existing configuration structure while dramatically improving the user experience during AI interactions.

Confidence score: 4/5

• This PR is safe to merge with minimal risk of breaking existing functionality
• Score reflects well-structured defensive programming and clear UI state management, though streaming behavior should be tested thoroughly in production
• Pay close attention to the streaming state logic in long-input.tsx to ensure all edge cases are handled properly

_{2 files reviewed, no comments}

_{Edit Code Review Bot Settings | Greptile}