import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:initial_folder/helper/validator.dart';
import 'package:initial_folder/providers/whislist_provider.dart';
import 'package:initial_folder/providers/wishlist_post_provider.dart';
import 'package:initial_folder/screens/detail_course/detail_course_screen.dart';
import 'package:provider/provider.dart';
import 'package:shimmer/shimmer.dart';

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

class WishlistCard extends StatelessWidget {
  const WishlistCard({
    Key? key,
    this.width = 120,
    this.pad = 20,
    required this.thumbnail,
    required this.id,
    required this.isTopCourse,
    required this.title,
    required this.instructorName,
    required this.rating,
    required this.specificRating,
    required this.numberOfRatings,
    required this.price,
    required this.realPrice,
    required this.press,
    required this.courseId,
  }) : super(key: key);

  final double width;
  final double pad;
  final String thumbnail,
      title,
      instructorName,
      price,
      realPrice,
      rating,
      specificRating,
      numberOfRatings,
      id,
      isTopCourse,
      courseId;
  final VoidCallback press;
  // final VoidCallback? whislistPress;
  // final Widget? iconWishlist;

  @override
  Widget build(BuildContext context) {
     final themeProvider = Provider.of<ThemeProvider>(context);
    WishlistPostProvider wishlistPostProvider =
        Provider.of<WishlistPostProvider>(context);
    final Brightness brightnessValue =
        MediaQuery.of(context).platformBrightness;
    bool isDarkMode = brightnessValue == Brightness.dark;
    //CourseProvider courseProvider = Provider.of<CourseProvider>(context);
    // final formatCurrency =
    //     new NumberFormat.simpleCurrency(decimalDigits: 0, locale: 'id_ID');
    return Padding(
        padding: EdgeInsets.only(
            left: getProportionateScreenWidth(15),
            right: getProportionateScreenWidth(15),
            bottom: getProportionateScreenHeight(10)),
        child: Container(
            width: getProportionateScreenWidth(320),
            // padding: EdgeInsets.only(left: getProportionateScreenWidth(pad)),
            decoration: BoxDecoration(
              color: Theme.of(context).colorScheme.primaryContainer,
              borderRadius: BorderRadius.circular(10),
              boxShadow: [
                BoxShadow(
                  color: isDarkMode ? Colors.black : Colors.grey,
                  spreadRadius: 0.01,
                  blurRadius: 2,
                  offset: Offset(0, 1), // Shadow position
                ),
              ],
            ),
            child: Padding(
              padding: EdgeInsets.all(3),
              child: InkWell(
                onTap: press,
                child: Container(
                  width: getProportionateScreenWidth(width),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Container(
                              width: getProportionateScreenWidth(170),
                              height: getProportionateScreenHeight(85),
                              padding: EdgeInsets.all(10),
                              child: AspectRatio(
                                aspectRatio: 1.7,
                                child: CachedNetworkImage(
                                  imageUrl: thumbnail,
                                  imageBuilder: (context, imageProvider) =>
                                      Container(
                                    decoration: BoxDecoration(
                                      borderRadius: BorderRadius.vertical(
                                          top: Radius.circular(5),
                                          bottom: Radius.circular(5)),
                                      image: DecorationImage(
                                        image: imageProvider,
                                        fit: BoxFit.fill,
                                      ),
                                    ),
                                  ),
                                  placeholder: (context, url) => Shimmer(
                                    child: Container(
                                      color: thirdColor,
                                    ),
                                    gradient: LinearGradient(stops: [
                                      0.4,
                                      0.5,
                                      0.6
                                    ], colors: [
                                      secondaryColor,
                                      thirdColor,
                                      secondaryColor
                                    ]),
                                  ),
                                  errorWidget: (context, url, error) =>
                                      Icon(Icons.error),
                                ),
                              ),
                            ),
                          ]),
                      Flexible(
                        flex: 10,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            SizedBox(height: getProportionateScreenWidth(10)),
                            Container(
                              padding: EdgeInsets.only(left: 2, right: 5),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Flexible(
                                          child: Text(
                                        title,
                                        style: thirdTextStyle.copyWith(
                                            letterSpacing: 1,
                                            fontSize:
                                                getProportionateScreenWidth(12),
                                            color: Theme.of(context)
                                                .colorScheme
                                                .onPrimary,
                                            fontWeight: semiBold),
                                        maxLines: 2,
                                        overflow: TextOverflow.ellipsis,
                                      )),
                                      SizedBox(
                                        width: getProportionateScreenWidth(15),
                                      ),
                                      Padding(
                                        padding: EdgeInsets.all(5),
                                        child: GestureDetector(
                                          onTap: () async {
                                            await wishlistPostProvider
                                                .deleteWishlist(
                                                    int.parse(courseId));
                                            await Provider.of<WishlistProvider>(
                                                    context,
                                                    listen: false)
                                                .getWishlist();
                                            print('X ditekan' + id);
                                          },
                                          child: Icon(
                                            FontAwesomeIcons.x,
                                            color: Theme.of(context)
                                                .colorScheme
                                                .onPrimary,
                                            size:
                                                getProportionateScreenWidth(15),
                                          ),
                                        ),
                                      )
                                    ],
                                  ),
                                  SizedBox(
                                      height: getProportionateScreenWidth(6)),
                                  RichText(
                                    text: new TextSpan(
                                      style: primaryTextStyle.copyWith(
                                          fontSize:
                                              getProportionateScreenWidth(10),
                                          color: secondaryColor),
                                      children: <TextSpan>[
                                        new TextSpan(
                                          text: 'Oleh ',
                                          style: thirdTextStyle.copyWith(
                                            fontWeight: reguler,
                                          ),
                                        ),
                                        new TextSpan(
                                          text: instructorName,
                                          style: thirdTextStyle.copyWith(
                                            fontWeight: semiBold,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                  SizedBox(
                                      height: getProportionateScreenWidth(6)),
                                  Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(
                                        price,
                                        style: thirdTextStyle.copyWith(
                                          letterSpacing: 0.5,
                                          fontSize:
                                              SizeConfig.blockHorizontal! * 3,
                                          fontWeight: reguler,
                                          color: Theme.of(context)
                                              .colorScheme
                                              .onPrimary,
                                        ),
                                      ),
                                      (isTopCourse == 1.toString())
                                          ? Container(
                                              alignment: Alignment.center,
                                              width:
                                                  getProportionateScreenWidth(
                                                      48),
                                              child: Text(
                                                'Populer',
                                                style: primaryTextStyle.copyWith(
                                                    letterSpacing: 0.5,
                                                    color: Theme.of(context)
                                                        .colorScheme
                                                        .onPrimary,
                                                    fontSize: SizeConfig
                                                            .blockHorizontal! *
                                                        2.5,
                                                    fontWeight: reguler),
                                              ),
                                              decoration: BoxDecoration(
                                                color: Color(0xffECEB98),
                                                borderRadius:
                                                    BorderRadius.circular(5),
                                              ),
                                            )
                                          : SizedBox(height: 0, width: 0),
                                      // InkWell(
                                      //   borderRadius: BorderRadius.circular(50),
                                      //   onTap: () {},
                                      //   child: Container(
                                      //     padding: EdgeInsets.all(getProportionateScreenWidth(8)),
                                      //     height: getProportionateScreenWidth(28),
                                      //     width: getProportionateScreenWidth(28),

                                      //     child: Icon(Icons.favorite,color: sevenColor, size: 10,)
                                      //     ),
                                      //   ),
                                    ],
                                  ),
                                  SizedBox(
                                      height: getProportionateScreenWidth(6)),
                                  (realPrice != 0.toString())
                                      ? Column(
                                          children: [
                                            Row(
                                              mainAxisAlignment:
                                                  MainAxisAlignment
                                                      .spaceBetween,
                                              children: [
                                                Text(
                                                  realPrice,
                                                  style:
                                                      thirdTextStyle.copyWith(
                                                    decoration: TextDecoration
                                                        .lineThrough,
                                                    fontSize:
                                                        getProportionateScreenWidth(
                                                            10),
                                                    fontWeight: reguler,
                                                    color: Theme.of(context)
                                                        .colorScheme
                                                        .onPrimary,
                                                  ),
                                                ),
                                                // IconButton(
                                                //     onPressed: whislistPress,
                                                //     icon: iconWishlist)
                                              ],
                                            ),
                                            SizedBox(
                                                height:
                                                    getProportionateScreenWidth(
                                                        6)),
                                          ],
                                        )
                                      : SizedBox(),
                                  Center(
                                      child: GestureDetector(
                                    onTap: () {
                                      Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                          builder: (context) =>
                                              DetailCourseScreen(
                                            idcourse: courseId,
                                          ),
                                        ),
                                      );
                                    },
                                    child: Container(
                                      height: 35,
                                      // width: 120,
                                      decoration: BoxDecoration(
                                          color: themeProvider.themeData == ThemeClass.darkmode
                              ?primaryColor : primaryColorligtmode,
                                          borderRadius:
                                              BorderRadius.circular(5)),

                                      child: Center(
                                        child: price == 'Gratis'
                                            ? Text(
                                                'Dapatkan Kursus',
                                                style: thirdTextStyle.copyWith(
                                                    fontSize: 12,
                                                    color: Colors.white),
                                              )
                                            : Text(
                                                'Beli Kursus',
                                                style: thirdTextStyle.copyWith(
                                                    fontSize: 12,
                                                    color: Colors.white),
                                              ),
                                      ),
                                    ),
                                  )),
                                  SizedBox(
                                      height: getProportionateScreenWidth(6)),
                                ],
                              ),
                            )
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              ),
            )));
  }
}
