feat(tarko): add gui agent screenshot render strategy config#1296
Merged
Conversation
✅ Deploy Preview for agent-tars-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
…ents - Extract StrategySwitch for screenshot display mode controls - Create MouseCursor component for cursor visualization - Add ScreenshotDisplay for image rendering logic - Implement OperationDetailsCard for action details - Add useMousePosition hook for coordinate handling - Add useScreenshots hook for image discovery - Extract data parsing to utility function - Maintain all existing functionality and behavior
Update useMousePosition and useScreenshots hooks to accept string | null types to match useSession return values
- Follow ToggleSwitch design patterns for consistency - Add semantic icons (Rewind, FastForward, Shuffle) - Use refined colors and subtle backdrop blur - Implement proper button grouping with borders - Reduce visual weight for more elegant appearance
… look Remove background and border wrapper to achieve more minimal design
Change layout from justify-between to justify-end with gap to keep label and buttons visually connected
- Remove blue indicator dot for cleaner look - Add top margin for better spacing - Simplify Display Mode label presentation
- Remove visible Display Mode text for cleaner UI - Add MUI Tooltip with consistent styling from ShareButton - Tooltip shows 'Screenshot display mode' on hover - Maintain button group functionality and positioning
- Add specific tooltip text for each strategy option - Before: 'Show screenshot before action execution' - After: 'Show screenshot after action execution' - Both: 'Show screenshots before and after action execution' - Remove global tooltip for better UX clarity
- Add gradient backgrounds for modern look - Implement blue color scheme for active states - Add hover animations with scale and shadow effects - Enhance icon animations with scale and opacity transitions - Increase padding and border radius for better touch targets - Add group hover effects for interactive feedback
- Change layout from horizontal to vertical flex - Center align icons and text with gap-1 spacing - Reduce font size to text-[10px] for more compact look - Adjust padding to px-3 for better proportions - Add leading-none for tighter text spacing
- Replace plain text headers with styled badge components - Before Action: amber gradient with pulsing indicator - After Action: emerald gradient with static indicator - Add rounded-full borders and shadows for modern look - Center align labels with proper spacing - Use tracking-wide for better text appearance
- Remove excessive gradients and colors from StrategySwitch - Use clean slate colors consistent with app design - Simplify Before/After labels to minimal uppercase text - Remove animations and effects for cleaner look - Maintain functionality while respecting design language
- Change from vertical flex-col to horizontal flex layout - Icon and text now display side by side with gap-1.5 - Increase text size from text-[10px] to text-xs - Remove leading-none for better readability
Change justify-end to justify-center for better visual balance Improve UI alignment and aesthetics
Replace FiRewind/FiFastForward with FiClock/FiCheckCircle Better semantic representation of before/after states
ZhaoHeh
approved these changes
Aug 29, 2025
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds
guiAgentconfiguration toAgentWebUIImplementationinterface to support different screenshot rendering strategies for GUI Agent operations, addressing the issue where different agents (Omni-TARS vs Agent-TARS) have different screenshot timing requirements.This resolves the screenshot association issue mentioned in PR #1214 by making the strategy configurable per agent implementation.
Snapshots
defaultScreenshotRenderStrategy: "both"defaultScreenshotRenderStrategy: "beforeAction"defaultScreenshotRenderStrategy: "afterAction"Checklist