import 'package:easy_localization/src/public_ext.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/provider/dashboard_provider_model.dart';
import 'package:mohem_flutter_app/widgets/shimmer/dashboard_shimmer_widget.dart';
import 'package:provider/provider.dart';

class ServicesWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    List<String> namesT = [LocaleKeys.monthlyAttendance.tr(), LocaleKeys.workFromHome.tr(), LocaleKeys.ticketRequest.tr(), LocaleKeys.monthlyAttendance.tr()];
    List<String> iconT = [
      "assets/images/monthly_attendance.svg",
      "assets/images/work_from_home.svg",
      "assets/images/ticket_request.svg",
      "assets/images/work_from_home.svg",
      "assets/images/work_from_home.svg",
      "assets/images/work_from_home.svg",
      "assets/images/work_from_home.svg",
      "assets/images/work_from_home.svg"
    ];

    return Consumer<DashboardProviderModel>(
      builder: (context, data, child) {
        return data.isServicesMenusLoading
            ? whileLoading()
            : ListView.separated(
                itemBuilder: (context, parentIndex) {
                  return Column(
                    children: [
                      Row(
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Expanded(
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              mainAxisSize: MainAxisSize.min,
                              children: [
                                firstWord(data.homeMenus![parentIndex].menuEntry.prompt!).toText12(),
                                lastWord(data.homeMenus![parentIndex].menuEntry.prompt!).toText24(isBold: true),
                              ],
                            ),
                          ),
                          LocaleKeys.viewAllServices.tr().toText12(isUnderLine: true),
                        ],
                      ).paddingOnly(left: 21, right: 21),
                      SizedBox(
                        height: 105 + 26,
                        child: ListView.separated(
                            shrinkWrap: true,
                            physics: const BouncingScrollPhysics(),
                            padding: const EdgeInsets.only(left: 21, right: 21, top: 13, bottom: 13),
                            scrollDirection: Axis.horizontal,
                            itemBuilder: (cxt, index) {
                              return AspectRatio(
                                aspectRatio: 105 / 105,
                                child: data.isServicesMenusLoading
                                    ? ServicesMenuShimmer()
                                    : Container(
                                        decoration: BoxDecoration(
                                          color: Colors.white,
                                          borderRadius: BorderRadius.circular(15),
                                          boxShadow: [
                                            BoxShadow(
                                              color: const Color(0xff000000).withOpacity(.05),
                                              blurRadius: 26,
                                              offset: const Offset(0, -3),
                                            ),
                                          ],
                                        ),
                                        child: Column(
                                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                          crossAxisAlignment: CrossAxisAlignment.start,
                                          children: [
                                            SvgPicture.asset(iconT[index]),
                                            Row(
                                              crossAxisAlignment: CrossAxisAlignment.end,
                                              children: [
                                                Expanded(
                                                  child: data.homeMenus![parentIndex].menuEntiesList[index].prompt!.toText11(isBold: true),
                                                ),
                                                SvgPicture.asset("assets/images/arrow_next.svg").paddingOnly(bottom: 4)
                                              ],
                                            )
                                          ],
                                        ).paddingOnly(left: 10, right: 10, bottom: 10, top: 12),
                                      ),
                              );
                            },
                            separatorBuilder: (cxt, index) => 9.width,
                            itemCount: data.homeMenus![parentIndex].menuEntiesList.length),
                      ),
                    ],
                  );
                },
                separatorBuilder: (context, index) {
                  return 12.height;
                },
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemCount: data.homeMenus!.length);
      },
    );
  }

  String firstWord(String value) {
    return value.split(" ").length > 1 ? value.split(" ")[0] : "";
  }

  String lastWord(String value) {
    var parts = value.split(" ");
    if (parts.length == 1) {
      return value;
    } else {
      int i = value.indexOf(" ");
      return value.substring(i + 1).toCamelCase;
    }
  }

  Widget whileLoading() {
    return Column(
      children: [
        ServicesHeaderShimmer().paddingOnly(left: 21, right: 21),
        SizedBox(
          height: 105 + 26,
          child: ListView.separated(
              shrinkWrap: true,
              physics: const BouncingScrollPhysics(),
              padding: const EdgeInsets.only(left: 21, right: 21, top: 13, bottom: 13),
              scrollDirection: Axis.horizontal,
              itemBuilder: (cxt, index) {
                return AspectRatio(
                  aspectRatio: 105 / 105,
                  child: ServicesMenuShimmer(),
                );
              },
              separatorBuilder: (cxt, index) => 9.width,
              itemCount: 4),
        ),
      ],
    );
  }
}