import 'dart:async';

import 'package:flutter/material.dart';

import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:taafee_mobile/common/extensions/widget_extension.dart';
import 'package:taafee_mobile/common/widgets/rx_viewer.dart';
import 'package:taafee_mobile/core/routing/routing_manager.dart';
import 'package:taafee_mobile/features/category/business_logic_layer/category_controller.dart';
import 'package:taafee_mobile/features/home/business_logic_layer/home_controller.dart';

import '../../features/home/presentation_layer/widgets/search_bar.dart';
import '../../features/home/presentation_layer/widgets/search_category.dart';
import '../../features/home/presentation_layer/widgets/search_location.dart';
import '../const/const.dart';
import 'listview.dart';
import 'text.dart';

// ignore: must_be_immutable
class SearchAreaWidget extends StatelessWidget {
  SearchAreaWidget({super.key, this.textEditingController});

  final CategoryController categoryController = Get.find<CategoryController>();
  Timer? debouncer;
  final HomeController homeController = Get.find<HomeController>();
  TextEditingController? textEditingController;

  void dialog(BuildContext context) {
    showDialog(
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
            contentPadding: EdgeInsets.zero,
            actionsPadding: EdgeInsets.zero,
            title: RegularTextWidget(
              "choose_city_please".tr,
              fontSize: 14,
            ),
            content: Container(
              decoration: BoxDecoration(borderRadius: BorderRadius.circular(8)),
              width: Get.width * .89,
              height: Get.height * .58,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    SearchBarWidget(
                      onChanged: (value) {
                        if (debouncer?.isActive ?? false) {
                          debouncer!.cancel();
                        }
                        debouncer = Timer(const Duration(seconds: 1), () {
                          homeController.getCities(value: value);
                        });
                      },
                      onSearch: () {},
                      hint: "search_city_or_country_name".tr,
                    ).paddingSymmetric(horizontal: 17, vertical: 20),
                    RxViewer(
                      width: 300,
                      height: 300,
                      color: AppColors.primeColor,
                      rxFuture: homeController.cityState,
                      child: () => ListViewWidget(
                          itemCount: homeController.cityState.result.length,
                          childBuilder: (index) {
                            return SearchLocationWidget(
                                    homeController.cityState.result[index])
                                .onTap(() {
                              homeController.searchModel.value.cityId =
                                  homeController.cityState.result[index].id;
                              RoutingManager.back();

                              homeController.setCityName(
                                  homeController.cityState.result[index].name);
                              homeController.search();
                              RoutingManager.back();
                            });
                          }),
                    )
                  ],
                ),
              ),
            ),
          );
        });
  }

  void categoryDialog(BuildContext context) {
    showDialog(
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            contentPadding: EdgeInsets.zero,
            actionsPadding: EdgeInsets.zero,
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
            title: RegularTextWidget(
              "choose_category_please".tr,
              fontSize: 14,
            ),
            content: Container(
              decoration: BoxDecoration(borderRadius: BorderRadius.circular(8)),
              width: Get.width * .89,
              height: Get.height * .58,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    SearchBarWidget(
                      onChanged: (value) {
                        if (debouncer?.isActive ?? false) {
                          debouncer!.cancel();
                        }
                        debouncer = Timer(const Duration(seconds: 1), () {
                          categoryController.searchCategories(value: value);
                        });
                      },
                      onSearch: () {},
                      hint: 'search_category_name'.tr,
                    ).paddingSymmetric(horizontal: 17, vertical: 20),
                    RxViewer(
                      width: 300,
                      height: 300,
                      color: AppColors.primeColor,
                      rxFuture: categoryController.searchCategoriesState,
                      child: () => ListViewWidget(
                          itemCount: categoryController
                              .searchCategoriesState.result.length,
                          childBuilder: (index) {
                            return SearchCategoryWidget(
                              categoryModel: categoryController
                                  .searchCategoriesState.result[index],
                            ).onTap(() {
                              homeController.searchModel.value.categoryId =
                                  categoryController
                                      .searchCategoriesState.result[index].id;
                              homeController.setCategoryName(categoryController
                                  .searchCategoriesState.result[index].name);
                              homeController.searchState.result.clear();
                              homeController.search();
                              RoutingManager.back();
                            });
                          }),
                    )
                  ],
                ),
              ),
            ),
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.only(top: 5),
      width: Get.width * .89,
      height: Responsive.isTablet() ? 70 : 108,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
      ),
      child: (Responsive.isTablet())
          ? Row(
              children: [
                SearchBarWidget(
                        controller: textEditingController,
                        onChanged: (value) async {
                          if (debouncer?.isActive ?? false) debouncer!.cancel();
                          debouncer =
                              Timer(const Duration(milliseconds: 1000), () {
                            if (value == '') {
                              homeController.searchModel.value.searchWords =
                                  value;
                              homeController.searchState.result.clear();
                              homeController.changeUserSearchingState(false);
                            } else {
                              homeController.searchState.result.clear();

                              homeController.changeUserSearchingState(true);

                              homeController.searchModel.value.searchWords =
                                  value;
                              homeController.search();
                            }
                          });
                        },
                        onSearch: () {
                          homeController.searchState.result.clear();
                          homeController.changeUserSearchingState(true);
                          homeController.search();
                        })
                    .paddingSymmetric(horizontal: 10)
                    .paddingOnly(
                      bottom: Responsive.isTablet() ? 8 : 0,
                    )
                    .expanded(4),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      child: Row(
                        children: [
                          Obx(
                            () => RegularTextWidget(
                              homeController.searchModel.value.cityName ??
                                  "city".tr,
                              color: Colors.black,
                              fontSize: 14,
                            ).paddingSymmetric(horizontal: 5),
                          ),
                          SvgPicture.asset("assets/icons/arrow.svg")
                        ],
                      ).onTap(() async {
                        dialog(context);
                        await homeController.getCities();
                      }),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Obx(
                            () => RegularTextWidget(
                              homeController.searchModel.value.categoryName ??
                                  "categories".tr,
                              fontSize: 14,
                              color: Colors.black,
                            ).paddingSymmetric(horizontal: 5),
                          ),
                          SvgPicture.asset("assets/icons/arrow.svg")
                        ],
                      ).onTap(() async {
                        categoryDialog(context);
                        await categoryController.searchCategories();
                      }),
                    ),
                    Obx(() {
                      return Visibility(
                        visible: (homeController.searchModel.value.categoryId !=
                                null) ||
                            (homeController.searchModel.value.cityId != null) ||
                            (homeController.searchModel.value.searchWords !=
                                null),
                        child: SvgPicture.asset('assets/icons/x.svg').onTap(() {
                          homeController.clearSearchFilters();
                          textEditingController!.clear();

                          homeController.searchState.result.clear();
                          homeController.search();
                        }),
                      );
                    }),
                    Container(
                      alignment: Alignment.center,
                      width: 79,
                      height: 38,
                      decoration: BoxDecoration(
                          color: AppColors.secondaryColor,
                          borderRadius: BorderRadius.circular(30)),
                      child: RegularTextWidget(
                        "search".tr,
                        fontSize: 14,
                        color: Colors.white,
                      ),
                    ).onTap(() {
                      homeController.searchState.result.clear();
                      homeController.changeUserSearchingState(true);
                      homeController.search();
                    }),
                  ],
                )
                    .paddingSymmetric(
                        horizontal: Responsive.isTablet() ? 16 : 4, vertical: 8)
                    .expanded(4)
              ],
            )
          : Column(
              children: [
                SearchBarWidget(
                    controller: textEditingController,
                    onChanged: (value) async {
                      if (debouncer?.isActive ?? false) debouncer!.cancel();
                      debouncer = Timer(const Duration(milliseconds: 1000), () {
                        if (value == '') {
                          homeController.searchModel.value.searchWords = value;
                          homeController.searchState.result.clear();
                          homeController.changeUserSearchingState(false);
                        } else {
                          homeController.searchState.result.clear();

                          homeController.changeUserSearchingState(true);

                          homeController.searchModel.value.searchWords = value;
                          homeController.search();
                        }
                      });
                    },
                    onSearch: () {
                      homeController.searchState.result.clear();
                      homeController.changeUserSearchingState(true);
                      homeController.search();
                    }).paddingSymmetric(horizontal: 10),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      child: Row(
                        children: [
                          Obx(
                            () => RegularTextWidget(
                              homeController.searchModel.value.cityName ??
                                  "city".tr,
                              fontSize: 14,
                              color: Colors.black,
                            ).paddingSymmetric(horizontal: 5),
                          ),
                          SvgPicture.asset("assets/icons/arrow.svg")
                        ],
                      ).onTap(() async {
                        dialog(context);
                        await homeController.getCities();
                      }),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Obx(
                            () => RegularTextWidget(
                              homeController.searchModel.value.categoryName ??
                                  "categories".tr,
                              color: Colors.black,
                              fontSize: 14,
                            ).paddingSymmetric(horizontal: 5),
                          ),
                          SvgPicture.asset("assets/icons/arrow.svg")
                        ],
                      ).onTap(() async {
                        categoryDialog(context);
                        await categoryController.searchCategories();
                      }),
                    ),
                    Obx(() {
                      return Visibility(
                        visible: (homeController.searchModel.value.categoryId !=
                                null) ||
                            (homeController.searchModel.value.cityId != null) ||
                            (homeController.searchModel.value.searchWords !=
                                null),
                        child: SvgPicture.asset('assets/icons/x.svg').onTap(() {
                          homeController.clearSearchFilters();
                          textEditingController!.clear();

                          homeController.searchState.result.clear();
                          homeController.search();
                        }),
                      );
                    }),
                    Container(
                      alignment: Alignment.center,
                      width: 79,
                      height: 38,
                      decoration: BoxDecoration(
                          color: AppColors.secondaryColor,
                          borderRadius: BorderRadius.circular(30)),
                      child: RegularTextWidget(
                        "search".tr,
                        fontSize: 14,
                        color: Colors.white,
                      ),
                    ).onTap(() {
                      homeController.searchState.result.clear();
                      homeController.changeUserSearchingState(true);
                      homeController.search();
                    }),
                  ],
                ).paddingSymmetric(horizontal: 10, vertical: 7)
              ],
            ),
    );
  }
}