import 'package:flutter/material.dart';
import 'package:multi_select_flutter/multi_select_flutter.dart';
import 'package:manager_app/constants.dart';

class MultiSelectDropdownLanguageContainer extends StatelessWidget {
  final Color color;
  final String label;
  final String labelHint;
  final List<String> values;
  final List<String> initialValue;
  final bool isMultiple;
  final bool isAtLeastOne;
  final double fontSize;
  final ValueChanged<List<String>> onChanged;

  const MultiSelectDropdownLanguageContainer({
    Key? key,
    this.color = kSecond,
    required this.label,
    this.labelHint = "Veuillez sélectionner une langue",
    required this.values,
    required this.initialValue,
    required this.isMultiple,
    this.isAtLeastOne = false,
    this.fontSize = 18,
    required this.onChanged,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return FormField<List<String>>(
      initialValue: initialValue,
      builder: (state) {
        return InputDecorator(
          decoration: InputDecoration(
            labelText: label,
            border: OutlineInputBorder(borderRadius: BorderRadius.circular(8)),
            contentPadding: EdgeInsets.symmetric(horizontal: 25, vertical: 20),
          ),
          child: Builder(
            builder: (context) {
              return MultiSelectDialogField<String>(
                items: values.map((e) => MultiSelectItem(e, e)).toList(),
                listType: MultiSelectListType.LIST,
                initialValue: state.value ?? [],
                buttonText: Text(
                  (state.value == null || state.value!.isEmpty)
                      ? "Aucune sélection"
                      : _buildSummary(state.value!),
                ),
                title: Text(labelHint),
                searchable: true,
                selectedColor: kPrimaryColor,
                checkColor: Colors.white,
                chipDisplay: MultiSelectChipDisplay.none(),
                dialogHeight: MediaQuery.of(context).size.height * 0.4,
                dialogWidth: MediaQuery.of(context).size.width * 0.6,
                onConfirm: (selected) {
                  if (isAtLeastOne && selected.isEmpty) {
                    ScaffoldMessenger.of(context).showSnackBar(
                      SnackBar(
                        content: Text("Au moins une valeur doit être sélectionnée"),
                      ),
                    );
                  } else {
                    onChanged(selected.cast<String>());
                    state.didChange(selected);
                  }
                },
              );
            },
          ),
        );
      },
    );
  }

  String _buildSummary(List<String> selected) {
    if (selected.isEmpty) return "Aucune sélection";
    if (selected.length <= 5) return selected.join(", ");
    return "${selected.length} sélectionnés";
  }
}