import 'package:dropdown_button2/dropdown_button2.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.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/utils/color_manager.dart'; class CommunityDropdown extends StatelessWidget { final String? selectedValue; final Function(String?) onChanged; final TextEditingController _searchController = TextEditingController(); CommunityDropdown({ Key? key, required this.selectedValue, required this.onChanged, }) : super(key: key); @override Widget build(BuildContext context) { return Padding( padding: const EdgeInsets.all(10.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "Community", style: Theme.of(context).textTheme.bodyMedium!.copyWith( fontWeight: FontWeight.w400, fontSize: 13, color: ColorsManager.blackColor, ), ), const SizedBox(height: 8), BlocBuilder( builder: (context, state) { return SizedBox( child: Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), ), child: DropdownButton2( underline: SizedBox(), value: selectedValue, items: state.communityList.map((community) { return DropdownMenuItem( value: community.uuid, child: Text( ' ${community.name}', overflow: TextOverflow.ellipsis, maxLines: 1, ), ); }).toList(), onChanged: onChanged, style: TextStyle(color: Colors.black), hint: Padding( padding: EdgeInsets.only(left: 10), child: Text( " Please Select", style: Theme.of(context).textTheme.bodySmall!.copyWith( color: ColorsManager.textGray, ), ), ), customButton: Container( height: 45, decoration: BoxDecoration( border: Border.all(color: ColorsManager.textGray, width: 1.0), borderRadius: BorderRadius.circular(10), ), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( flex: 5, child: Text( selectedValue != null ? " ${state.communityList.firstWhere((element) => element.uuid == selectedValue).name}" : ' Please Select', style: Theme.of(context).textTheme.bodySmall!.copyWith( color: selectedValue != null ? Colors.black : ColorsManager.textGray, ), overflow: TextOverflow.ellipsis, ), ), Expanded( child: Container( decoration: BoxDecoration( color: Colors.grey[100], borderRadius: const BorderRadius.only( topRight: Radius.circular(10), bottomRight: Radius.circular(10), ), ), height: 45, child: const Icon( Icons.keyboard_arrow_down, color: ColorsManager.textGray, ), ), ), ], ), ), dropdownStyleData: DropdownStyleData( maxHeight: MediaQuery.of(context).size.height * 0.4, decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), ), ), dropdownSearchData: DropdownSearchData( searchController: _searchController, searchInnerWidgetHeight: 50, searchInnerWidget: Container( height: 50, padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4), child: TextFormField( style: const TextStyle(color: Colors.black), controller: _searchController, decoration: InputDecoration( isDense: true, contentPadding: const EdgeInsets.symmetric( horizontal: 10, vertical: 12, ), hintText: 'Search for community...', border: OutlineInputBorder( borderRadius: BorderRadius.circular(8), ), ), ), ), searchMatchFn: (item, searchValue) { final communityName = (item.child as Text).data?.toLowerCase() ?? ''; return communityName.contains(searchValue.toLowerCase().trim()); }, ), onMenuStateChange: (isOpen) { if (!isOpen) { _searchController.clear(); } }, menuItemStyleData: const MenuItemStyleData( height: 40, ), ), )); }, ), ], ), ); } }