import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/dashboard_latest/dashboard_provider.dart';
import 'package:test_sa/dashboard_latest/widgets/request_category_list.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/models/new_models/dashboard_detail.dart';
import 'package:test_sa/new_views/common_widgets/tab_button.dart';
import 'package:test_sa/views/widgets/loaders/no_data_found.dart';

class RequestCategoryFragment extends StatelessWidget {
  const RequestCategoryFragment({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Consumer<DashBoardProvider>(builder: (context, dashboardProvider, child) {
      return Column(mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
        context.translation.allRequests.heading4(context).paddingOnly(start: 16, end: 16),
        getTabs(
          requestsProvider: dashboardProvider,
          context: context,
          userType: Provider.of<UserProvider>(context, listen: false).user!.type!,
        ),
        dashboardProvider.isDetailLoading || dashboardProvider.requestDetailList == null
            ? Column(
                mainAxisSize: MainAxisSize.max,
                children: List.generate(3, (index) {
                  return Padding(
                    padding: EdgeInsets.symmetric(vertical: 10.toScreenHeight, horizontal: 0),
                    child: const SizedBox().toRequestShimmer(context, dashboardProvider.isDetailLoading),
                  );
                })).paddingOnly(start: 16, end: 16, top: 16)
            : (dashboardProvider.requestDetailList?.data?.isEmpty ?? true)
                ? const NoDataFound().paddingOnly(top: 50).center
                : RequestCategoryList(dashboardProvider.requestDetailList?.data ?? <Data>[], dashboardProvider.isDetailLoading, dashboardProvider.requestDetailList?.totalRows ?? 0),
      ]);
    });
  }

  Widget getTabs({required BuildContext context, required DashBoardProvider requestsProvider, required UsersTypes userType}) {
    List<CategoryTabs> tabs = CategoryTabs.getTabs(userType: userType, context: context);
    return SizedBox(
      height: 44 + 16,
      child: ListView.separated(
          scrollDirection: Axis.horizontal,
          separatorBuilder: (cxt, index) => 12.width,
          padding: const EdgeInsets.only(top: 6 + 16, left: 16, right: 16),
          itemBuilder: (cxt, index) {
            return TabButton(
              label: tabs[index].label,
              loading: requestsProvider.isDetailLoading,
              isSelected: requestsProvider.currentListIndex == index,
              count: requestsProvider.requestDetailList != null ? requestsProvider.requestDetailList!.totalRows ?? 0 : 0,
              onPressed: () async {
                requestsProvider.currentListIndex = index;
                requestsProvider.resetRequestDataList();
                requestsProvider.getRequestDetail(usersType: userType, showLoader: true, status: tabs[index].tag);
              },
            );
          },
          itemCount: tabs.length),
    );
  }
}
