import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/routines/create_new_routines/dropdown_menu_content.dart';
import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
import 'package:syncrow_web/pages/space_tree/bloc/space_tree_state.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'space_tree_dropdown_bloc.dart';

class SpaceTreeDropdown extends StatefulWidget {
  final String? selectedSpaceId;
  final Function(String?)? onChanged;

  const SpaceTreeDropdown({
    super.key,
    this.selectedSpaceId,
    this.onChanged,
  });

  @override
  State<SpaceTreeDropdown> createState() => _SpaceTreeDropdownState();
}

class _SpaceTreeDropdownState extends State<SpaceTreeDropdown> {
  late SpaceTreeDropdownBloc _dropdownBloc;
  final LayerLink _layerLink = LayerLink();
  OverlayEntry? _overlayEntry;

  @override
  void initState() {
    super.initState();
    _dropdownBloc = SpaceTreeDropdownBloc(widget.selectedSpaceId);
  }

  @override
  void dispose() {
    _dropdownBloc.close();
    _removeOverlay();
    super.dispose();
  }

  void _removeOverlay() {
    _overlayEntry?.remove();
    _overlayEntry = null;
  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider.value(
      value: _dropdownBloc,
      child: BlocBuilder<SpaceTreeBloc, SpaceTreeState>(
        builder: (context, spaceTreeState) {
          final communities = spaceTreeState.searchQuery.isNotEmpty
              ? spaceTreeState.filteredCommunity
              : spaceTreeState.communityList;

          return BlocBuilder<SpaceTreeDropdownBloc, SpaceTreeDropdownState>(
            builder: (context, dropdownState) {
              final selectedCommunity = _findCommunity(
                communities,
                dropdownState.selectedSpaceId,
              );

              return Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 10),
                    child: Text(
                      "Community",
                      style: Theme.of(context).textTheme.bodyMedium!.copyWith(
                            fontWeight: FontWeight.w400,
                            fontSize: 13,
                            color: ColorsManager.blackColor,
                          ),
                    ),
                  ),
                  CompositedTransformTarget(
                    link: _layerLink,
                    child: GestureDetector(
                      onTap: () => _toggleDropdown(context, communities),
                      child: Container(
                        height: 46,
                        decoration: BoxDecoration(
                          border: Border.all(color: Colors.grey.shade300),
                          borderRadius: BorderRadius.circular(12),
                        ),
                        margin: const EdgeInsets.symmetric(horizontal: 10),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Padding(
                              padding:
                                  const EdgeInsets.symmetric(horizontal: 10),
                              child: Text(
                                selectedCommunity?.name ?? 'Please Select',
                                style: TextStyle(
                                  color: selectedCommunity != null
                                      ? ColorsManager.blackColor
                                      : ColorsManager.textGray,
                                  overflow: TextOverflow.ellipsis,
                                  fontWeight: FontWeight.w400,
                                  fontSize: 13,
                                ),
                              ),
                            ),
                            Container(
                              decoration: BoxDecoration(
                                color: Colors.grey[200],
                                borderRadius: const BorderRadius.only(
                                  topRight: Radius.circular(10),
                                  bottomRight: Radius.circular(10),
                                ),
                              ),
                              height: 45,
                              width: 33,
                              child: const Icon(
                                Icons.keyboard_arrow_down,
                                color: ColorsManager.textGray,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ],
              );
            },
          );
        },
      ),
    );
  }

  void _toggleDropdown(BuildContext context, List<CommunityModel> communities) {
    if (_overlayEntry != null) {
      _removeOverlay();
      return;
    }

    _overlayEntry = OverlayEntry(
      builder: (context) => Positioned(
        width: 300,
        child: CompositedTransformFollower(
          link: _layerLink,
          showWhenUnlinked: false,
          offset: const Offset(0, 48),
          child: Material(
            elevation: 8,
            borderRadius: BorderRadius.circular(12),
            child: DropdownMenuContent(
              selectedSpaceId: _dropdownBloc.state.selectedSpaceId,
              onChanged: (id) {
                if (id != null && mounted) {
                  _dropdownBloc.add(SpaceTreeDropdownSelectEvent(id));
                  widget.onChanged?.call(id);
                  _removeOverlay();
                }
              },
              onClose: _removeOverlay,
            ),
          ),
        ),
      ),
    );

    Overlay.of(context).insert(_overlayEntry!);
  }

  CommunityModel? _findCommunity(
      List<CommunityModel> communities, String? communityId) {
    if (communityId == null) return null;
    try {
      return communities.firstWhere((c) => c.uuid == communityId);
    } catch (e) {
      return null;
    }
  }
}