feat(platform): implement graph-level Safe Mode toggle for HITL blocks

[majdyz]

Summary

This PR implements a graph-level Safe Mode toggle system for Human-in-the-Loop (HITL) blocks. When Safe Mode is ON (default), HITL blocks require manual review before proceeding. When OFF, they execute automatically.

🔧 Backend Changes

• Database: Added metadata JSON column to AgentGraph table with migration
• API: Updated execute_graph endpoint to accept safe_mode parameter
• Execution: Enhanced execution context to use graph metadata as default with API override capability
• Auto-detection: Automatically populate has_human_in_the_loop for graphs containing HITL blocks
• Block Detection: HITL block ID: 8b2a7b3c-6e9d-4a5f-8c1b-2e3f4a5b6c7d

🎨 Frontend Changes

• Component: New FloatingSafeModeToggle with dual variants:
  • White variant: For library pages, integrates with action buttons
  • Black variant: For builders, floating positioned
• Integration: Added toggles to both new/legacy builders and library pages
• API Integration: Direct graph metadata updates via usePutV1UpdateGraphVersion
• Query Management: React Query cache invalidation for consistent UI updates
• Conditional Display: Toggle only appears when graph contains HITL blocks

🛠 Technical Implementation

• Safe Mode ON (default): HITL blocks require manual review before proceeding
• Safe Mode OFF: HITL blocks execute automatically without intervention
• Priority: Backend API safe_mode parameter takes precedence over graph metadata
• Detection: Auto-populates has_human_in_the_loop metadata field
• Positioning: Proper z-index and responsive positioning for floating elements

🚧 Known Issues (Work in Progress)

High Priority

• Toggle state persistence: Always shows "ON" regardless of actual state - query invalidation issue
• LibraryAgent metadata: Missing metadata field causing TypeScript errors
• Tooltip z-index: Still covered by some UI elements despite high z-index

Medium Priority

• HITL detection: Logic needs improvement for reliable block detection
• Error handling: Removing HITL blocks from graph causes save errors
• TypeScript: Fix type mismatches between GraphModel and LibraryAgent

Low Priority

• Frontend API: Add safe_mode parameter to execution calls once OpenAPI is regenerated
• Performance: Consider debouncing rapid toggle clicks

🧪 Test Plan

• Verify toggle appears only when graph has HITL blocks
• Test toggle persistence across page refreshes
• Confirm API calls update graph metadata correctly
• Validate execution behavior respects safe mode setting
• Check styling consistency across builder and library contexts

🔗 Related

• Addresses requirements for graph-level HITL configuration
• Builds on existing FloatingReviewsPanel infrastructure
• Integrates with existing graph metadata system

🤖 Generated with Claude Code

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/human-in-the-loop-block-toggle

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

• Provide your own instructions using the high_level_summary_instructions setting.
• Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
• Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
4. 📊 Contributor Summary — Include a Markdown table showing contributions:
   | Contributor | Lines Added | Lines Removed | Files Changed |
5. ✔️ Additional Notes — Add any extra reviewer context.
   Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[AutoGPT-Agent]

Thank you for this comprehensive PR implementing a graph-level Safe Mode toggle for HITL blocks. The code changes look solid, and your PR description does an excellent job of explaining the intent and implementation details.

However, I noticed that you haven't checked off any of the items in your test plan. Before this can be merged, please:

1. Complete the testing of your implementation according to the test plan you've outlined
2. Check off the test plan items in your PR description once they've been verified

This feature affects execution behavior for HITL blocks, so thorough testing is particularly important to ensure it works as expected across different contexts (builder and library pages).

Also, I noted a few of your known issues:

• Toggle state persistence showing "ON" regardless of actual state
• LibraryAgent metadata TypeScript errors
• Z-index issues with tooltip

While these don't necessarily block merging, it would be good to know if you have plans to address them in this PR or follow-up PRs.

Let me know if you need any clarification or have questions about these requirements.

[deepsource-io]

Here's the code health analysis summary for commits 3d08c22..1a15c4a. View details on DeepSource ↗.

Analysis Summary

Analyzer	Status	Summary	Link
JavaScript	✅ Success	❗ 49 occurences introduced 🎯 3 occurences resolved	View Check ↗
Python	✅ Success	❗ 18 occurences introduced 🎯 5 occurences resolved	View Check ↗

---

💡 If you’re a repository administrator, you can configure the quality gates from the settings.

[AutoGPT-Agent]

Thanks for the comprehensive PR implementing the Safe Mode toggle for HITL blocks! The implementation looks thorough and well-thought-out. I have a few comments before this is ready to merge:

Test Plan Completion

The test plan is clearly specified in your PR description, but none of the items are checked off. Could you please complete the testing as outlined and check off the test plan items? Specifically:

• Verify toggle appears only when graph has HITL blocks
• Test toggle persistence across page refreshes
• Confirm API calls update graph metadata correctly
• Validate execution behavior respects safe mode setting
• Check styling consistency across builder and library contexts

Known Issues

You've done a great job documenting the known issues. Since these are marked as "Work in Progress", could you clarify which of these need to be resolved before merging versus which can be addressed in follow-up PRs?

Particularly concerning are these high priority issues:

• Toggle state persistence always showing "ON"
• TypeScript errors with LibraryAgent metadata
• Z-index issues with tooltips

Technical Questions

1. The HITL block ID is hardcoded (8b2a7b3c-6e9d-4a5f-8c1b-2e3f4a5b6c7d). Is there a more robust way to detect HITL blocks that won't break if block IDs change?
2. Could you add some comments around the API priority logic where safe_mode parameter takes precedence over graph metadata?

Migration Readiness

The migration looks good, but let's ensure it's been tested on a representative database. Have you verified the migration runs successfully on a database with existing graphs?

Overall, this is a well-implemented feature with good cross-cutting concerns addressed. Looking forward to getting the test plan completed!

[AutoGPT-Agent]

Thank you for this detailed PR implementing the graph-level Safe Mode toggle for HITL blocks!

Feedback

Your implementation looks comprehensive, covering both backend and frontend changes needed for this feature. I appreciate the detailed description with sections for backend changes, frontend changes, technical implementation, and known issues.

A few observations:

1. Missing Standard Checklist: Could you please add our standard checklist for code changes? Since this is a substantial feature implementation (labeled as size/xl), we need to ensure all verification steps are covered.

2. Execution Context: The change from UserContext to ExecutionContext seems well implemented throughout the codebase, ensuring all references are updated consistently.

3. Known Issues: It's good that you've documented the known issues, particularly around toggle state persistence, but these would need to be addressed before merging or at least have clear follow-up tasks created.

4. Test Plan: Your test plan is helpful, but when you add the standard checklist, please ensure you've included specific verification steps for this feature.

5. User ID Validation: The changes to backend/data/graph.py correctly validate user access in the update_graph_metadata function, which is good.

Once you've added the standard PR checklist with your test plan and addressed the known issues (or planned follow-ups), this should be ready for review again.

[AutoGPT-Agent]

Thank you for this PR implementing a graph-level Safe Mode toggle for HITL blocks. The feature looks well-designed and adds important safety functionality to the platform.

However, there's one key issue that needs to be addressed before this PR can be merged:

Required Changes

• Missing PR Checklist: Our PR template requires a completed checklist for all PRs with material code changes. Please add the standard PR checklist from the template and ensure all items are checked off or explained.

Additional Feedback

• The implementation generally looks solid. I especially like the detailed technical implementation and known issues sections in your description.
• The backend changes for the Safe Mode feature appear to be implemented correctly, with proper database migrations and API updates.
• The frontend components for the toggle are well-designed with appropriate variants for different contexts.
• Good job on considering the UX implications of the toggle placement in different views.

Once you add the required checklist, this PR should be ready for review and potential approval.

[github-actions]

This pull request has conflicts with the base branch, please resolve those so we can evaluate the pull request.