import 'package:flutter/material.dart';
import 'package:initial_folder/base_service.dart';
import 'package:initial_folder/helper/validator.dart';
import 'package:initial_folder/providers/latest_course_provider.dart';
import 'package:initial_folder/screens/detail_course/detail_course_screen.dart';
import 'package:initial_folder/screens/home/components/body_comp/product_card/product_card.dart';
import 'package:initial_folder/screens/home/components/body_comp/product_card/product_card_new.dart';
import 'package:initial_folder/widgets/custom_navigator.dart';
import 'package:provider/provider.dart';
import 'package:shimmer/shimmer.dart';

import '../../../../size_config.dart';
import '../../../../theme.dart';

class LatestCourse extends StatelessWidget {
  const LatestCourse({Key? key, this.text}) : super(key: key);

  final String? text;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(height: getProportionateScreenHeight(20)),
        Padding(
          padding:
              EdgeInsets.symmetric(horizontal: getProportionateScreenWidth(16)),
          child: Row(mainAxisAlignment: MainAxisAlignment.start, children: [
            Text(
              text.toString(),
              textAlign: TextAlign.left,
              style: thirdTextStyle.copyWith(
                letterSpacing: 1,
                fontSize: getProportionateScreenWidth(15),
                fontWeight: semiBold,
              ),
            ),
          ]),
        ),
        SizedBox(height: getProportionateScreenHeight(10)),
        Consumer<LatestCourseProvider>(
          builder: (context, state, _) {
            if (state.state == ResultState.Loading) {
              return Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Padding(
                    padding: EdgeInsets.fromLTRB(20, 0, 0, 0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 105,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 85,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 120,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                          baseColor: Colors.white,
                          highlightColor: Colors.grey,
                          child: Container(
                            height: 15,
                            width: 85,
                            color: Colors.white,
                          ),
                        ),
                      ],
                    ),
                  ),
                  Padding(
                    padding: EdgeInsets.fromLTRB(20, 0, 0, 0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 105,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 85,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 120,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                          baseColor: Colors.white,
                          highlightColor: Colors.grey,
                          child: Container(
                            height: 15,
                            width: 85,
                            color: Colors.white,
                          ),
                        ),
                      ],
                    ),
                  )
                ],
              );
            } else if (state.state == ResultState.HasData) {
              return text != "New Release"
                  ? Container(
                      alignment: Alignment.centerLeft,
                      margin: EdgeInsets.only(
                          left: getProportionateScreenWidth(10)),
                      height: getProportionateScreenHeight(240),
                      child: ListView.builder(
                        scrollDirection: Axis.horizontal,
                        physics: const ScrollPhysics(),
                        shrinkWrap: true,
                        itemCount: state.result.length,
                        itemBuilder: (context, index) {
                          var latestCourse = state.result[index];
                          int price = int.tryParse(
                                  latestCourse.price.replaceAll('.', '')) ??
                              0;
                          int discountPrice = int.tryParse(latestCourse
                                  .discountPrice
                                  .replaceAll('.', '')) ??
                              0;

                          int calculatedPrice =
                              (latestCourse.discountPrice != '0')
                                  ? price - discountPrice
                                  : price;

                          String displayedPrice = (calculatedPrice == 0)
                              ? latestCourse.price
                              : calculatedPrice.toString();
                          // var finalRating = double.parse(
                          //     (topCourse.specificRating![0] / 20).toStringAsFixed(2));
                          return Container(
                            margin: EdgeInsets.only(
                              top: getProportionateScreenHeight(10),
                              bottom: getProportionateScreenHeight(10),
                            ),
                            child: Padding(
                              padding: EdgeInsets.only(
                                right: getProportionateScreenWidth(18),
                                bottom: getProportionateScreenWidth(5),
                              ),
                              child: ProductCardNew(
                                totalDiscount: latestCourse.totalDiscount ?? 0,
                                students: latestCourse.students ?? '0',
                                pad: 12,
                                // padRight: 12,
                                id: latestCourse.idCourse,
                                thumbnail: latestCourse.thumbnail ??
                                    '$baseUrl/uploads/courses_thumbnail/course_thumbnail_default_57.jpg',
                                title: latestCourse.title,
                                instructorName: latestCourse.instructorName,
                                specificRating:
                                    (latestCourse.rating.isNotEmpty &&
                                            latestCourse.rating[0]?.avgRating !=
                                                null)
                                        ? latestCourse.rating[0]!.avgRating
                                            .toString()
                                        : '0',
                                rating:
                                    latestCourse.rating[0]!.avgRating != null
                                        ? '${latestCourse.rating[0]!.avgRating}'
                                        : '5.0',
                                numberOfRatings: (latestCourse
                                            .rating.isNotEmpty &&
                                        latestCourse.rating[0]?.totalReview !=
                                            null)
                                    ? latestCourse.rating[0]!.totalReview!
                                    : '0',
                                isTopCourse: latestCourse.topCourse ?? '',
                                price: (latestCourse.price == '0')
                                    ? 'Gratis'
                                    : (latestCourse.promoPrice != '0')
                                        ? numberFormat(latestCourse.promoPrice)
                                        : numberFormat(displayedPrice),
                                realPrice: (latestCourse.price == '0')
                                    ? ''
                                    : numberFormat(latestCourse.price),
                                press: () {
                                  print(latestCourse.idCourse);
                                  Navigator.of(context, rootNavigator: true)
                                      .push(
                                    CustomNavigator(
                                      child: DetailCourseScreen(
                                        idcourse: latestCourse.idCourse,
                                        isPromo: latestCourse.promoPrice != '0'
                                            ? true
                                            : null,
                                      ),
                                    ),
                                  );
                                },
                              ),
                            ),
                          );
                        },
                      ),
                    )
                  : GridView.builder(
                      padding: EdgeInsets.only(
                        right: getProportionateScreenWidth(22),
                        left: getProportionateScreenWidth(7),
                        top: getProportionateScreenHeight(10),
                      ),
                      physics: ScrollPhysics(),
                      shrinkWrap: true,
                      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 2,
                        childAspectRatio: 2.55 / 4,
                        crossAxisSpacing: 16,
                        mainAxisSpacing: 12,
                      ),
                      itemCount: state.result.length,
                      itemBuilder: (context, index) {
                        var latestCourse = state.result[index];
                        int price = int.tryParse(
                                latestCourse.price.replaceAll('.', '')) ??
                            0;
                        int discountPrice = int.tryParse(latestCourse
                                .discountPrice
                                .replaceAll('.', '')) ??
                            0;

                        int calculatedPrice =
                            (latestCourse.discountPrice != '0')
                                ? price - discountPrice
                                : price;

                        String displayedPrice = (calculatedPrice == 0)
                            ? latestCourse.price
                            : calculatedPrice.toString();

                        return Container(
                          margin: EdgeInsets.only(
                              bottom: getProportionateScreenHeight(17)),
                          child: ProductCardNew(
                            totalDiscount: latestCourse.totalDiscount ?? 0,
                            students: latestCourse.students ?? '0',
                            id: latestCourse.idCourse,
                            thumbnail: latestCourse.thumbnail ??
                                'https://vocasia.id/uploads/thumbnails/course_thumbnails/course_thumbnail_default_63.jpg',
                            title: latestCourse.title,
                            instructorName: latestCourse.instructorName,
                            specificRating: double.parse(
                                    latestCourse.rating[0]!.avgRating != null
                                        ? '${latestCourse.rating[0]!.avgRating}'
                                        : '5.0')
                                .toString(),
                            rating: latestCourse.rating[0]!.avgRating != null
                                ? '${latestCourse.rating[0]!.avgRating}'
                                : '5.0',
                            numberOfRatings:
                                latestCourse.rating[0]!.totalReview ?? '0',
                            isTopCourse: '0',
                            price: (latestCourse.discountPrice == '0')
                                ? 'Gratis'
                                : numberFormat(displayedPrice),
                            realPrice: (latestCourse.price == '0')
                                ? ''
                                : numberFormat(latestCourse.price),
                            press: () async {
                              // await Hive.openBox<Wishlist>("wishlist");
                              // await Hive.openBox('carts');

                              Navigator.of(context, rootNavigator: true).push(
                                CustomNavigator(
                                  child: DetailCourseScreen(
                                    idcourse: latestCourse.idCourse,
                                    isPromo: latestCourse.promoPrice != '0'
                                        ? true
                                        : null,
                                  ),
                                ),
                              );
                            },
                          ),
                        );
                      },
                    );
            } else if (state.state == ResultState.NoData) {
              return Center(child: Text(state.message));
            } else if (state.state == ResultState.Error) {
              return Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Padding(
                    padding: EdgeInsets.fromLTRB(20, 0, 0, 0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 105,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 85,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 120,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                          baseColor: Colors.white,
                          highlightColor: Colors.grey,
                          child: Container(
                            height: 15,
                            width: 85,
                            color: Colors.white,
                          ),
                        ),
                      ],
                    ),
                  ),
                  Padding(
                    padding: EdgeInsets.fromLTRB(20, 0, 0, 0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 105,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 85,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 190,
                              color: Colors.white,
                            )),
                        SizedBox(height: 10),
                        Shimmer.fromColors(
                            baseColor: Colors.white,
                            highlightColor: Colors.grey,
                            child: Container(
                              height: 15,
                              width: 120,
                              color: Colors.white,
                            )),
                        SizedBox(height: 8),
                        Shimmer.fromColors(
                          baseColor: Colors.white,
                          highlightColor: Colors.grey,
                          child: Container(
                            height: 15,
                            width: 85,
                            color: Colors.white,
                          ),
                        ),
                      ],
                    ),
                  )
                ],
              );
            } else {
              return Center(child: Text(''));
            }
          },
        )
      ],
    );
  }

  // @override
  // Widget build(BuildContext context) {
  //   return Column(
  //     children: [
  //       Padding(
  //         padding:
  //             EdgeInsets.symmetric(horizontal: getProportionateScreenWidth(16)),
  //         child: Row(mainAxisAlignment: MainAxisAlignment.start, children: [
  //           Text('Kursus Terbaru',
  //               textAlign: TextAlign.left,
  //               style: secondaryTextStyle.copyWith(
  //                   letterSpacing: 1,
  //                   color: tenthColor,
  //                   fontSize: getProportionateScreenWidth(14),
  //                   fontWeight: semiBold)),
  //         ]),
  //       ),
  //       SizedBox(height: 20),
  //       Row(
  //         mainAxisAlignment: MainAxisAlignment.center,
  //         children: [
  //           Icon(Icons.construction_outlined),
  //           Text('Under Construction'),
  //         ],
  //       ),
  //     ],
  //   );
  // }
}