forked from Significant-Gravitas/AutoGPT
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Integrate TaskQueueView and Enhance SkillTree Functionality (Signific…
…ant-Gravitas#5206) * Add TestQueueView to Main Layout This commit integrates the TestQueueView into the main layout. The layout now conditionally displays the TestQueueView based on whether a node in the SkillTree is selected. - TestQueueView appears when a SkillTree node is selected. - Main layout adjusts to accommodate TestQueueView alongside SkillTreeView and ChatView. - Implemented responsive layout logic to manage the widths of the different views based on the screen width and the state of the SkillTree. * Extend SkillTreeViewModel to Track Selected Node Hierarchy This commit enhances the SkillTreeViewModel to maintain a list of nodes that form a hierarchy from the currently selected node to the root. This allows for more interactive and informative views that can leverage this hierarchical data. - Added a new property `selectedNodeHierarchy` to keep track of the node hierarchy. - Modified the `toggleNodeSelection` method to populate or clear `selectedNodeHierarchy` based on node selection. - Introduced a new method `populateSelectedNodeHierarchy` to build the hierarchy from the selected node to the root. * Extract skill tree view model reset state to method * Implement UI enhancements for TaskQueueView This commit introduces several UI improvements to the TaskQueueView: - Tiles are padded 20 units from both the leading and trailing edges. - Tiles now have a white background. - Added a thin black border to the tiles. - Incorporated a slight corner radius for the tiles. - Centered the title and subtitle horizontally within the tiles. - Added a checkmark button with a tooltip at the bottom-right corner for running a suite of tests. These changes aim to improve the user experience and visual appeal of the TaskQueueView. * Make MainLayout a consumer of SkillTreeViewModel
- Loading branch information
1 parent
a6e195a
commit 314cce7
Showing
3 changed files
with
184 additions
and
26 deletions.
There are no files selected for viewing
This file contains 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
This file contains 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
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:auto_gpt_flutter_client/viewmodels/skill_tree_viewmodel.dart'; | ||
| import 'package:provider/provider.dart'; | ||
|
|
||
| // TODO: Add view model for task queue instead of skill tree view model | ||
| class TaskQueueView extends StatelessWidget { | ||
| @override | ||
| Widget build(BuildContext context) { | ||
| final viewModel = Provider.of<SkillTreeViewModel>(context); | ||
|
|
||
| // Reverse the node hierarchy | ||
| final reversedHierarchy = | ||
| viewModel.selectedNodeHierarchy?.reversed.toList() ?? []; | ||
|
|
||
| return Material( | ||
| color: Colors.white, | ||
| child: Stack( | ||
| children: [ | ||
| // The list of tasks (tiles) | ||
| ListView.builder( | ||
| itemCount: reversedHierarchy.length, | ||
| itemBuilder: (context, index) { | ||
| final node = reversedHierarchy[index]; | ||
| return Container( | ||
| margin: EdgeInsets.fromLTRB(20, 5, 20, 5), | ||
| decoration: BoxDecoration( | ||
| color: Colors.white, // white background | ||
| border: Border.all( | ||
| color: Colors.black, width: 1), // thin black border | ||
| borderRadius: BorderRadius.circular(4), // small corner radius | ||
| ), | ||
| child: ListTile( | ||
| title: Center(child: Text('Node ID: ${node.id}')), | ||
| subtitle: Center(child: Text('Color: ${node.color}')), | ||
| ), | ||
| ); | ||
| }, | ||
| ), | ||
|
|
||
| // Checkmark button at the bottom right | ||
| Positioned( | ||
| bottom: 50, | ||
| right: 50, | ||
| child: Tooltip( | ||
| message: 'Run suite of tests', | ||
| child: ElevatedButton( | ||
| onPressed: () { | ||
| // Add your logic here to run the suite of tests | ||
| }, | ||
| child: Icon(Icons.check, color: Colors.green), | ||
| style: ButtonStyle( | ||
| shape: MaterialStateProperty.all<RoundedRectangleBorder>( | ||
| RoundedRectangleBorder( | ||
| borderRadius: BorderRadius.circular(8.0), | ||
| ), | ||
| ), | ||
| backgroundColor: MaterialStateProperty.all(Colors.white), | ||
| side: MaterialStateProperty.all( | ||
| BorderSide(color: Colors.green, width: 3)), | ||
| minimumSize: | ||
| MaterialStateProperty.all(Size(50, 50)), // Square size | ||
| padding: MaterialStateProperty.all(EdgeInsets.all(0)), | ||
| ), | ||
| ), | ||
| ), | ||
| ), | ||
| ], | ||
| ), | ||
| ); | ||
| } | ||
| } |