Untitled

mail@pastecode.io avatar
unknown
plain_text
2 years ago
61 kB
1
Indexable
Never
// ignore_for_file: prefer_const_constructors, prefer_const_literals_to_create_immutables

import 'package:druto_shopping/apps/all_brands/screens/all_brand_view.dart';
import 'package:druto_shopping/apps/all_products_page/screens/search_products_screen.dart';
import 'package:druto_shopping/apps/homepage/models/brand_model.dart';
import 'package:druto_shopping/apps/homepage/models/models.dart';
import 'package:druto_shopping/apps/homepage/models/products_model.dart'
    as products;

import 'package:get_storage/get_storage.dart';
import 'package:druto_shopping/apps/homepage/repository/homepage_repo.dart';
import 'package:druto_shopping/apps/productDetailPage/product_detail_page_view.dart';
import 'package:druto_shopping/apps/widgets/custom_text_widget.dart';
import 'package:druto_shopping/general/constants/constants.dart';
import 'package:druto_shopping/general/utils/colors.dart';
import 'package:druto_shopping/general/utils/config.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:get/get.dart';
import '../../../general/constants/urls.dart';
import '../../../general/utils/dimensions.dart';
import '../../all_products_page/screens/all_products_view_page.dart';
import '../../cartPage/repository/cart_repository.dart';
import '../../create_details_page/categories_screens/categories_details_page.dart';
import '../../create_details_page/categories_screens/sub_categories_details_page.dart';
import '../../drawerScreen/screens/drawer_screen.dart';
import '../../widgets/shimmer_effect_widget.dart';
import '../widgets/carousel_slider_widget.dart';
import '../widgets/headingwidget.dart';
import '../widgets/products_view_widget.dart';
import 'package:flutter_typeahead/flutter_typeahead.dart';

class HomePage extends ConsumerWidget {
  //int pageIndex = 0;

  HomePage({Key? key}) : super(key: key);

  final TextEditingController _searchController = TextEditingController();

  products.AllProductsModel? allProducts;
  List<products.Datum>? searchList;

  products.AllProductsModel? popularProducts;
  products.AllProductsModel? trendyProducts;
  BrandModel? brandModel;
  BuildContext? dialogContext;

  List<products.AllProductsModel>? product;

  List<CategoriesModel>? categoryItem;

  products.AllProductsModel? exclusiveProducts;

  final List locale = [
    {'name': 'English', 'locale': Locale('en', 'US')},
    {'name': 'عربي', 'locale': Locale('ar', 'AR')},
    {'name': 'हिन्दी', 'locale': Locale('hi', 'IN')},
    {'name': 'বাংলা', 'locale': Locale('bn', 'BD')},
  ];

  updateLanguage(Locale locale) {
    Get.back();
    Get.updateLocale(locale);
  }

  final storage = GetStorage();

  builddialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (builder) {
        return AlertDialog(
          title: Text('Chooose a language'),
          content: SizedBox(
            width: double.maxFinite,
            child: ListView.separated(
              shrinkWrap: true,
              itemBuilder: (context, index) {
                return InkWell(
                  onTap: () {
                    updateLanguage(locale[index]['locale']);
                  },
                  child: Text(locale[index]['name']),
                );
              },
              separatorBuilder: (context, index) {
                return Divider(
                  color: Colors.blue,
                );
              },
              itemCount: locale.length,
            ),
          ),
        );
      },
    );
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    Config().init(context);

    final category1 = ref.watch(categoryItems);

    final getBrand = ref.watch(getBrands);

    final getProducts = ref.watch(getallProductss);

    final getTrendy = ref.watch(getTrendyProducts);

    final getExclusive = ref.watch(getExclusiveProducts);
    final getPopular = ref.watch(getPopularProductsItem);
    final carouselSlider = ref.watch(carousel);

    return GestureDetector(
      onTap: () {
        FocusManager.instance.primaryFocus?.unfocus();
      },
      child: Scaffold(
        resizeToAvoidBottomInset: false,
        extendBody: true,
        drawer: DrawerScreen(),
        appBar: AppBar(
          bottom: PreferredSize(
              preferredSize: Size.fromHeight(kToolbarHeight),
              child: Column(children: [
                Stack(
                  children: [
                    Container(
                      width: Config.screenWidth,

                      //color: Colors.blue,

                      color: Theme.of(context).scaffoldBackgroundColor,

                      height: Config.screenHeight! * 0.09,
                    ),
                    Container(
                      width: Config.screenWidth,
                      color: Theme.of(context).colorScheme.primary,
                      height: Config.screenHeight! * 0.032,
                    ),
                    Positioned(
                      left: Dimensions.paddingSizeLarge,
                      right: Dimensions.paddingSizeLarge,
                      child: Container(
                        decoration: BoxDecoration(
                          color: ColorResources.COLOR_WHITE,
                          borderRadius: BorderRadius.circular(10),
                          boxShadow: [
                            BoxShadow(
                              blurRadius: 15,
                              color: Colors.grey.shade400,
                              spreadRadius: 1,
                              offset: Offset(2, 2),
                            ),
                          ],
                        ),
                        child: TypeAheadFormField(
                          getImmediateSuggestions: true,
                          suggestionsCallback: (pattern) =>
                              allProducts!.data!.where(
                            (element) {
                              if (element.productName!
                                  .toLowerCase()
                                  .contains(pattern.toLowerCase())) {
                                return element.productName!
                                    .toLowerCase()
                                    .contains(pattern.toLowerCase());
                              } else if (element.discription!
                                  .toLowerCase()
                                  .contains(pattern.toLowerCase())) {
                                return element.discription!
                                    .toLowerCase()
                                    .contains(pattern.toLowerCase());
                              } else {
                                return element.productToCategory!.title!
                                    .toLowerCase()
                                    .contains(pattern.toLowerCase());
                              }
                            },
                          ),
                          itemBuilder: (context, products.Datum itemData) {
                            return GestureDetector(
                              onTap: () async {
                                searchList = allProducts!.data!
                                    .where((element) =>
                                        element.productName ==
                                        itemData.productName)
                                    .toList();
                                Get.off(SearchProductsViewPage(
                                    title: 'Searched Products',
                                    products: searchList!));
                              },
                              child: ListTile(
                                title: Text(itemData.productName.toString()),
                              ),
                            );
                          },
                          onSuggestionSelected: (products.Datum suggestion) {
                            _searchController.text =
                                suggestion.productName.toString();
                          },
                          hideSuggestionsOnKeyboardHide: true,
                          hideOnEmpty: false,
                          noItemsFoundBuilder: (context) =>
                              Text('No Item Found'),
                          textFieldConfiguration: TextFieldConfiguration(
                            keyboardType: TextInputType.text,
                            textInputAction: TextInputAction.search,
                            onSubmitted: (value) async {
                              print(value);
                              searchList = allProducts!.data!
                                  .where((element) => element.productName!
                                      .toLowerCase()
                                      .contains(value.toLowerCase()))
                                  .toList();

                              // searchList =
                              //     await allProducts!.data!.where((element) {
                              //   if (element.productName!
                              //       .toLowerCase()
                              //       .contains(value.toLowerCase())) {
                              //     return element.productName!
                              //         .toLowerCase()
                              //         .contains(
                              //           value.toLowerCase(),
                              //         );
                              //   } else if (element.discription!
                              //       .toLowerCase()
                              //       .contains(value.toLowerCase())) {
                              //     return element.discription!
                              //         .toLowerCase()
                              //         .contains(
                              //           value.toLowerCase(),
                              //         );
                              //   } else {
                              //     return element.productToCategory!.brandTitle!
                              //         .toLowerCase()
                              //         .contains(
                              //           value.toLowerCase(),
                              //         );
                              //   }
                              // }).toList();
                              await Get.off(() => SearchProductsViewPage(
                                  title: 'Searched Products',
                                  products: searchList!));
                            },
                            cursorColor:
                                Theme.of(context).colorScheme.onPrimary,
                            controller: _searchController,
                            style: TextStyle(
                                color: Theme.of(context).colorScheme.onPrimary),
                            decoration: InputDecoration(
                              border: InputBorder.none,
                              enabledBorder: InputBorder.none,
                              focusedBorder: InputBorder.none,
                              hintStyle: TextStyle(
                                  color: Theme.of(context).colorScheme.primary),
                              prefixIcon: Icon(Icons.search),
                              prefixIconColor:
                                  Theme.of(context).colorScheme.primary,
                              contentPadding: EdgeInsets.only(top: 16),
                              hintText: 'Search Here...',
                            ),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ])),
          elevation: 0,
          centerTitle: true,
          backgroundColor: Theme.of(context).colorScheme.primary,
          actions: [
            // Image(
            //   image: AssetImage('assets/images/appbar_action_icon.png'),
            // ),
            Padding(
              padding: EdgeInsets.only(right: 15, left: 15),
              child: InkWell(
                onTap: () {
                  builddialog(context);
                },
                child: Icon(
                  Icons.language,
                  color: Theme.of(context).colorScheme.onPrimary,
                  size: 28,
                ),
              ),
            )
          ],
          title: InkWell(
            onTap: () {},
            child: Image(
              height: 30.8,
              image: AssetImage(
                'assets/images/homepage_main_icon.png',
              ),
              //color: ColorResources.PRIMARY_COLOR,
              color: storage.read('darkMode')
                  ? ColorResources.PRIMARY_COLOR
                  : Colors.black,
            ),
          ),
          leading: Builder(builder: (context) {
            return InkWell(
              onTap: () {
                Scaffold.of(context).openDrawer();

                print("object");
              },
              child: Image(
                image: AssetImage(
                  'assets/images/homepage_appbarleading_icon.png',
                ),
                color: Theme.of(context).colorScheme.onPrimary,
              ),
            );
          }),
        ),
        body: SafeArea(
          child: ListView(
            physics: BouncingScrollPhysics(),
            children: [
              CarouselSliderBuilderWidget(),
              spaceVertical(percentange: 0.04),
              DivHeadingWidget(
                title: 'categories'.tr,
                Ontap: () {
                  Navigator.of(context).push(MaterialPageRoute(
                    builder: (context) => CategoriesDetailsPage(),
                  ));
                },
              ),

              spaceVertical(percentange: 0.020),
              SizedBox(
                height: Config.screenHeight! * 0.23,
                child: category1.when(
                  data: (data) {
                    return ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemCount: data.data!.length,
                      itemBuilder: (BuildContext context, int index) {
                        return GestureDetector(
                          onTap: () {
                            Get.to(() => SubCategoriesDetailsPage(
                                indexs: index,
                                title: data.data![index].title!));
                          },
                          child: Column(
                            children: [
                              Expanded(
                                flex: 2,
                                child: Container(
                                  alignment: Alignment.center,

                                  margin: EdgeInsets.all(
                                    Config.screenWidth! * 0.02,
                                  ),

                                  width: Config.screenWidth! *
                                      0.22, //Config.screenWidth! * 0.1,

                                  decoration: BoxDecoration(
                                    color: ColorResources.COLOR_WHITE,
                                    shape: BoxShape.circle,
                                    boxShadow: [
                                      BoxShadow(
                                        color: ColorResources.COLOR_BLACK
                                            .withOpacity(0.4),
                                        offset: Offset(0, 2),
                                        spreadRadius: 0.4,
                                        blurRadius: 0.4,
                                      )
                                    ],
                                  ),

                                  child: Container(
                                    alignment: Alignment.center,
                                    decoration: BoxDecoration(
                                      shape: BoxShape.circle,
                                      image: DecorationImage(
                                        image: NetworkImage(
                                          Urls.baseUrlForImage +
                                              data.data![index].photo
                                                  .toString(),
                                        ),
                                        fit: BoxFit.fill,
                                      ),
                                    ),
                                  ),
                                ),
                              ),
                              spaceVertical(
                                percentange: 0.01,
                              ),
                              Expanded(
                                flex: 1,
                                child: SizedBox(
                                  width: 100,
                                  height: 150,
                                  child: CustomTextWidget(
                                    title: data.data![index].title!,
                                    textstyle: Theme.of(context)
                                        .textTheme
                                        .headline1!
                                        .copyWith(
                                          fontSize: Config.screenWidth! * 0.05,
                                          fontWeight: FontWeight.w400,
                                        ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        );
                      },
                    );
                  },
                  error: (error, s) => Text(error.toString()),
                  loading: () => ListView.builder(
                    scrollDirection: Axis.horizontal,
                    shrinkWrap: true,
                    itemCount: 4,
                    itemBuilder: (context, index) {
                      return ShimmerEffectWidget(
                        child: Container(
                          margin: EdgeInsets.all(
                            Config.screenWidth! * 0.02,
                          ),
                          width: Config.screenWidth! * 0.22,
                          height: Config.screenWidth! * 0.22,
                          alignment: Alignment.topCenter,
                          decoration: BoxDecoration(
                            shape: BoxShape.circle,
                            boxShadow: [
                              BoxShadow(
                                  color: ColorResources.COLOR_BLACK
                                      .withOpacity(0.4),
                                  offset: Offset(0, 2),
                                  spreadRadius: 0.4,
                                  blurRadius: 0.4)
                            ],
                          ),
                          child: Container(
                            alignment: Alignment.center,
                            height: Config.screenHeight! * 0.23,
                            width: Config.screenWidth! * 0.23,
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              // image: DecorationImage(
                              //   fit: BoxFit.cover,
                              //   image: NetworkImage(
                              //     Urls.baseUrlForImage +
                              //         data.data![index].photo.toString(),
                              //   ),
                              // ),
                            ),
                          ),
                        ),
                      );
                    },
                  ),
                ),
              ),
              DivHeadingWidget(
                title: 'Choose Brands',
                Ontap: () {
                  Get.to(() => AllBrandView(brand: brandModel!));
                },
              ),

              spaceVertical(percentange: 0.02),

              SizedBox(
                height: Config.screenHeight! * 0.14,
                child: getBrand.when(
                  data: (data) {
                    brandModel = data;
                    return ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemCount: data.data!.length,
                      itemBuilder: (BuildContext context, int index) {
                        return GestureDetector(
                          onTap: () {
                            dialogContext = context;
                            showDialog(
                              context: dialogContext!,
                              builder: (context) => AlertDialog(
                                content: SizedBox(
                                  height: 10,
                                  width: 10,
                                  child: CircularProgressIndicator(
                                    strokeWidth: 2,
                                  ),
                                ),
                              ),
                            );
                            HomePageRepository().getBrandProduct(
                                context1: dialogContext,
                                id: data.data![index].id!.toString(),
                                title: data.data![index].brandTitle!);
                          },
                          child: Container(
                            alignment: Alignment.center,

                            margin: EdgeInsets.all(
                              Config.screenWidth! * 0.02,
                            ),

                            width: Config.screenWidth! *
                                0.22, //Config.screenWidth! * 0.1,

                            decoration: BoxDecoration(
                              color: ColorResources.COLOR_WHITE,
                              shape: BoxShape.circle,
                              boxShadow: [
                                BoxShadow(
                                    color: ColorResources.COLOR_BLACK
                                        .withOpacity(0.4),
                                    offset: Offset(0, 2),
                                    spreadRadius: 0.4,
                                    blurRadius: 0.4)
                              ],
                            ),

                            child: Container(
                              alignment: Alignment.center,
                              height: Config.screenHeight! * 0.23,
                              width: Config.screenWidth! * 0.23,
                              decoration: BoxDecoration(
                                shape: BoxShape.circle,
                                image: DecorationImage(
                                  fit: BoxFit.cover,
                                  image: NetworkImage(
                                    Urls.baseUrlForImage +
                                        data.data![index].photo.toString(),
                                  ),
                                ),
                              ),
                            ),
                          ),
                        );
                      },
                    );
                  },
                  error: (error, s) => Text('Error found'),
                  loading: () => ListView.builder(
                    scrollDirection: Axis.horizontal,
                    shrinkWrap: true,
                    itemCount: 4,
                    itemBuilder: (context, index) {
                      return ShimmerEffectWidget(
                        child: Container(
                          margin: EdgeInsets.all(
                            Config.screenWidth! * 0.02,
                          ),
                          width: Config.screenWidth! * 0.22,
                          height: Config.screenWidth! * 0.22,
                          alignment: Alignment.topCenter,
                          decoration: BoxDecoration(
                            shape: BoxShape.circle,
                            color: Colors.amber,
                          ),
                        ),
                      );
                    },
                  ),
                ),
              ),

              spaceVertical(percentange: 0.03),

              spaceVertical(percentange: 0.04),
              DivHeadingWidget(
                  title: 'popular'.tr,
                  Ontap: () {
                    Get.to(() => AllProdutsViewPage(
                          title: 'Popular',
                          products: popularProducts!,
                        ));
                  }),

              spaceVertical(percentange: 0.03),

              Padding(
                padding: EdgeInsets.only(left: Config.screenWidth! * 0.03),
                child: SizedBox(
                  height: Config.screenHeight! * 0.33,
                  child: getPopular.when(
                    data: (data) {
                      popularProducts = data;
                      return ListView(
                        padding: EdgeInsets.only(
                          left: Config.screenWidth! * 0.03,
                          right: Config.screenWidth! * 0.03,
                        ),
                        shrinkWrap: true,
                        //    physics: const NeverScrollableScrollPhysics(),
                        scrollDirection: Axis.horizontal,
                        // gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                        //   crossAxisSpacing: Config.screenWidth! * 0.03,
                        //   mainAxisSpacing: Config.screenWidth! * 0.03,
                        //   childAspectRatio: 1 / 1.5,
                        //   crossAxisCount: 2,
                        // ),
                        children: data.data!
                            .map(
                              (e) => Padding(
                                padding:
                                    const EdgeInsets.symmetric(horizontal: 8.0),
                                child: productsView(
                                  e,
                                  context,
                                  () {
                                    if (GetStorage().read('token') != null) {
                                      HomePageRepository().addToCart(
                                        context: context,
                                        payLoad: {
                                          'product_id': e.id,
                                          'product_quantity': e.quantity,
                                          'product_price': e.price,
                                          'color_code': e.color![0].toString(),
                                          'product_total_price': e.totalPrice,
                                          'size': e.size![0].toString(),
                                        },
                                      );
                                      ref.refresh(cartList);
                                    } else {
                                      Get.toNamed('/loginerrorpage');
                                    }
                                  },
                                ),
                              ),
                            )
                            .toList(),
                      );
                    },
                    error: (error, stackTrace) => Text(error.toString()),
                    loading: () => ListView.builder(
                      scrollDirection: Axis.horizontal,
                      shrinkWrap: true,
                      itemCount: 4,
                      itemBuilder: (context, index) {
                        return ShimmerEffectWidget(
                          child: Container(
                            margin: EdgeInsets.all(
                              Config.screenWidth! * 0.02,
                            ),
                            width: Config.screenWidth! * 0.22,
                            height: Config.screenWidth! * 0.22,
                            alignment: Alignment.topCenter,
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              color: Colors.amber,
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                ),
              ),

              SizedBox(
                height: Config.screenHeight! * 0.004,
              ),

              //here

              spaceVertical(
                percentange: 0.04,
              ),

              DivHeadingWidget(
                  title: 'exclusive'.tr,
                  Ontap: () {
                    Get.to(() => AllProdutsViewPage(
                        title: 'Exclusive Products',
                        products: exclusiveProducts!));
                  }),

              spaceVertical(
                percentange: 0.02,
              ),

              Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: SizedBox(
                  height: Config.screenHeight! * 0.34,
                  child: SizedBox(
                    height: Config.screenHeight! * 0.34,
                    child: getExclusive.when(
                      data: (data) {
                        return ListView(
                          padding: EdgeInsets.only(
                            left: Config.screenWidth! * 0.03,
                            right: Config.screenWidth! * 0.03,
                          ),
                          shrinkWrap: true,

                          scrollDirection: Axis.horizontal,
                          // gridDelegate:
                          //     SliverGridDelegateWithFixedCrossAxisCount(
                          //   crossAxisSpacing: Config.screenWidth! * 0.03,
                          //   mainAxisSpacing: Config.screenWidth! * 0.03,
                          //   childAspectRatio: 1 / 1.5,
                          //   crossAxisCount: 2,
                          // ),
                          children: data.data!
                              .map(
                                (e) => Padding(
                                  padding: const EdgeInsets.symmetric(
                                      horizontal: 8.0),
                                  child: productsView(
                                    e,
                                    context,
                                    () {
                                      if (GetStorage().read('token') != null) {
                                        showDialog(
                                          context: context,
                                          builder: (context) => AlertDialog(
                                            content:
                                                CircularProgressIndicator(),
                                          ),
                                        );
                                        HomePageRepository().addToCart(
                                          productName: e.productName,
                                          context: context,
                                          payLoad: {
                                            'product_id': e.id,
                                            'product_quantity': e.quantity,
                                            'product_price': e.price,
                                            'color_code':
                                                e.color![0].toString(),
                                            'product_total_price': e.totalPrice,
                                            'size': e.size![0].toString(),
                                          },
                                        );
                                        ref.refresh(cartList);
                                      } else {
                                        Get.toNamed('/loginerrorpage');
                                      }
                                    },
                                  ),
                                ),
                              )
                              .toList(),
                        );
                      },
                      error: (error, stackTrace) => Text(error.toString()),
                      loading: () => Text('data'),
                    ),
                  ),
                ),
              ),

              spaceVertical(
                percentange: 0.04,
              ),

              DivHeadingWidget(
                title: 'trending_deals'.tr,
                Ontap: () {
                  Get.to(() => AllProdutsViewPage(
                      title: 'Trending Deals', products: trendyProducts!));
                },
              ),

              spaceVertical(
                percentange: 0.02,
              ),

              SizedBox(
                height: Config.screenHeight! * 0.18,
                child: getTrendy.when(
                  data: ((data) {
                    trendyProducts = data;
                    return ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemCount: data.data!.length,
                      itemBuilder: (context, index) => Card(
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10.0),
                        ),
                        child: GestureDetector(
                          onTap: () {},
                          child: Container(
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(10),
                              image: DecorationImage(
                                image: NetworkImage(
                                  Urls.baseUrlForImage +
                                      data.data![index].image!,
                                  scale: 3,
                                ),
                                fit: BoxFit.fill,
                              ),
                            ),
                            width: Config.screenWidth! * 0.6,
                            alignment: Alignment.center,
                            padding: EdgeInsets.all(Config.screenWidth! * 0.01),
                            child: Container(
                              padding:
                                  EdgeInsets.all(Config.screenWidth! * 0.01),
                              height: Config.screenHeight! * 0.14,
                              width: Config.screenWidth! * 0.34,
                              alignment: Alignment.centerLeft,
                              decoration: BoxDecoration(
                                color:
                                    ColorResources.COLOR_BLACK.withOpacity(0.5),
                                borderRadius: BorderRadius.circular(10),
                              ),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  spaceVertical(percentange: 0.01),
                                  CustomTextWidget(
                                    title: 'Super Flash Sale',
                                    textstyle: Theme.of(context)
                                        .textTheme
                                        .headline1!
                                        .copyWith(
                                          fontSize: Config.screenWidth! * 0.04,
                                          fontWeight: FontWeight.w600,
                                          color: ColorResources.COLOR_WHITE,
                                        ),
                                  ),
                                  spaceVertical(percentange: 0.01),
                                  CustomTextWidget(
                                    title: data.data![index].discountPrice! +
                                        '% off',
                                    textstyle: Theme.of(context)
                                        .textTheme
                                        .headline1!
                                        .copyWith(
                                          fontSize: Config.screenWidth! * 0.04,
                                          fontWeight: FontWeight.w600,
                                          color: ColorResources.COLOR_WHITE,
                                        ),
                                  ),
                                  spaceVertical(percentange: 0.01),
                                  GestureDetector(
                                    onTap: () {
                                      Navigator.pushNamed(
                                        context, '/trendydetails',

                                        // arguments: trending_item[index]);
                                      );
                                    },
                                    child: Container(
                                      alignment: Alignment.center,
                                      child: CustomTextWidget(
                                        title: 'See More',
                                        textstyle: Theme.of(context)
                                            .textTheme
                                            .headline1!
                                            .copyWith(
                                              fontSize:
                                                  Config.screenWidth! * 0.04,
                                              fontWeight: FontWeight.w600,
                                              color: ColorResources.COLOR_BLACK,
                                            ),
                                      ),
                                      height: Config.screenHeight! * 0.03,
                                      width: Config.screenWidth! * 0.25,
                                      decoration: BoxDecoration(
                                        color: ColorResources.COLOR_WHITE,
                                        borderRadius: BorderRadius.circular(6),
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            ),
                          ),
                        ),
                        color: Colors.blue,
                      ),
                    );
                  }),
                  error: ((error, s) => Text(error.toString())),
                  loading: (() => ListView.builder(
                        scrollDirection: Axis.horizontal,
                        shrinkWrap: true,
                        itemCount: 4,
                        itemBuilder: (context, index) {
                          return ShimmerEffectWidget(
                            child: Container(
                              margin: EdgeInsets.all(
                                Config.screenWidth! * 0.02,
                              ),
                              width: Config.screenWidth! * 0.22,
                              height: Config.screenWidth! * 0.22,
                              alignment: Alignment.topCenter,
                              decoration: BoxDecoration(
                                shape: BoxShape.circle,
                                color: Colors.amber,
                              ),
                            ),
                          );
                        },
                      )),
                ),
              ),

              spaceVertical(
                percentange: 0.04,
              ),

              DivHeadingWidget(
                title: 'products'.tr,
                Ontap: () {
                  Get.to(() => AllProdutsViewPage(
                      title: 'All Products', products: allProducts!));
                },
              ),

              spaceVertical(percentange: 0.02),

              getProducts.when(
                data: ((data) {
                  allProducts = data;

                  return GridView(
                    padding: EdgeInsets.only(
                      left: Config.screenWidth! * 0.03,
                      right: Config.screenWidth! * 0.03,
                    ),
                    shrinkWrap: true,
                    physics: const NeverScrollableScrollPhysics(),
                    scrollDirection: Axis.vertical,
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisSpacing: Config.screenWidth! * 0.03,
                      mainAxisSpacing: Config.screenWidth! * 0.03,
                      childAspectRatio: 1 / 1.5,
                      crossAxisCount: 2,
                    ),
                    children: data.data!
                        .map(
                          (e) => productsView(
                            e,
                            context,
                            () {
                              if (GetStorage().read('token') != null) {
                                HomePageRepository().addToCart(
                                  context: context,
                                  payLoad: {
                                    'product_id': e.id,
                                    'product_quantity': e.quantity,
                                    'product_price': e.price,
                                    'color_code': e.color![0].toString(),
                                    'product_total_price': e.totalPrice,
                                    'size': e.size![0].toString(),
                                  },
                                );
                                ref.refresh(cartList);
                              } else {
                                Get.toNamed('/loginerrorpage');
                              }
                            },
                          ),
                        )
                        .toList(),
                  );
                }),
                error: ((error, s) => Text(
                      error.toString(),
                    )),
                loading: (() => ListView.builder(
                      scrollDirection: Axis.horizontal,
                      shrinkWrap: true,
                      itemCount: 4,
                      itemBuilder: (context, index) {
                        return ShimmerEffectWidget(
                          child: Container(
                            margin: EdgeInsets.all(
                              Config.screenWidth! * 0.02,
                            ),
                            width: Config.screenWidth! * 0.22,
                            height: Config.screenWidth! * 0.22,
                            alignment: Alignment.topCenter,
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              color: Colors.amber,
                            ),
                          ),
                        );
                      },
                    )),
              ),

              spaceVertical(
                percentange: 0.051,
              ),
            ],
          ),
        ),
      ),
    );
  }

  Future<dynamic> addToCartMethod(
    BuildContext context,
    products.AllProductsModel data,
    int index,
    bool colorVisibility,
    bool sizeVisibility,
    WidgetRef ref,
  ) {
    int chooseCol = 0, chooseSize = 0;
    return showModalBottomSheet(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.only(
          topLeft: const Radius.circular(10.0),
          topRight: const Radius.circular(10.0),
        ),
      ),
      context: context,
      builder: (context) {
        return WillPopScope(
          onWillPop: () {
            ref.watch(sizeChoose.state).state = -1;
            ref.watch(colorChoose.state).state = -1;
            return Future(() => true);
          },
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: SingleChildScrollView(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Card(
                        child: Image.network(
                          Urls.baseUrlForImage +
                              data.data![index].image.toString(),
                          width: 100,
                          height: 100,
                          fit: BoxFit.cover,
                        ),
                      ),
                      Expanded(
                        flex: 5,
                        child: Padding(
                          padding: const EdgeInsets.symmetric(
                              vertical: 5, horizontal: 5),
                          child: SizedBox(
                            //color: Colors.amber,
                            height: 100,
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(
                                  '\$' + data.data![index].discountPrice!,
                                  style: TextStyle(
                                    color: Colors.red.shade700,
                                    fontSize: 18,
                                    fontWeight: FontWeight.bold,
                                  ),
                                  overflow: TextOverflow.ellipsis,
                                ),
                                Text(
                                  '\$' + data.data![index].price!,
                                  style: TextStyle(
                                      decoration: TextDecoration.lineThrough),
                                  overflow: TextOverflow.ellipsis,
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                      Expanded(
                        child: Padding(
                          padding: const EdgeInsets.symmetric(vertical: 5),
                          child: Container(
                            alignment: Alignment.topRight,
                            height: 100,
                            // color: Colors.blueGrey,
                            child: InkWell(
                              onTap: () {
                                ref.watch(sizeChoose.state).state = -1;
                                ref.watch(colorChoose.state).state = -1;
                                Get.back();
                              },
                              child: const Icon(
                                Icons.close,
                              ),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const Divider(),
                  const Padding(
                    padding: EdgeInsets.symmetric(horizontal: 5),
                    child: Text(
                      'Color Family',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ),
                  SizedBox(
                    height: 40,
                    child: ListView.builder(
                      shrinkWrap: true,
                      scrollDirection: Axis.horizontal,
                      itemCount: data.data![index].color!.length,
                      itemBuilder: (context, x) {
                        return Consumer(
                          builder: (context, ref, child) => GestureDetector(
                            onTap: () {
                              ref.watch(colorChoose.state).state = x;
                              final color = data.data![index].color![x];
                              print(color);
                            },
                            child: Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: ClipRRect(
                                borderRadius: BorderRadius.circular(10),
                                child: Container(
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(10),
                                    border:
                                        ref.watch(colorChoose.state).state == x
                                            ? Border.all(
                                                color: Colors.amber,
                                                width: 3,
                                              )
                                            : Border.all(
                                                color: Colors.black,
                                                width: 1,
                                              ),
                                    color: Color(
                                      int.parse(
                                        '0xff' +
                                            data.data![index].color![x]
                                                .replaceAll('#', ''),
                                      ),
                                    ),
                                  ),
                                  //height: 30,
                                  width: 50,
                                ),
                              ),
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                  const Divider(),
                  const Padding(
                    padding: EdgeInsets.symmetric(horizontal: 5),
                    child: Text(
                      'Size',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ),
                  SizedBox(
                    height: 40,
                    child: ListView.builder(
                      shrinkWrap: true,
                      scrollDirection: Axis.horizontal,
                      itemCount: data.data![index].size?.length,
                      itemBuilder: (context, xi) {
                        return Consumer(
                          builder: (context, ref, child) => GestureDetector(
                            onTap: () {
                              ref.watch(sizeChoose.state).state = xi;

                              final size = data.data![index].size![xi];
                              print(size);
                            },
                            child: Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: ClipRRect(
                                borderRadius: BorderRadius.circular(10),
                                child: Container(
                                  alignment: Alignment.center,
                                  width: 50,
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(10),
                                    color: Colors.blueGrey,
                                    border:
                                        ref.watch(sizeChoose.state).state == xi
                                            ? Border.all(
                                                color: Colors.amber,
                                                width: 3,
                                              )
                                            : Border.all(
                                                color: Colors.black,
                                                width: 1,
                                              ),
                                  ),
                                  child: Text(
                                    data.data![index].size![xi]
                                        .toString()
                                        .replaceAll('Size.', ''),
                                    style: TextStyle(
                                      color: Theme.of(context)
                                          .colorScheme
                                          .onPrimary,
                                    ),
                                  ),
                                ),
                              ),
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                  const Divider(),

                  //Quantity section
                  Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 5),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        const Text(
                          'Quantity',
                          style: TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.w400,
                          ),
                        ),
                        SizedBox(
                          //color: Colors.red,
                          height: 40,
                          width: 100,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Card(
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(50),
                                ),
                                child: InkWell(
                                  onTap: () {
                                    if (ref.read(counterProvider.state).state >
                                        1) {
                                      ref.read(counterProvider.state).state--;
                                    }
                                  },
                                  child: Container(
                                    alignment: Alignment.center,
                                    height: 30,
                                    width: 30,
                                    child: const Text(
                                      '-',
                                      style: TextStyle(
                                        fontSize: 18,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ),
                                ),
                              ),
                              Consumer(
                                builder: (context, ref1, _) {
                                  final count =
                                      ref1.watch(counterProvider.state).state;
                                  return Text(
                                    count.toString(),
                                    style: TextStyle(
                                      fontSize: 17,
                                      fontWeight: FontWeight.w400,
                                    ),
                                  );
                                },
                              ),
                              Card(
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(50),
                                ),
                                child: InkWell(
                                  onTap: () {
                                    ref.read(counterProvider.state).state++;
                                  },
                                  child: Container(
                                    alignment: Alignment.center,
                                    height: 30,
                                    width: 30,
                                    child: const Text(
                                      '+',
                                      style: TextStyle(
                                        fontSize: 18,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                  const Divider(),
                  Container(
                    width: double.infinity,
                    alignment: Alignment.center,
                    child: ElevatedButton(
                      style: ButtonStyle(
                        alignment: Alignment.center,
                        minimumSize: MaterialStateProperty.all(
                          Size(
                            Config.screenWidth! * 0.9,
                            Config.screenHeight! * 0.055,
                          ),
                        ),
                      ),
                      onPressed: () {
                        HomePageRepository().addToCart(
                          context: context,
                          payLoad: {
                            'product_id': data.data![index].id,
                            'product_quantity':
                                ref.watch(counterProvider.state).state,
                            'product_price': data.data![index].price,
                            'color_code': data.data![index]
                                .color![ref.watch(colorChoose.state).state]
                                .toString(),
                            'product_total_price':
                                data.data![index].discountPrice,
                            'size': data.data![index]
                                .size![ref.watch(sizeChoose.state).state]
                                .toString(),
                          },
                        );
                      },
                      child: Text(
                        'Add to cart',
                        style: TextStyle(
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        );
      },
    );
  }
}