import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:google_fonts/google_fonts.dart';

typedef OnChangedCallback = void Function(dynamic value);

class DropDownWidget extends StatelessWidget {
  final String label;
  final List list;
  final String listTitle;
  final OnChangedCallback onChanged;

  const DropDownWidget({
    super.key,
    required this.label,
    required this.list,
    required this.listTitle,
    required this.onChanged,
  });
  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          '$label:',
          style: GoogleFonts.outfit(
            textStyle: const TextStyle(color: Colors.white, fontSize: 16),
          ),
        ),
        const Gap(8),
        Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(12), // Set the desired border radius
            border: Border.all(color: const Color.fromRGBO(255, 255, 255, 1)), // Set the border color
          ),
          child: DropdownMenu(
            initialSelection: '',
            dropdownMenuEntries: [
              for (var item in list)
                DropdownMenuEntry(
                    label: item[listTitle].toString(),
                    value: item[listTitle],
                    style: ButtonStyle(
                        foregroundColor: WidgetStateProperty.all<Color>(const Color.fromRGBO(255, 255, 255, 1)),
                        textStyle: WidgetStateProperty.all<TextStyle>(
                            GoogleFonts.outfit(fontSize: 16, fontWeight: FontWeight.w500)))),
            ],
            onSelected: onChanged,
            width: MediaQuery.of(context).size.width * 0.8,
            menuHeight: MediaQuery.of(context).size.height * 0.8,
            textStyle: GoogleFonts.outfit(textStyle: const TextStyle(color: Color.fromRGBO(255, 255, 255, 1))),
            menuStyle: MenuStyle(
              backgroundColor: WidgetStateProperty.all<Color>(const Color.fromRGBO(23, 37, 62, 0.8)),
              padding: WidgetStateProperty.all(const EdgeInsets.symmetric(vertical: 16)),
              shape: WidgetStateProperty.all(RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20), // Set the border radius for the dropdown menu
              )),
            ),
          ),
        ),
      ],
    );
  }
}
