Przebudowanie aplikacji, usprawnione AI, dodanie combo buildera

lib/presentation/plan_editor/plan_editor_page.dart

@@ -5,18 +5,28 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:trainhub_flutter/core/constants/ui_constants.dart';
 import 'package:trainhub_flutter/core/theme/app_colors.dart';
 import 'package:trainhub_flutter/presentation/plan_editor/plan_editor_controller.dart';
+import 'package:trainhub_flutter/presentation/plan_editor/widgets/plan_flow_graph.dart';
 import 'package:trainhub_flutter/presentation/plan_editor/widgets/plan_section_card.dart';
 
 @RoutePage()
-class PlanEditorPage extends ConsumerWidget {
+class PlanEditorPage extends ConsumerStatefulWidget {
   final String planId;
 
   const PlanEditorPage({super.key, @PathParam('planId') required this.planId});
 
   @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final state = ref.watch(planEditorControllerProvider(planId));
-    final controller = ref.read(planEditorControllerProvider(planId).notifier);
+  ConsumerState<PlanEditorPage> createState() => _PlanEditorPageState();
+}
+
+class _PlanEditorPageState extends ConsumerState<PlanEditorPage> {
+  bool _graphView = false;
+
+  @override
+  Widget build(BuildContext context) {
+    final state = ref.watch(planEditorControllerProvider(widget.planId));
+    final controller = ref.read(
+      planEditorControllerProvider(widget.planId).notifier,
+    );
 
     return Scaffold(
       backgroundColor: AppColors.surface,
@@ -104,6 +114,13 @@ class PlanEditorPage extends ConsumerWidget {
                   ),
                 ),
 
+                // List / graph view toggle
+                _ViewToggle(
+                  graphView: _graphView,
+                  onChanged: (v) => setState(() => _graphView = v),
+                ),
+                const SizedBox(width: UIConstants.spacing16),
+
                 // Unsaved changes badge + save button
                 state.maybeWhen(
                   data: (data) => data.isDirty
@@ -115,7 +132,9 @@ class PlanEditorPage extends ConsumerWidget {
                                 vertical: 4,
                               ),
                               decoration: BoxDecoration(
-                                color: AppColors.warning.withValues(alpha: 0.12),
+                                color: AppColors.warning.withValues(
+                                  alpha: 0.12,
+                                ),
                                 borderRadius: BorderRadius.circular(20),
                                 border: Border.all(
                                   color: AppColors.warning.withValues(
@@ -150,41 +169,50 @@ class PlanEditorPage extends ConsumerWidget {
           // --- Body ---
           Expanded(
             child: state.when(
-              data: (data) => ReorderableListView.builder(
-                padding: const EdgeInsets.all(UIConstants.spacing24),
-                onReorder: controller.reorderSection,
-                footer: Center(
-                  child: Padding(
-                    padding: const EdgeInsets.symmetric(
-                      vertical: UIConstants.spacing16,
-                    ),
-                    child: OutlinedButton.icon(
-                      onPressed: controller.addSection,
-                      icon: const Icon(Icons.add, size: 16),
-                      label: const Text('Add Section'),
-                      style: OutlinedButton.styleFrom(
-                        foregroundColor: AppColors.textSecondary,
-                        side: const BorderSide(color: AppColors.border),
-                        padding: const EdgeInsets.symmetric(
-                          horizontal: UIConstants.spacing24,
-                          vertical: UIConstants.spacing12,
+              data: (data) => _graphView
+                  ? PlanFlowGraph(
+                      // Rebuild the graph when the plan structure changes.
+                      key: ValueKey(
+                        '${data.plan.id}-${data.plan.totalExercises}-'
+                        '${data.plan.sections.length}',
+                      ),
+                      plan: data.plan,
+                    )
+                  : ReorderableListView.builder(
+                      padding: const EdgeInsets.all(UIConstants.spacing24),
+                      onReorder: controller.reorderSection,
+                      footer: Center(
+                        child: Padding(
+                          padding: const EdgeInsets.symmetric(
+                            vertical: UIConstants.spacing16,
+                          ),
+                          child: OutlinedButton.icon(
+                            onPressed: controller.addSection,
+                            icon: const Icon(Icons.add, size: 16),
+                            label: const Text('Add Section'),
+                            style: OutlinedButton.styleFrom(
+                              foregroundColor: AppColors.textSecondary,
+                              side: const BorderSide(color: AppColors.border),
+                              padding: const EdgeInsets.symmetric(
+                                horizontal: UIConstants.spacing24,
+                                vertical: UIConstants.spacing12,
+                              ),
+                            ),
+                          ),
                         ),
                       ),
+                      itemCount: data.plan.sections.length,
+                      itemBuilder: (context, index) {
+                        final section = data.plan.sections[index];
+                        return PlanSectionCard(
+                          key: ValueKey(section.id),
+                          section: section,
+                          sectionIndex: index,
+                          plan: data.plan,
+                          availableExercises: data.availableExercises,
+                        );
+                      },
                     ),
-                  ),
-                ),
-                itemCount: data.plan.sections.length,
-                itemBuilder: (context, index) {
-                  final section = data.plan.sections[index];
-                  return PlanSectionCard(
-                    key: ValueKey(section.id),
-                    section: section,
-                    sectionIndex: index,
-                    plan: data.plan,
-                    availableExercises: data.availableExercises,
-                  );
-                },
-              ),
               error: (e, s) => Center(
                 child: Text(
                   'Error: $e',
@@ -199,3 +227,77 @@ class PlanEditorPage extends ConsumerWidget {
     );
   }
 }
+
+// ---------------------------------------------------------------------------
+// List / graph segmented toggle
+// ---------------------------------------------------------------------------
+class _ViewToggle extends StatelessWidget {
+  const _ViewToggle({required this.graphView, required this.onChanged});
+
+  final bool graphView;
+  final ValueChanged<bool> onChanged;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      decoration: BoxDecoration(
+        color: AppColors.surfaceContainerHigh,
+        borderRadius: BorderRadius.circular(8),
+        border: Border.all(color: AppColors.border),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          _ToggleButton(
+            icon: Icons.view_list_rounded,
+            tooltip: 'List view',
+            selected: !graphView,
+            onTap: () => onChanged(false),
+          ),
+          _ToggleButton(
+            icon: Icons.account_tree_outlined,
+            tooltip: 'Graph view',
+            selected: graphView,
+            onTap: () => onChanged(true),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+class _ToggleButton extends StatelessWidget {
+  const _ToggleButton({
+    required this.icon,
+    required this.tooltip,
+    required this.selected,
+    required this.onTap,
+  });
+
+  final IconData icon;
+  final String tooltip;
+  final bool selected;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return Tooltip(
+      message: tooltip,
+      child: GestureDetector(
+        onTap: onTap,
+        child: Container(
+          padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 7),
+          decoration: BoxDecoration(
+            color: selected ? AppColors.accentMuted : Colors.transparent,
+            borderRadius: BorderRadius.circular(7),
+          ),
+          child: Icon(
+            icon,
+            size: 16,
+            color: selected ? AppColors.accent : AppColors.textMuted,
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/presentation/plan_editor/widgets/plan_flow_graph.dart

@@ -0,0 +1,121 @@
+import 'package:flutter/material.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:trainhub_flutter/core/theme/app_colors.dart';
+import 'package:trainhub_flutter/domain/entities/training_plan.dart';
+import 'package:trainhub_flutter/presentation/common/widgets/node_graph_canvas.dart';
+
+/// Graph view of a training plan: one column per section, exercises chained
+/// top-to-bottom, sections chained left-to-right — the session flow at a
+/// glance. Nodes can be dragged to rearrange the picture; the plan structure
+/// itself is edited in the list view.
+class PlanFlowGraph extends StatefulWidget {
+  const PlanFlowGraph({super.key, required this.plan});
+
+  final TrainingPlanEntity plan;
+
+  @override
+  State<PlanFlowGraph> createState() => _PlanFlowGraphState();
+}
+
+class _PlanFlowGraphState extends State<PlanFlowGraph> {
+  /// User-dragged overrides on top of the auto layout, per node id.
+  final Map<String, Offset> _overrides = {};
+
+  static const double _colWidth = 250;
+  static const double _rowHeight = 84;
+
+  @override
+  Widget build(BuildContext context) {
+    final nodes = <GraphNodeData>[];
+    final edges = <GraphEdgeData>[];
+
+    Offset pos(String id, Offset fallback) => _overrides[id] ?? fallback;
+
+    nodes.add(
+      GraphNodeData(
+        id: 'start',
+        title: 'Start Session',
+        subtitle: widget.plan.name,
+        accent: AppColors.success,
+        position: pos('start', const Offset(40, 40)),
+      ),
+    );
+
+    var previousTail = 'start';
+    for (var s = 0; s < widget.plan.sections.length; s++) {
+      final section = widget.plan.sections[s];
+      final x = 40.0 + (s + 1) * _colWidth;
+      final sectionId = 'sec-${section.id}';
+
+      nodes.add(
+        GraphNodeData(
+          id: sectionId,
+          title: section.name,
+          subtitle: '${section.exercises.length} drills',
+          accent: AppColors.accent,
+          position: pos(sectionId, Offset(x, 40)),
+        ),
+      );
+      edges.add(GraphEdgeData(previousTail, sectionId));
+
+      var tail = sectionId;
+      for (var e = 0; e < section.exercises.length; e++) {
+        final exercise = section.exercises[e];
+        final id = 'ex-${exercise.instanceId}';
+        final detail = exercise.isTime
+            ? '${exercise.sets} × ${exercise.value}s · rest ${exercise.rest}s'
+            : '${exercise.sets} × ${exercise.value} · rest ${exercise.rest}s';
+
+        nodes.add(
+          GraphNodeData(
+            id: id,
+            title: exercise.name,
+            subtitle: detail,
+            accent: AppColors.info,
+            position: pos(id, Offset(x + 24, 40 + (e + 1) * _rowHeight)),
+          ),
+        );
+        edges.add(GraphEdgeData(tail, id));
+        tail = id;
+      }
+      previousTail = tail;
+    }
+
+    return Stack(
+      children: [
+        ClipRect(
+          child: NodeGraphCanvas(
+            nodes: nodes,
+            edges: edges,
+            canvasSize: Size(
+              (widget.plan.sections.length + 2) * _colWidth + 600,
+              2000,
+            ),
+            onNodeMoved: (id, position) =>
+                setState(() => _overrides[id] = position),
+          ),
+        ),
+        Positioned(
+          left: 16,
+          bottom: 16,
+          child: Container(
+            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+            decoration: BoxDecoration(
+              color: AppColors.surfaceContainer.withValues(alpha: 0.9),
+              borderRadius: BorderRadius.circular(8),
+              border: Border.all(color: AppColors.border),
+            ),
+            child: Text(
+              'SESSION FLOW · DRAG TO REARRANGE · EDIT IN LIST VIEW',
+              style: GoogleFonts.jetBrainsMono(
+                fontSize: 9,
+                letterSpacing: 0.8,
+                color: AppColors.textMuted,
+              ),
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}