import 'package:flutter/material.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/core/presentation/widgets/ui_kit/kw_popup_menu.dart';

class KwDropdown<R> extends StatefulWidget {
  final String? title;
  final String hintText;
  final KwDropDownItem<R>? selectedItem;
  final Iterable<KwDropDownItem<R>> items;
  final Function(R item) onSelected;
  final double horizontalPadding;
  final Color? backgroundColor;
  final Color? borderColor;

  const KwDropdown(
      {super.key,
      required this.hintText,
      this.horizontalPadding = 0,
      required this.items,
      required this.onSelected,
      this.backgroundColor,
      this.borderColor,
      this.title,
      this.selectedItem});

  @override
  State<KwDropdown<R>> createState() => _KwDropdownState<R>();
}

class _KwDropdownState<R> extends State<KwDropdown<R>> {
  KwDropDownItem<R>? _selectedItem;

  @override
  didUpdateWidget(KwDropdown<R> oldWidget) {
    if (oldWidget.selectedItem != widget.selectedItem) {
      _selectedItem = widget.selectedItem;
    }
    super.didUpdateWidget(oldWidget);
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    _selectedItem ??= widget.selectedItem;
  }

  @override
  void initState() {
    _selectedItem = widget.selectedItem;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        if (widget.title != null)
          Padding(
            padding: const EdgeInsets.only(left: 16,bottom: 4),
            child: Text(
              widget.title!,
              style: AppTextStyles.bodyTinyReg.copyWith(
                color: AppColors.blackGray,
              ),
            ),
          ),
        IgnorePointer(
          ignoring: widget.items.isEmpty,
          child: KwPopupMenu(
              horizontalPadding: widget.horizontalPadding,
              fit: KwPopupMenuFit.expand,
              customButtonBuilder: (context, isOpened) {
                return _buildMenuButton(isOpened);
              },
              menuItems: widget.items
                  .map((item) => KwPopupMenuItem(
                      title: item.title,
                      icon: item.icon,
                      onTap: () {
                        setState(() {
                          _selectedItem = item;
                        });
                        widget.onSelected(item.data);
                      }))
                  .toList()),
        ),
      ],
    );
  }

  Container _buildMenuButton(bool isOpened) {
    return Container(
      height: 48,
      padding: const EdgeInsets.symmetric(horizontal: 16),
      decoration: BoxDecoration(
        color: widget.backgroundColor,
        borderRadius: BorderRadius.circular(24),
        border: Border.all(
            color: isOpened
                ? AppColors.bgColorDark
                : widget.borderColor ?? AppColors.grayStroke,
            width: 1),
      ),
      child: Row(
        children: [
          Expanded(
              child: Text(
            _selectedItem?.title ?? widget.hintText,
            style: AppTextStyles.bodyMediumReg.copyWith(
                color: _selectedItem == null
                    ? AppColors.blackGray
                    : AppColors.blackBlack),
          )),
          AnimatedRotation(
            duration: const Duration(milliseconds: 150),
            turns: isOpened ? -0.5 : 0,
            child: Assets.images.icons.caretDown.svg(
              width: 16,
              height: 16,
              colorFilter: const ColorFilter.mode(
                  AppColors.blackGray, BlendMode.srcIn),
            ),
          )
        ],
      ),
    );
  }
}

class KwDropDownItem<R> {
  final String title;
  final R data;
  final Widget? icon;

  const KwDropDownItem({required this.data, required this.title, this.icon});
}
