import 'package:flutter/material.dart';
import 'package:top_news_app/helper/helper.dart';
import 'package:top_news_app/model/Article.dart';
import 'package:top_news_app/screen/author_post_screens.dart';
import 'package:top_news_app/screen/category_ways_post_list_screen.dart';
import 'package:top_news_app/screen/news_details_screen.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:simple_gradient_text/simple_gradient_text.dart';
import '../helper/image_cached.dart';
import '../providers/article_provider.dart';
import '../services/storage_service.dart';

class NewsCardWidgetSmTwo extends StatefulWidget {
  final ArticleData post;

  const NewsCardWidgetSmTwo({super.key, required this.post});

  @override
  State<NewsCardWidgetSmTwo> createState() => _NewsCardWidgetSmTwoState();
}

class _NewsCardWidgetSmTwoState extends State<NewsCardWidgetSmTwo> {
  bool isAuth = false;
  var storage = StorageService();
  bool isBookMark = false;
  var articleProvider = ArticleProvider();


  bookMark() {
    if(!isAuth){
      dialogLogin(context);
    }else{
      storeBookMark();
    }

  }

  storeBookMark() async{
    try{
      isBookMark =  await articleProvider.bookMarking(widget.post.postId);
    } catch (e) {
      rethrow;
    }

    setState(() {

    });
  }

  checkAuth() async {
    isAuth = (await storage.isAuthInLocal())!;
    setState(() {
      isBookMark = widget.post.bookmark!;
    });
  }

  @override
  void initState()  {
    super.initState();
    checkAuth();
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Card(
      clipBehavior: Clip.antiAliasWithSaveLayer,
      elevation: 4,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.max,
        children: [
          Padding(
            padding: const EdgeInsetsDirectional.fromSTEB(6, 0, 0, 0),
            child: SizedBox(
              width: size.width - 150,
              height: 145,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  GestureDetector(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>CategoryWaysPostListScreen(title: '${widget.post.categoriesName?[0]}', id: '${widget.post.categoriesId?[0]}',)));
                    },
                    child: Align(
                      alignment: const AlignmentDirectional(-1.00, 0.00),
                      child: Padding(
                        padding:
                        const EdgeInsetsDirectional.fromSTEB(0, 6, 0, 6),
                        child: GradientText(
                          '${widget.post.categoriesName?[0]}',
                          style: GoogleFonts.robotoSerif(
                              fontSize: 12,
                              fontWeight: FontWeight.normal
                          ),
                          colors: const [
                            primaryColors,
                            primaryColorsAccent
                          ],
                          gradientDirection: GradientDirection.ltr,
                          gradientType: GradientType.linear,
                        ),
                      ),
                    ),
                  ),
                  GestureDetector(
                    onTap: (){
                      Navigator.push(context, MaterialPageRoute(builder: (context)=>NewsDetailsScreen(data: widget.post,)));
                    },
                    child: Text(
                      '${widget.post.title}',
                      maxLines: 2,
                      style: GoogleFonts.robotoSerif(
                        fontSize: 14,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  customSizeBox(5),
                  Row(
                    mainAxisSize: MainAxisSize.max,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      GestureDetector(
                        onTap: (){
                          Navigator.push(context, MaterialPageRoute(builder: (context)=>AuthorPostScreens(name: '${widget.post.authorName}', id: '${widget.post.authorId}', image: '${widget.post.authorAvatar}',randomNumber: widget.post.randomNumber ?? 0,)));
                        },
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          children: [
                            Hero(
                              tag: 'avatar-${widget.post.randomNumber}',
                              child: Container(
                                width: 20,
                                height: 20,
                                clipBehavior: Clip.antiAlias,
                                decoration: const BoxDecoration(
                                  shape: BoxShape.circle,
                                ),
                                child: Image.network(
                                  '${widget.post.authorAvatar}',
                                  fit: BoxFit.cover,
                                ),
                              ),
                            ),
                            Padding(
                              padding: const EdgeInsets.symmetric(horizontal: 10),
                              child: Text(
                                '${widget.post.authorName}',
                                style: GoogleFonts.robotoSerif(
                                  fontWeight: FontWeight.w400,
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),

                  Row(
                    mainAxisSize: MainAxisSize.max,
                    mainAxisAlignment:
                    MainAxisAlignment.spaceBetween,
                    children: [
                      Row(
                        mainAxisSize: MainAxisSize.max,
                        children: [
                          Icon(
                            Icons.remove_red_eye,
                            color: Theme.of(context).iconTheme.color,
                            size: 18,
                          ),
                          Padding(
                            padding: const EdgeInsets.symmetric(horizontal: 10),
                            child: Text(
                              '${widget.post.views}',
                              style: GoogleFonts.robotoSerif(
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          ),
                        ],
                      ),
                       Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 10),
                        child: GestureDetector(
                          onTap: (){
                            bookMark();
                          },
                          child:  Card(
                            elevation: elevation,
                            color: isBookMark ? primaryColors : Colors.white,
                            child: Padding(
                              padding: const EdgeInsets.all(3.0),
                              child: Icon(
                                Icons.bookmark_border,
                                size: 24,
                                color: isBookMark ? Colors.white : primaryColors,
                              ),
                            ),
                          ),
                        ),),
                    ],
                  ),

                  customSizeBox(4),
                ],
              ),
            ),
          ),
          GestureDetector(
            onTap: (){
              Navigator.push(context, MaterialPageRoute(builder: (context)=> NewsDetailsScreen(data: widget.post,)));
            },
            child: Hero(
              tag: 'post-${widget.post.randomNumber}',
              child: ClipRRect(
                  borderRadius: BorderRadius.circular(8),
                  child:ImageCached(image: '${widget.post.thumbnail}',width: 135,
                    height: 135,
                    fit: BoxFit.cover, blur: false,)
              ),
            ),
          ),
        ],
      ),
    );
  }
}
