import 'package:flutter/material.dart';
import 'package:manager_api_new/api.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_app/Screens/Configurations/Section/SubSection/Parcours/showNewOrUpdateGuidedPath.dart';

class ParcoursConfig extends StatefulWidget {
  final List<GuidedPathDTO> initialValue;
  final String parentId;
  final bool isEvent;
  final bool isEscapeMode;
  final ValueChanged<List<GuidedPathDTO>> onChanged;

  const ParcoursConfig({
    Key? key,
    required this.initialValue,
    required this.parentId,
    required this.isEvent,
    this.isEscapeMode = false,
    required this.onChanged,
  }) : super(key: key);

  @override
  _ParcoursConfigState createState() => _ParcoursConfigState();
}

class _ParcoursConfigState extends State<ParcoursConfig> {
  late List<GuidedPathDTO> paths;

  @override
  void initState() {
    super.initState();
    paths = List.from(widget.initialValue);
    paths.sort((a, b) => (a.order ?? 0).compareTo(b.order ?? 0));
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text("Parcours Guidés",
                  style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
              ElevatedButton.icon(
                icon: Icon(Icons.add),
                label: Text("Ajouter un parcours"),
                onPressed: () {
                  showNewOrUpdateGuidedPath(
                    context,
                    null,
                    widget.parentId,
                    widget.isEvent,
                    widget.isEscapeMode,
                    (newPath) {
                      setState(() {
                        newPath.order = paths.length;
                        paths.add(newPath);
                        widget.onChanged(paths);
                      });
                    },
                  );
                },
                style: ElevatedButton.styleFrom(
                    backgroundColor: kSuccess, foregroundColor: kWhite),
              ),
            ],
          ),
        ),
        Expanded(
          child: paths.isEmpty
              ? Center(
                  child: Text("Aucun parcours configuré",
                      style: TextStyle(fontStyle: FontStyle.italic)))
              : ReorderableListView.builder(
                  buildDefaultDragHandles: false,
                  itemCount: paths.length,
                  onReorder: (oldIndex, newIndex) {
                    setState(() {
                      if (newIndex > oldIndex) newIndex -= 1;
                      final item = paths.removeAt(oldIndex);
                      paths.insert(newIndex, item);
                      for (int i = 0; i < paths.length; i++) {
                        paths[i].order = i;
                      }
                      widget.onChanged(paths);
                    });
                  },
                  itemBuilder: (context, index) {
                    final path = paths[index];
                    return Card(
                      key: ValueKey(path.id ?? index.toString()),
                      margin: EdgeInsets.symmetric(horizontal: 10, vertical: 5),
                      child: ListTile(
                        leading: CircleAvatar(
                            child: Text("${index + 1}"),
                            backgroundColor: kPrimaryColor,
                            foregroundColor: kWhite),
                        title: Text(path.title != null && path.title!.isNotEmpty
                            ? path.title!
                                    .firstWhere((t) => t.language == 'FR',
                                        orElse: () => path.title![0])
                                    .value ??
                                "Parcours sans titre"
                            : "Parcours sans titre"),
                        subtitle: Text("${path.steps?.length ?? 0} étapes"),
                        trailing: Row(
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            IconButton(
                              icon: Icon(Icons.edit, color: kPrimaryColor),
                              onPressed: () {
                                showNewOrUpdateGuidedPath(
                                  context,
                                  path,
                                  widget.parentId,
                                  widget.isEvent,
                                  widget.isEscapeMode,
                                  (updatedPath) {
                                    setState(() {
                                      paths[index] = updatedPath;
                                      widget.onChanged(paths);
                                    });
                                  },
                                );
                              },
                            ),
                            IconButton(
                              icon: Icon(Icons.delete, color: kError),
                              onPressed: () {
                                setState(() {
                                  paths.removeAt(index);
                                  for (int i = 0; i < paths.length; i++) {
                                    paths[i].order = i;
                                  }
                                  widget.onChanged(paths);
                                });
                              },
                            ),
                            ReorderableDragStartListener(
                              index: index,
                              child: Icon(Icons.drag_handle),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                ),
        ),
      ],
    );
  }
}