import 'package:flutter/material.dart';
import 'package:hmg_patient_app_new/core/app_assets.dart';
import 'package:hmg_patient_app_new/core/enums.dart';
import 'package:hmg_patient_app_new/core/utils/size_utils.dart';
import 'package:hmg_patient_app_new/core/utils/utils.dart';
import 'package:hmg_patient_app_new/extensions/string_extensions.dart';
import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';

class CustomCountryDropdown extends StatefulWidget {
  final List<CountryEnum> countryList;
  final Function(CountryEnum)? onCountryChange;
  final bool isRtl;

  const CustomCountryDropdown({
    Key? key,
    required this.countryList,
    this.onCountryChange,
    required this.isRtl,
  }) : super(key: key);

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

class _CustomCountryDropdownState extends State<CustomCountryDropdown> {
  CountryEnum? selectedCountry;
  late OverlayEntry _overlayEntry;
  bool _isDropdownOpen = false;

  @override
  void initState() {
    super.initState();
    selectedCountry = CountryEnum.saudiArabia;
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        if (_isDropdownOpen) {
          _closeDropdown();
        } else {
          _openDropdown();
        }
      },
      child: Container(
        height: 40.h,
        decoration: RoundedRectangleBorder().toSmoothCornerDecoration(borderRadius: 10.h),
        child: Row(
          children: [
            Utils.buildSvgWithAssets(icon: selectedCountry != null ? selectedCountry!.iconPath : AppAssets.ksa, width: 40.h, height: 40.h),
            SizedBox(width: 8.h),
            Utils.buildSvgWithAssets(icon: _isDropdownOpen ? AppAssets.dropdow_icon : AppAssets.dropdow_icon),
            SizedBox(width: 4.h),
            Text(
              selectedCountry != null ? selectedCountry!.displayName : "Select Country",
              style: TextStyle(
                fontSize: 14.fSize,
                height: 21 / 14,
                fontWeight: FontWeight.w500,
                letterSpacing: -0.2,
              ),
            ),
          ],
        ),
      ),
    );
  }

  void _openDropdown() {
    RenderBox renderBox = context.findRenderObject() as RenderBox;
    Offset offset = renderBox.localToGlobal(Offset.zero);

    _overlayEntry = OverlayEntry(
      builder: (context) => Stack(
        children: [
          // Dismiss dropdown when tapping outside
          Positioned.fill(
            child: GestureDetector(
              onTap: _closeDropdown,
              behavior: HitTestBehavior.translucent,
              child: Container(),
            ),
          ),
          Positioned(
            top: offset.dy + renderBox.size.height,
            left: widget.isRtl ? offset.dx + 15.h : offset.dx - 15.h,
            width: renderBox.size.width,
            child: Material(
              child: Container(
                decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                  color: Colors.white,
                  borderRadius: 12,
                ),
                // decoration: BoxDecoration(
                //   borderRadius: BorderRadius.circular(12),
                //   boxShadow: [
                //     BoxShadow(
                //       color: Color(0xFFF8F8FA),
                //       blurRadius: 8.h,
                //       offset: Offset(
                //         0,
                //         2,
                //       ),
                //     ),
                //   ],
                // ),
                child: Column(
                  children: widget.countryList
                      .map(
                        (country) => GestureDetector(
                          onTap: () {
                            setState(() {
                              selectedCountry = country;
                            });
                            widget.onCountryChange?.call(country);
                            _closeDropdown();
                          },
                          child: Container(
                            padding: EdgeInsets.symmetric(vertical: 12.h, horizontal: 16.h),
                            decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                              borderRadius: 16.h,
                            ),
                            child: Row(
                              children: [
                                Utils.buildSvgWithAssets(
                                  icon: country.iconPath,
                                  width: 38.h,
                                  height: 38.h,
                                ),
                                SizedBox(width: 12.h),
                                Text(country.displayName,
                                    style: TextStyle(
                                      fontSize: 14.fSize,
                                      height: 21 / 14,
                                      fontWeight: FontWeight.w500,
                                      letterSpacing: -0.2,
                                    )),
                              ],
                            ),
                          ),
                        ),
                      )
                      .toList(),
                ),
              ),
            ),
          ),
        ],
      ),
    );

    Overlay.of(context)?.insert(_overlayEntry);
    setState(() {
      _isDropdownOpen = true;
    });
  }

  void _closeDropdown() {
    _overlayEntry.remove();
    setState(() {
      _isDropdownOpen = false;
    });
  }
}