import 'package:mc_common_app/classes/app_state.dart';
import 'package:mc_common_app/config/routes.dart';
import 'package:mc_common_app/generated/locale_keys.g.dart';
import 'package:mc_common_app/utils/navigator.dart';
import 'package:mc_common_app/view_models/requests_view_model.dart';
import 'package:flutter/material.dart';
import 'package:mc_common_app/extensions/int_extensions.dart';
import 'package:mc_common_app/extensions/string_extensions.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/utils/enums.dart';
import 'package:mc_common_app/views/requests/widget/request_item.dart';
import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
import 'package:mc_common_app/widgets/common_widgets/categories_list.dart';
import 'package:provider/provider.dart';
import 'package:easy_localization/easy_localization.dart';

class MyRequestsFragment extends StatelessWidget {
  const MyRequestsFragment({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar(
        title: LocaleKeys.myRequests.tr(),
        isRemoveBackButton: true,
      ),
      body: Container(
        color: MyColors.backgroundColor,
        width: double.infinity,
        height: double.infinity,
        child: Consumer(builder: (BuildContext context, RequestsVM requestsVM, Widget? child) {
          return Column(
            children: [
              16.height,
              FiltersList(
                filterList: requestsVM.requestsTypeFilterOptions,
                onFilterTapped: (index, selectedFilterId) {
                  requestsVM.applyFilterOnRequestsVM(requestsTypeEnum: selectedFilterId.toRequestTypeStatusEnum());
                },
              ),
              8.height,
              Expanded(
                  child: RefreshIndicator(
                onRefresh: () async => await requestsVM.getRequests(isNeedToRebuild: true, appType: AppType.provider),
                child: requestsVM.state == ViewState.busy
                    ? const Center(child: CircularProgressIndicator())
                    : requestsVM.myFilteredRequests.isEmpty
                        ? Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              LocaleKeys.noRequeststoShow.tr().toText(fontSize: 16, color: MyColors.lightTextColor),
                            ],
                          )
                        : ListView.separated(
                            itemBuilder: (context, index) {
                              return RequestItem(request: requestsVM.myFilteredRequests[index], appType: AppType.provider, requestIndex: index);
                            },
                            separatorBuilder: (context, index) {
                              return 16.height;
                            },
                            itemCount: requestsVM.myFilteredRequests.length,
                            padding: const EdgeInsets.only(left: 16, right: 16, bottom: 16, top: 8),
                          ),
              ))
            ],
          );
        }),
      ),
      floatingActionButton: AppState().currentAppType == AppType.customer
          ? FloatingActionButton(
              onPressed: () => navigateWithName(context, AppRoutes.createRequestPage),
              backgroundColor: MyColors.darkPrimaryColor,
              child: const Icon(
                Icons.add,
                color: MyColors.white,
              ),
            )
          : null,
    );
  }
}
