import 'package:flutter/material.dart';
import 'package:manager_api_new/api.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_app/Components/rounded_button.dart';
import 'package:manager_app/Components/multi_string_input_container.dart';
import 'package:manager_app/Components/string_input_container.dart';
import 'package:manager_app/Components/dropDown_input_container.dart';

void showNewOrUpdateMapAnnotation(
  BuildContext context,
  MapAnnotationDTO? annotation,
  Function(MapAnnotationDTO) onSave,
) {
  MapAnnotationDTO working = annotation != null
      ? MapAnnotationDTO(
          id: annotation.id,
          label: List<TranslationDTO>.from(annotation.label ?? []),
          type: annotation.type != null ? List<TranslationDTO>.from(annotation.type!) : [],
          geometryType: annotation.geometryType,
          polyColor: annotation.polyColor,
          icon: annotation.icon,
        )
      : MapAnnotationDTO(
          label: [],
          type: [],
          geometryType: GeometryType.number0, // Point
          polyColor: '#FF0000',
        );

  final List<String> geometryTypeLabels = ['Point', 'Polyline', 'Circle', 'Polygon'];

  String geometryTypeToLabel(GeometryType? gt) {
    if (gt == null) return 'Point';
    switch (gt.value) {
      case 0: return 'Point';
      case 1: return 'Polyline';
      case 2: return 'Circle';
      case 3: return 'Polygon';
      default: return 'Point';
    }
  }

  GeometryType labelToGeometryType(String label) {
    switch (label) {
      case 'Polyline': return GeometryType.number1;
      case 'Circle': return GeometryType.number2;
      case 'Polygon': return GeometryType.number3;
      default: return GeometryType.number0;
    }
  }

  showDialog(
    context: context,
    builder: (BuildContext context) {
      return StatefulBuilder(
        builder: (context, setState) {
          final double screenWidth = MediaQuery.of(context).size.width;
          final double screenHeight = MediaQuery.of(context).size.height;
          final double dialogWidth = screenWidth * 0.6;
          final double contentWidth = dialogWidth - 48;
          final double halfWidth = (contentWidth - 20) / 2;

          return Dialog(
            shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
            child: Container(
              width: dialogWidth,
              constraints: BoxConstraints(maxHeight: screenHeight * 0.8),
              padding: const EdgeInsets.all(24),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    annotation == null ? "Nouvelle Annotation" : "Modifier l'Annotation",
                    style: TextStyle(
                        color: kPrimaryColor,
                        fontSize: 20,
                        fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 16),
                  Flexible(
                    child: SingleChildScrollView(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            children: [
                              SizedBox(
                                width: halfWidth,
                                child: MultiStringInputContainer(
                                  label: "Label :",
                                  modalLabel: "Label de l'annotation",
                                  initialValue: working.label ?? [],
                                  onGetResult: (val) =>
                                      setState(() => working.label = val),
                                  maxLines: 1,
                                  isTitle: true,
                                  isHTML: false,
                                ),
                              ),
                              const SizedBox(width: 20),
                              SizedBox(
                                width: halfWidth,
                                child: DropDownInputContainer(
                                  label: "Géométrie :",
                                  values: geometryTypeLabels,
                                  initialValue: geometryTypeToLabel(working.geometryType),
                                  onChange: (val) => setState(() =>
                                      working.geometryType = labelToGeometryType(val)),
                                ),
                              ),
                            ],
                          ),
                          const SizedBox(height: 16),
                          Row(
                            children: [
                              SizedBox(
                                width: halfWidth,
                                child: StringInputContainer(
                                  label: "Couleur (hex) :",
                                  initialValue: working.polyColor ?? '#FF0000',
                                  onChanged: (val) =>
                                      setState(() => working.polyColor = val),
                                ),
                              ),
                              const SizedBox(width: 20),
                              SizedBox(
                                width: halfWidth,
                                child: StringInputContainer(
                                  label: "Icône (material) :",
                                  initialValue: working.icon ?? '',
                                  onChanged: (val) =>
                                      setState(() => working.icon = val.isEmpty ? null : val),
                                ),
                              ),
                            ],
                          ),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 16),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: [
                      SizedBox(
                        height: 46,
                        child: RoundedButton(
                          text: "Annuler",
                          press: () => Navigator.pop(context),
                          color: kSecond,
                          fontSize: 15,
                          horizontal: 24,
                        ),
                      ),
                      const SizedBox(width: 12),
                      SizedBox(
                        height: 46,
                        child: RoundedButton(
                          text: "Sauvegarder",
                          press: () {
                            onSave(working);
                            Navigator.pop(context);
                          },
                          color: kPrimaryColor,
                          fontSize: 15,
                          horizontal: 24,
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          );
        },
      );
    },
  );
}