aljaz/Auto-GPT
1
0
Fork 0
mirror of https://github.com/aljazceru/Auto-GPT.git synced 2025-12-18 06:24:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix UI Overlap Issue in TaskQueueView

Browse Source 
This commit addresses a UI issue where the ListView items were overlapping with the Positioned widget in the TaskQueueView. The Positioned widget has been replaced with a more flexible layout using a Column widget to ensure proper spacing and positioning of elements on the screen. The ListView now takes up all available space above the buttons, preventing any overlap and enhancing the user experience.
This commit is contained in:
hunteraraujo
2023-10-03 22:05:21 -07:00
parent 6bd3136fe0
commit da6311fb1e
1 changed files with 69 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

139
frontend/lib/views/task_queue/task_queue_view.dart
View File

@@ -8,7 +8,6 @@ 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) {
@@ -19,80 +18,81 @@ class TaskQueueView extends StatelessWidget {
return Material(
color: Colors.white,
child: Stack(
child: Column(
children: [
// The list of tasks (tiles)
ListView.builder(
itemCount: nodeHierarchy.length,
itemBuilder: (context, index) {
final node = nodeHierarchy[index];
Expanded(
child: ListView.builder(
itemCount: nodeHierarchy.length,
itemBuilder: (context, index) {
final node = nodeHierarchy[index];
// Choose the appropriate leading widget based on the task status
Widget leadingWidget;
switch (viewModel.benchmarkStatusMap[node]) {
case null:
case BenchmarkTaskStatus.notStarted:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.grey,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
case BenchmarkTaskStatus.inProgress:
leadingWidget = SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(
strokeWidth: 2,
),
);
break;
case BenchmarkTaskStatus.success:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.green,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
case BenchmarkTaskStatus.failure:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.red,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
}
// Choose the appropriate leading widget based on the task status
Widget leadingWidget;
switch (viewModel.benchmarkStatusMap[node]) {
case null:
case BenchmarkTaskStatus.notStarted:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.grey,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
case BenchmarkTaskStatus.inProgress:
leadingWidget = SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(
strokeWidth: 2,
),
);
break;
case BenchmarkTaskStatus.success:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.green,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
case BenchmarkTaskStatus.failure:
leadingWidget = CircleAvatar(
radius: 12,
backgroundColor: Colors.red,
child: CircleAvatar(
radius: 6,
backgroundColor: Colors.white,
),
);
break;
}
return Container(
margin: EdgeInsets.fromLTRB(20, 5, 20, 5),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.black, width: 1),
borderRadius: BorderRadius.circular(4),
),
child: ListTile(
leading: leadingWidget,
title: Center(child: Text('${node.label}')),
subtitle:
Center(child: Text('${node.data.info.description}')),
),
);
},
return Container(
margin: EdgeInsets.fromLTRB(20, 5, 20, 5),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.black, width: 1),
borderRadius: BorderRadius.circular(4),
),
child: ListTile(
leading: leadingWidget,
title: Center(child: Text('${node.label}')),
subtitle:
Center(child: Text('${node.data.info.description}')),
),
);
},
),
),
Positioned(
bottom: 20,
left: 20,
right: 20,
// Buttons at the bottom
Padding(
padding: EdgeInsets.all(20),
child: Column(
children: [
// TestSuiteButton
@@ -109,7 +109,6 @@ class TaskQueueView extends StatelessWidget {
chatViewModel.clearCurrentTaskAndChats();
viewModel.runBenchmark(chatViewModel, taskViewModel);
},
isDisabled: viewModel.isBenchmarkRunning,
),
SizedBox(height: 8), // Gap of 8 points between buttons
// LeaderboardSubmissionButton