mirror of
https://github.com/Significant-Gravitas/AutoGPT.git
synced 2026-02-12 07:45:14 -05:00
8b995c2394
This PR introduces saving functionality to the new builder interface, allowing users to save and update agent flows. The implementation includes both UI components and backend integration for persistent storage of agent configurations. https://github.com/user-attachments/assets/95ee46de-2373-4484-9f34-5f09aa071c5e ### Key Features Added: #### 1. **Save Control Component** (`NewSaveControl`) - Added a new save control popover in the control panel with form inputs for agent name, description, and version display - Integrated with the new control panel as a primary action button with a floppy disk icon - Supports keyboard shortcuts (Ctrl+S / Cmd+S) for quick saving #### 2. **Graph Persistence Logic** - Implemented `useNewSaveControl` hook to handle: - Creating new graphs via `usePostV1CreateNewGraph` - Updating existing graphs via `usePutV1UpdateGraphVersion` - Intelligent comparison to prevent unnecessary saves when no changes are made - URL parameter management for flowID and flowVersion tracking #### 3. **Loading State Management** - Added `GraphLoadingBox` component to display a loading indicator while graphs are being fetched - Enhanced `useFlow` hook with loading state tracking (`isFlowContentLoading`) - Improved UX with clear visual feedback during graph operations #### 4. **Component Reorganization** - Refactored components from `NewBlockMenu` to `NewControlPanel` directory structure for better organization: - Moved all block menu related components under `NewControlPanel/NewBlockMenu/` - Separated save control into its own module (`NewControlPanel/NewSaveControl/`) - Improved modularity and separation of concerns #### 5. **State Management Enhancements** - Added `controlPanelStore` for managing control panel states (e.g., save popover visibility) - Enhanced `nodeStore` with `getBackendNodes()` method for retrieving nodes in backend format - Added `getBackendLinks()` to `edgeStore` for consistent link formatting ### Technical Improvements: - **Graph Comparison Logic**: Implemented `graphsEquivalent()` helper to deeply compare saved and current graph states, preventing redundant saves - **Form Validation**: Used Zod schema validation for save form inputs with proper constraints - **Error Handling**: Comprehensive error handling with user-friendly toast notifications - **Query Invalidation**: Proper cache invalidation after successful saves to ensure data consistency ### UI/UX Enhancements: - Clean, modern save dialog with clear labeling and placeholder text - Real-time version display showing the current graph version - Disabled state for save button during operations to prevent double submissions - Toast notifications for success and error states - Higher z-index for GraphLoadingBox to ensure visibility over other elements ### Checklist 📋 #### For code changes: - [x] I have clearly listed my changes in the PR description - [x] I have made a test plan - [x] I have tested my changes according to the test plan: - [x] Saving is working perfectly. All nodes, links, their positions, and hardcoded data are saved correctly. - [x] If there are no changes, the user cannot save the graph.