Added SkillTreeType enum and implemented dropdown selection in SkillTreeView

- Introduced a new `SkillTreeType` enum to represent different skill tree categories: General, Coding, Data, and Scrape/Synthesize.
- Extended the `SkillTreeType` enum to provide associated string values and JSON file names for each category.
- Refactored the `SkillTreeViewModel` to reload the skill tree data based on the selected category.
- Enhanced `SkillTreeView` by adding a positioned dropdown in the top-left corner to allow users to select and load different skill tree categories dynamically.

frontend/lib/models/skill_tree/skill_tree_category.dart

@@ -0,0 +1,38 @@
+enum SkillTreeCategory {
+  general,
+  coding,
+  data,
+  scrapeSynthesize,
+}
+
+extension SkillTreeTypeExtension on SkillTreeCategory {
+  String get stringValue {
+    switch (this) {
+      case SkillTreeCategory.general:
+        return 'General';
+      case SkillTreeCategory.coding:
+        return 'Coding';
+      case SkillTreeCategory.data:
+        return 'Data';
+      case SkillTreeCategory.scrapeSynthesize:
+        return 'Scrape/Synthesize';
+      default:
+        return '';
+    }
+  }
+
+  String get jsonFileName {
+    switch (this) {
+      case SkillTreeCategory.general:
+        return 'general_tree_structure.json';
+      case SkillTreeCategory.coding:
+        return 'coding_tree_structure.json';
+      case SkillTreeCategory.data:
+        return 'data_tree_structure.json';
+      case SkillTreeCategory.scrapeSynthesize:
+        return 'scrape_synthesize_tree_structure.json';
+      default:
+        return '';
+    }
+  }
+}

frontend/lib/viewmodels/skill_tree_viewmodel.dart

@@ -3,6 +3,7 @@ import 'package:auto_gpt_flutter_client/models/benchmark/benchmark_run.dart';
 import 'package:auto_gpt_flutter_client/models/benchmark/benchmark_step_request_body.dart';
 import 'package:auto_gpt_flutter_client/models/benchmark/benchmark_task_request_body.dart';
 import 'package:auto_gpt_flutter_client/models/benchmark/benchmark_task_status.dart';
+import 'package:auto_gpt_flutter_client/models/skill_tree/skill_tree_category.dart';
 import 'package:auto_gpt_flutter_client/models/skill_tree/skill_tree_edge.dart';
 import 'package:auto_gpt_flutter_client/models/skill_tree/skill_tree_node.dart';
 import 'package:auto_gpt_flutter_client/models/step.dart';
@@ -41,15 +42,18 @@ class SkillTreeViewModel extends ChangeNotifier {
   final Graph graph = Graph();
   SugiyamaConfiguration builder = SugiyamaConfiguration();
 
+  SkillTreeCategory currentSkillTreeType = SkillTreeCategory.general;
+
   SkillTreeViewModel(this.benchmarkService, this.leaderboardService);
 
   Future<void> initializeSkillTree() async {
     try {
       resetState();
 
+      String fileName = currentSkillTreeType.jsonFileName;
+
       // Read the JSON file from assets
-      String jsonContent =
-          await rootBundle.loadString('assets/tree_structure.json');
+      String jsonContent = await rootBundle.loadString('assets/$fileName');
 
       // Decode the JSON string
       Map<String, dynamic> decodedJson = jsonDecode(jsonContent);
@@ -67,6 +71,7 @@ class SkillTreeViewModel extends ChangeNotifier {
       }
 
       builder.orientation = (SugiyamaConfiguration.ORIENTATION_LEFT_RIGHT);
+      builder.bendPointShape = CurvedBendPointShape(curveLength: 20);
 
       notifyListeners();
 
@@ -206,7 +211,6 @@ class SkillTreeViewModel extends ChangeNotifier {
         // Trigger the evaluation
         final evaluationResponse =
             await benchmarkService.triggerEvaluation(task.id);
-        print("Evaluation response: $evaluationResponse");
 
         // Decode the evaluationResponse into a BenchmarkRun object
         BenchmarkRun benchmarkRun = BenchmarkRun.fromJson(evaluationResponse);
@@ -216,7 +220,7 @@ class SkillTreeViewModel extends ChangeNotifier {
         await leaderboardService.submitReport(benchmarkRun);
 
         // Update the benchmarkStatusList based on the evaluation response
-        bool successStatus = evaluationResponse['metrics']['success'];
+        bool successStatus = benchmarkRun.metrics.success;
         benchmarkStatusMap[node] = successStatus
             ? BenchmarkTaskStatus.success
             : BenchmarkTaskStatus.failure;

frontend/lib/views/skill_tree/skill_tree_view.dart

@@ -1,3 +1,4 @@
+import 'package:auto_gpt_flutter_client/models/skill_tree/skill_tree_category.dart';
 import 'package:auto_gpt_flutter_client/models/skill_tree/skill_tree_node.dart';
 import 'package:auto_gpt_flutter_client/viewmodels/skill_tree_viewmodel.dart';
 import 'package:auto_gpt_flutter_client/views/skill_tree/tree_node_view.dart';
@@ -24,7 +25,9 @@ class _SkillTreeViewState extends State<SkillTreeView> {
 
   @override
   Widget build(BuildContext context) {
-    return FutureBuilder<void>(
+    return Stack(
+      children: [
+        FutureBuilder<void>(
           future: initialization,
           builder: (context, snapshot) {
             widget.viewModel.graph.nodes.clear();
@@ -60,12 +63,15 @@ class _SkillTreeViewState extends State<SkillTreeView> {
                   Expanded(
                     child: InteractiveViewer(
                       constrained: false,
-                  boundaryMargin: const EdgeInsets.all(100),
-                  minScale: 0.01,
-                  maxScale: 5.6,
+                      child: SizedBox(
+                        width: MediaQuery.of(context).size.width,
+                        height: MediaQuery.of(context).size.height,
+                        child: Align(
+                          alignment: Alignment.centerLeft,
                           child: GraphView(
                             graph: widget.viewModel.graph,
-                    algorithm: SugiyamaAlgorithm(widget.viewModel.builder),
+                            algorithm:
+                                SugiyamaAlgorithm(widget.viewModel.builder),
                             paint: Paint()
                               ..color = Colors.green
                               ..strokeWidth = 1
@@ -77,8 +83,8 @@ class _SkillTreeViewState extends State<SkillTreeView> {
                               if (skillTreeNode != null) {
                                 return TreeNodeView(
                                     node: skillTreeNode,
-                            selected:
-                                nodeId == widget.viewModel.selectedNode?.id);
+                                    selected: nodeId ==
+                                        widget.viewModel.selectedNode?.id);
                               } else {
                                 return const SizedBox(); // Return an empty widget if the node is not found
                               }
@@ -86,10 +92,38 @@ class _SkillTreeViewState extends State<SkillTreeView> {
                           ),
                         ),
                       ),
+                    ),
+                  ),
                 ],
               ),
             );
           },
+        ),
+        Positioned(
+          top: 10,
+          left: 10,
+          child: Material(
+            type: MaterialType.transparency,
+            child: DropdownButton<SkillTreeCategory>(
+              value: widget.viewModel.currentSkillTreeType,
+              items: SkillTreeCategory.values.map((category) {
+                return DropdownMenuItem<SkillTreeCategory>(
+                  value: category,
+                  child: Text(category.stringValue),
+                );
+              }).toList(),
+              onChanged: (newValue) {
+                if (newValue != null) {
+                  setState(() {
+                    widget.viewModel.currentSkillTreeType = newValue;
+                    widget.viewModel.initializeSkillTree();
+                  });
+                }
+              },
+            ),
+          ),
+        )
+      ],
     );
   }
 }

frontend/pubspec.yaml

@@ -72,6 +72,10 @@ flutter:
   - assets/tree_structure.json
   - assets/google_logo.svg.png
   - assets/github_logo.svg.png
+  - assets/general_tree_structure.json
+  - assets/coding_tree_structure.json
+  - assets/data_tree_structure.json
+  - assets/scrape_synthesize_tree_structure.json
 
 
   # An image asset can refer to one or more resolution-specific "variants", see