import 'package:flutter/material.dart';
import 'package:country_pickers/country.dart';
import 'package:country_pickers/countries.dart';
import 'package:country_pickers/utils/utils.dart';
import 'package:lba/res/colors.dart';

class CustomCountryPicker extends StatefulWidget {
  final ValueChanged<Country> onCountrySelected;

  const CustomCountryPicker({
    super.key,
    required this.onCountrySelected,
  });

  @override
  State<CustomCountryPicker> createState() => _CustomCountryPickerState();
}

class _CustomCountryPickerState extends State<CustomCountryPicker> {
  late List<Country> _allCountries;
  late List<Country> _filteredCountries;
  final TextEditingController _searchController = TextEditingController();

  @override
  void initState() {
    super.initState();
    _allCountries = countryList;
    _filteredCountries = _allCountries;
    _searchController.addListener(_filterCountries);
  }

  @override
  void dispose() {
    _searchController.dispose();
    super.dispose();
  }

  void _filterCountries() {
    final query = _searchController.text.toLowerCase();
    setState(() {
      _filteredCountries = _allCountries.where((country) {
        return country.name.toLowerCase().contains(query) ||
            country.phoneCode.contains(query) ||
            country.isoCode.toLowerCase().contains(query);
      }).toList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Dialog(
      backgroundColor: AppColors.surface,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12),
      ),
      child: Container(
        decoration: BoxDecoration(
          color: AppColors.surface,
          borderRadius: BorderRadius.circular(12),
        ),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              padding: const EdgeInsets.all(16),
              decoration: BoxDecoration(
                color: AppColors.surface,
                borderRadius: const BorderRadius.only(
                  topLeft: Radius.circular(12),
                  topRight: Radius.circular(12),
                ),
              ),
              child: Column(
                children: [
                  Text(
                    'Select Country',
                    style: TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.bold,
                      color: AppColors.textPrimary,
                    ),
                  ),
                  const SizedBox(height: 16),
                  Container(
                    decoration: BoxDecoration(
                      color: AppColors.profileField,
                      borderRadius: BorderRadius.circular(8),
                      border: Border.all(color: AppColors.divider),
                    ),
                    child: TextField(
                      controller: _searchController,
                      style: TextStyle(color: AppColors.textPrimary),
                      decoration: InputDecoration(
                        hintText: 'Search...',
                        hintStyle: TextStyle(color: AppColors.hint),
                        prefixIcon: Icon(
                          Icons.search,
                          color: AppColors.textPrimary,
                        ),
                        border: InputBorder.none,
                        contentPadding: const EdgeInsets.symmetric(
                          horizontal: 16,
                          vertical: 12,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
            Container(
              height: 300,
              decoration: BoxDecoration(
                color: AppColors.surface,
              ),
              child: _filteredCountries.isNotEmpty
                  ? ListView.builder(
                      itemCount: _filteredCountries.length,
                      itemBuilder: (context, index) {
                        final country = _filteredCountries[index];
                        return Container(
                          color: AppColors.surface,
                          child: ListTile(
                            leading: CountryPickerUtils.getDefaultFlagImage(country),
                            title: Text(
                              country.name,
                              style: TextStyle(color: AppColors.textPrimary),
                            ),
                            subtitle: Text(
                              '+${country.phoneCode}',
                              style: TextStyle(color: AppColors.textSecondary),
                            ),
                            onTap: () {
                              widget.onCountrySelected(country);
                              Navigator.of(context).pop();
                            },
                          ),
                        );
                      },
                    )
                  : Container(
                      color: AppColors.surface,
                      child: Center(
                        child: Text(
                          'No country found',
                          style: TextStyle(color: AppColors.textSecondary),
                        ),
                      ),
                    ),
            ),
            Container(
              height: 16,
              color: AppColors.surface,
            ),
          ],
        ),
      ),
    );
  }
}