mirror of
https://github.com/aljazceru/Auto-GPT.git
synced 2025-12-17 05:54:26 +01:00
* 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
72 lines
2.6 KiB
Dart
72 lines
2.6 KiB
Dart
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)),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|